From 470d16803de7533c2fa84663e12968d3126dd14f Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期三, 27 八月 2025 14:17:12 +0800 Subject: [PATCH] 1.设备台账开发联调 --- src/pages/index.vue | 14 src/pages.json | 14 + src/static/images/banner/view-background.png | 0 src/pages/equipmentManagement/ledger/index.vue | 359 +++++++++++++++++++++++++ src/pages/equipmentManagement/ledger/detail.vue | 408 +++++++++++++++++++++++++++++ 5 files changed, 791 insertions(+), 4 deletions(-) diff --git a/src/pages.json b/src/pages.json index fc70bde..955b869 100644 --- a/src/pages.json +++ b/src/pages.json @@ -292,6 +292,20 @@ "navigationBarTitleText": "瀹㈡埛鎷滆", "navigationStyle": "custom" } + }, + { + "path": "pages/equipmentManagement/ledger/index", + "style": { + "navigationBarTitleText": "璁惧鍙拌处", + "navigationStyle": "custom" + } + }, + { + "path": "pages/equipmentManagement/ledger/detail", + "style": { + "navigationBarTitleText": "璁惧鍙拌处璇︽儏", + "navigationStyle": "custom" + } } ], "subPackages": [ diff --git a/src/pages/equipmentManagement/ledger/detail.vue b/src/pages/equipmentManagement/ledger/detail.vue new file mode 100644 index 0000000..97d76aa --- /dev/null +++ b/src/pages/equipmentManagement/ledger/detail.vue @@ -0,0 +1,408 @@ +<template> + <view class="ledger-detail"> + <!-- 浣跨敤閫氱敤椤甸潰澶撮儴缁勪欢 --> + <PageHeader :title="operationType === 'edit' ? '缂栬緫璁惧鍙拌处' : '鏂板璁惧鍙拌处'" @back="goBack" /> + + <!-- 琛ㄥ崟鍐呭 --> + <van-form @submit="sendForm" ref="formRef" label-width="110px" input-align="right" error-message-align="right" scroll-to-error scroll-to-error-position="center"> + <!-- 鍩烘湰淇℃伅 --> + <van-cell-group title="鍩烘湰淇℃伅" inset> + <van-field + v-model="form.deviceName" + label="璁惧鍚嶇О" + placeholder="璇疯緭鍏ヨ澶囧悕绉�" + :rules="formRules.deviceName" + required + clearable + /> + <van-field + v-model="form.deviceModel" + label="瑙勬牸鍨嬪彿" + placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" + :readonly="form.deviceModel != null && operationType === 'edit'" + :rules="formRules.deviceModel" + required + clearable + /> + <van-field + v-model="form.supplierName" + label="渚涘簲鍟�" + required + placeholder="璇疯緭鍏ヤ緵搴斿晢" + :rules="formRules.supplierName" + clearable + /> + <van-field + v-model="form.unit" + label="鍗曚綅" + required + placeholder="璇疯緭鍏ュ崟浣�" + :rules="formRules.unit" + clearable + /> + <van-field + v-model="form.taxRate" + required + label="绋庣巼(%)" + placeholder="璇烽�夋嫨" + readonly + :rules="formRules.taxRate" + @click="showTaxRatePicker" + clearable + /> + <van-field + v-model="form.number" + label="鏁伴噺" + required + type="number" + placeholder="璇疯緭鍏ユ暟閲�" + :rules="formRules.number" + @blur="mathNum" + clearable + /> + <van-field + v-model="form.taxIncludingPriceUnit" + label="鍚◣鍗曚环" + required + type="number" + placeholder="璇疯緭鍏ュ惈绋庡崟浠�" + :rules="formRules.taxIncludingPriceUnit" + @blur="mathNum" + clearable + /> + <van-field + v-model="form.taxIncludingPriceTotal" + label="鍚◣鎬讳环" + placeholder="鑷姩鐢熸垚" + readonly + /> + <van-field + v-model="form.unTaxIncludingPriceTotal" + label="涓嶅惈绋庢�讳环" + placeholder="鑷姩鐢熸垚" + readonly + /> + <van-field + v-model="form.createTime" + label="褰曞叆鏃ユ湡" + placeholder="璇烽�夋嫨" + readonly + @click="showDatePicker" + required + clearable + /> + </van-cell-group> + + <!-- 鎻愪氦鎸夐挳 --> + <view class="footer-btns"> + <van-button class="cancel-btn" @click="goBack">鍙栨秷</van-button> + <van-button class="save-btn" native-type="submit" form-type="submit" :loading="loading">淇濆瓨</van-button> + </view> + </van-form> + + <!-- 绋庣巼閫夋嫨鍣� --> + <van-popup v-model:show="showTaxRate" position="bottom"> + <van-picker + :model-value="taxRatePickerValue" + :columns="taxRateOptions" + @confirm="onTaxRateConfirm" + @cancel="showTaxRate = false" + /> + </van-popup> + + <!-- 鏃ユ湡閫夋嫨鍣� --> + <van-popup v-model:show="showDate" position="bottom"> + <van-date-picker + v-model="currentDate" + title="閫夋嫨鏃ユ湡" + @confirm="onDateConfirm" + @cancel="showDate = false" + /> + </van-popup> + </view> +</template> + +<script setup> +import { ref, computed, onMounted } from 'vue'; +import { onShow } from '@dcloudio/uni-app'; +import PageHeader from '@/components/PageHeader.vue'; +import { getLedgerById, addLedger, editLedger } from '@/api/equipmentManagement/ledger'; +import dayjs from "dayjs"; +import { + calculateTaxIncludeTotalPrice, + calculateTaxExclusiveTotalPrice, +} from "@/utils/summarizeTable"; +import { showToast } from 'vant'; + +defineOptions({ + name: "璁惧鍙拌处琛ㄥ崟", +}); + +// 琛ㄥ崟寮曠敤 +const formRef = ref(null); +const operationType = ref(''); +const loading = ref(false); +const showTaxRate = ref(false); +const taxRatePickerValue = ref([]); +const showDate = ref(false); +const currentDate = ref([new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()]); + +// 琛ㄥ崟楠岃瘉瑙勫垯 +const formRules = { + deviceName: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }], + deviceModel: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }], + supplierName: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }], + unit: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }], + number: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }], + taxIncludingPriceUnit: [{ required: true, trigger: "blur", message: "璇疯緭鍏�" }], + taxRate: [{ required: true, trigger: "change", message: "璇疯緭鍏�" }], +}; + +// 浣跨敤 ref 澹版槑琛ㄥ崟鏁版嵁 +const form = ref({ + deviceName: undefined, // 璁惧鍚嶇О + deviceModel: undefined, // 瑙勬牸鍨嬪彿 + supplierName: undefined, // 渚涘簲鍟� + unit: undefined, // 鍗曚綅 + number: undefined, // 鏁伴噺 + taxIncludingPriceUnit: undefined, // 鍚◣鍗曚环 + taxIncludingPriceTotal: undefined, // 鍚◣鎬讳环 + taxRate: undefined, // 绋庣巼 + unTaxIncludingPriceTotal: undefined, // 涓嶅惈绋庢�讳环 + createTime: dayjs().format("YYYY-MM-DD"), // 褰曞叆鏃ユ湡 +}); + +// 绋庣巼閫夐」 +const taxRateOptions = computed(() => { + return [ + { text: '1', value: 1 }, + { text: '6', value: 6 }, + { text: '13', value: 13 } + ] +}); + +// 鍔犺浇琛ㄥ崟鏁版嵁 +const loadForm = async (id) => { + if (id) { + operationType.value = 'edit'; + } + try { + const { code, data } = await getLedgerById(id); + if (code == 200) { + form.value.deviceName = data.deviceName; + form.value.deviceModel = data.deviceModel; + form.value.supplierName = data.supplierName; + form.value.unit = data.unit; + form.value.number = data.number; + form.value.taxIncludingPriceUnit = data.taxIncludingPriceUnit; + form.value.taxIncludingPriceTotal = data.taxIncludingPriceTotal; + form.value.taxRate = data.taxRate; + form.value.unTaxIncludingPriceTotal = data.unTaxIncludingPriceTotal; + form.value.createTime = data.createTime; + } + } catch (e) { + showToast('鑾峰彇璇︽儏澶辫触'); + } +}; + +// 鏁板璁$畻 +const mathNum = () => { + if (!form.value.taxIncludingPriceUnit) { + showToast("璇疯緭鍏ュ崟浠�"); + return; + } + if (!form.value.number) { + showToast("璇疯緭鍏ユ暟閲�"); + return; + } + form.value.taxIncludingPriceTotal = calculateTaxIncludeTotalPrice( + form.value.taxIncludingPriceUnit, + form.value.number + ); + if (form.value.taxRate) { + form.value.unTaxIncludingPriceTotal = calculateTaxExclusiveTotalPrice( + form.value.taxIncludingPriceTotal, + form.value.taxRate + ); + } +}; + +// 娓呴櫎琛ㄥ崟鏍¢獙鐘舵�� +const clearValidate = () => { + formRef.value?.clearValidate(); +}; + +// 閲嶇疆琛ㄥ崟鏁版嵁鍜屾牎楠岀姸鎬� +const resetForm = () => { + form.value = { + deviceName: undefined, + deviceModel: undefined, + supplierName: undefined, + unit: undefined, + number: undefined, + taxIncludingPriceUnit: undefined, + taxIncludingPriceTotal: undefined, + taxRate: undefined, + unTaxIncludingPriceTotal: undefined, + createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"), + }; +}; + +const resetFormAndValidate = () => { + resetForm(); + clearValidate(); +}; + +// 鎻愪氦琛ㄥ崟 +const sendForm = async () => { + try { + // 鎵嬪姩楠岃瘉琛ㄥ崟 + await formRef.value?.validate(); + + loading.value = true; + const id = getPageId(); + + // 鍑嗗鎻愪氦鏁版嵁锛宑reateTime 鍔犱笂褰撳墠鏃跺垎绉� + const submitData = { ...form.value }; + if (submitData.createTime && !submitData.createTime.includes(':')) { + // 濡傛灉 createTime 鍙寘鍚棩鏈燂紝娣诲姞褰撳墠鏃跺垎绉� + submitData.createTime = submitData.createTime + ' ' + dayjs().format('HH:mm:ss'); + } + + const { code } = id + ? await editLedger({ id: id, ...submitData }) + : await addLedger(submitData); + + if (code == 200) { + showToast("鎿嶄綔鎴愬姛"); + setTimeout(() => { + uni.navigateBack(); + }, 1500); + } else { + loading.value = false; + } + } catch (e) { + loading.value = false; + showToast('琛ㄥ崟楠岃瘉澶辫触'); + } +}; + +// 杩斿洖涓婁竴椤� +const goBack = () => { + uni.navigateBack(); +}; + +// 鑾峰彇椤甸潰鍙傛暟 +const getPageParams = () => { + const pages = getCurrentPages(); + const currentPage = pages[pages.length - 1]; + const options = currentPage.options; + + if (options.id) { + // 缂栬緫妯″紡锛岃幏鍙栬鎯� + loadForm(options.id); + } else { + // 鏂板妯″紡 + operationType.value = 'add'; + } +}; + +// 鑾峰彇椤甸潰ID +const getPageId = () => { + const pages = getCurrentPages(); + const currentPage = pages[pages.length - 1]; + const options = currentPage.options; + return options.id; +}; + +// 鏄剧ず绋庣巼閫夋嫨鍣� +const showTaxRatePicker = () => { + showTaxRate.value = true; +}; + +// 纭绋庣巼閫夋嫨 +const onTaxRateConfirm = ({ selectedValues, selectedOptions }) => { + form.value.taxRate = selectedOptions[0].value; + taxRatePickerValue.value = selectedValues; + showTaxRate.value = false; + mathNum(); // 閲嶆柊璁$畻 +}; + +// 鏄剧ず鏃ユ湡閫夋嫨鍣� +const showDatePicker = () => { + showDate.value = true; +}; + +// 纭鏃ユ湡閫夋嫨 +const onDateConfirm = ({ selectedValues }) => { + // 鍙繚瀛樺勾鏈堟棩锛屼笉鍖呭惈鏃跺垎绉� + form.value.createTime = selectedValues.join('-'); + currentDate.value = selectedValues; + showDate.value = false; +}; + +onShow(() => { + // 椤甸潰鏄剧ず鏃惰幏鍙栧弬鏁� + getPageParams(); +}); + +onMounted(() => { + // 椤甸潰鍔犺浇鏃惰幏鍙栧弬鏁� + getPageParams(); +}); +</script> + +<style scoped lang="scss"> +.ledger-detail { + min-height: 100vh; + background: #f8f9fa; + padding-bottom: 5rem; +} + +.footer-btns { + position: fixed; + left: 0; + right: 0; + bottom: 0; + background: #fff; + display: flex; + justify-content: space-around; + align-items: center; + padding: 0.75rem 0; + box-shadow: 0 -0.125rem 0.5rem rgba(0,0,0,0.05); + z-index: 1000; +} + +.cancel-btn { + font-weight: 400; + font-size: 1rem; + color: #FFFFFF; + width: 6.375rem; + background: #C7C9CC; + box-shadow: 0 0.25rem 0.625rem 0 rgba(3,88,185,0.2); + border-radius: 2.5rem 2.5rem 2.5rem 2.5rem; +} + +.save-btn { + font-weight: 400; + font-size: 1rem; + color: #FFFFFF; + width: 14rem; + background: linear-gradient( 140deg, #00BAFF 0%, #006CFB 100%); + box-shadow: 0 0.25rem 0.625rem 0 rgba(3,88,185,0.2); + border-radius: 2.5rem 2.5rem 2.5rem 2.5rem; +} + +// 鍝嶅簲寮忚皟鏁� +@media (max-width: 768px) { + .submit-section { + padding: 12px; + } +} + +.tip-text { + padding: 4px 16px 0 16px; + font-size: 12px; + color: #888; +} +</style> \ No newline at end of file diff --git a/src/pages/equipmentManagement/ledger/index.vue b/src/pages/equipmentManagement/ledger/index.vue new file mode 100644 index 0000000..0114c15 --- /dev/null +++ b/src/pages/equipmentManagement/ledger/index.vue @@ -0,0 +1,359 @@ +<template> + <view class="device-ledger"> + <!-- 浣跨敤閫氱敤椤甸潰澶撮儴缁勪欢 --> + <PageHeader title="璁惧鍙拌处" @back="goBack" /> + + <!-- 鎼滅储鍜岀瓫閫夊尯鍩� --> + <view class="search-filter-section"> + <view class="search-bar"> + <view class="search-input"> + <input + class="search-text" + placeholder="璇疯緭鍏ヨ澶囧悕绉�" + v-model="searchKeyword" + confirm-type="search" + @confirm="getList" + /> + </view> + <view class="filter-button" @click="getList"> + <up-icon name="search" size="24" color="#999"></up-icon> + </view> + </view> + </view> + + <!-- 璁惧鍙拌处鍒楄〃 --> + <view class="ledger-list" v-if="ledgerList.length > 0"> + <view v-for="(item, index) in ledgerList" :key="index"> + <view class="ledger-item"> + <view class="item-header"> + <view class="item-left"> + <view class="document-icon"> + <up-icon name="file-text" size="16" color="#ffffff"></up-icon> + </view> + <text class="item-id">璁惧鍚嶇О锛歿{ item.deviceName }}</text> + </view> + </view> + <up-divider></up-divider> + + <view class="item-details"> + <view class="detail-row"> + <text class="detail-label">瑙勬牸鍨嬪彿</text> + <text class="detail-value">{{ item.deviceModel || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">渚涘簲鍟�</text> + <text class="detail-value">{{ item.supplierName || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">鍗曚綅</text> + <text class="detail-value">{{ item.unit || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">鏁伴噺</text> + <text class="detail-value">{{ item.number || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">鍚◣鍗曚环</text> + <text class="detail-value highlight">{{ item.taxIncludingPriceUnit || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">鍚◣鎬讳环</text> + <text class="detail-value highlight">{{ item.taxIncludingPriceTotal || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">绋庣巼</text> + <text class="detail-value">{{ item.taxRate || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">涓嶅惈绋庢�讳环</text> + <text class="detail-value highlight">{{ item.unTaxIncludingPriceTotal || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">褰曞叆浜�</text> + <text class="detail-value">{{ item.createUser || '-' }}</text> + </view> + <view class="detail-row"> + <text class="detail-label">褰曞叆鏃ユ湡</text> + <text class="detail-value">{{ item.createTime || '-' }}</text> + </view> + </view> + + <!-- 鎸夐挳鍖哄煙锛屽弬鑰� invoiceLedger 鐨勬牱寮� --> + <view class="action-buttons"> + <van-button + type="primary" + size="small" + class="action-btn" + @click="edit(item.id)" + > + 缂栬緫 + </van-button> + <van-button + type="danger" + size="small" + plain + class="action-btn" + @click="deleteRow(item.id)" + > + 鍒犻櫎 + </van-button> + </view> + </view> + </view> + </view> + + <view v-else class="no-data"> + <text>鏆傛棤璁惧鍙拌处鏁版嵁</text> + </view> + + <!-- 娴姩鏂板鎸夐挳 --> + <view class="fab-button" @click="add"> + <up-icon name="plus" size="24" color="#ffffff"></up-icon> + </view> + </view> +</template> + +<script setup> +import { ref, onMounted } from 'vue' +import { onShow } from '@dcloudio/uni-app' +import PageHeader from '@/components/PageHeader.vue' +import { getLedgerPage, delLedger } from '@/api/equipmentManagement/ledger' +import useUserStore from "@/store/modules/user" +import { showToast } from 'vant'; + +const userStore = useUserStore() + +// 鎼滅储鍏抽敭璇� +const searchKeyword = ref('') + +// 璁惧鍙拌处鏁版嵁 +const ledgerList = ref([]) + +// 杩斿洖涓婁竴椤� +const goBack = () => { + uni.navigateBack() +} + +// 鏌ヨ鍒楄〃锛坈urrent/size 鍥哄畾浼� -1锛� +const getList = () => { + const params = { + current: -1, + size: -1, + deviceName: searchKeyword.value || undefined, + } + getLedgerPage(params) + .then((res) => { + ledgerList.value = res.records || res.data?.records || [] + }) + .catch(() => { + showToast('鑾峰彇鏁版嵁澶辫触') + }) +} + +// 鏂板 - 璺宠浆鍒拌鎯呴〉闈� +const add = () => { + uni.navigateTo({ + url: '/pages/equipmentManagement/ledger/detail' + }) +} + +// 缂栬緫 - 璺宠浆鍒拌鎯呴〉闈� +const edit = (id) => { + if (!id) return + uni.navigateTo({ + url: `/pages/equipmentManagement/ledger/detail?id=${id}` + }) +} + +// 鍒犻櫎 +const deleteRow = async (id) => { + if (!id) return + uni.showModal({ + title: '鎻愮ず', + content: '姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ヨ褰�, 鏄惁缁х画?', + success: async (res) => { + if (!res.confirm) return + try { + await delLedger(id) + showToast('鍒犻櫎鎴愬姛') + getList() + } catch (e) { + showToast('鍒犻櫎澶辫触') + } + } + }) +} + +onMounted(() => { + getList() +}) + +onShow(() => { + getList() +}) +</script> + +<style scoped lang="scss"> +.u-divider { + margin: 0 !important; +} + +.device-ledger { + min-height: 100vh; + background: #f8f9fa; + position: relative; + padding-bottom: 80px; +} + +.search-filter-section { + padding: 10px 20px; + background: #ffffff; +} + +.search-bar { + display: flex; + align-items: center; + gap: 12px; +} + +.search-input { + flex: 1; + background: #f5f5f5; + border-radius: 24px; + padding: 10px 16px; + display: flex; + align-items: center; + gap: 8px; +} + +.search-text { + flex: 1; + font-size: 14px; + color: #333; + background: transparent; + border: none; + outline: none; +} + +.search-text::placeholder { + color: #999; +} + +.filter-button { + width: 40px; + height: 40px; + border-radius: 8px; + display: flex; + align-items: center; + justify-content: center; +} + +.ledger-list { + padding: 20px; +} + +.ledger-item { + background: #ffffff; + border-radius: 12px; + margin-bottom: 16px; + overflow: hidden; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); + padding: 0 16px; +} + +.item-header { + padding: 16px 0; + display: flex; + align-items: center; + justify-content: space-between; +} + +.item-left { + display: flex; + align-items: center; + gap: 8px; +} + +.document-icon { + width: 24px; + height: 24px; + background: #2979ff; + border-radius: 4px; + display: flex; + align-items: center; + justify-content: center; +} + +.item-id { + font-size: 14px; + color: #333; + font-weight: 500; +} + +.item-details { + padding: 16px 0; +} + +.detail-row { + display: flex; + align-items: flex-end; + justify-content: space-between; + margin-bottom: 8px; + + &:last-child { + margin-bottom: 0; + } +} + +.detail-label { + font-size: 12px; + color: #777777; + min-width: 60px; +} + +.detail-value { + font-size: 12px; + color: #000000; + text-align: right; + flex: 1; + margin-left: 16px; +} + +.detail-value.highlight { + color: #2979ff; + font-weight: 500; +} + +.no-data { + padding: 40px 0; + text-align: center; + color: #999; +} + +// 鎸夐挳鏍峰紡锛屽弬鑰� invoiceLedger +.action-buttons { + display: flex; + gap: 12px; + padding: 0 0 16px 0; + justify-content: space-between; +} + +.action-btn { + flex: 1; +} + +.fab-button { + position: fixed; + bottom: calc(30px + env(safe-area-inset-bottom)); + right: 30px; + width: 56px; + height: 56px; + background: #2979ff; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0 4px 16px rgba(41, 121, 255, 0.3); + z-index: 1000; +} +</style> \ No newline at end of file diff --git a/src/pages/index.vue b/src/pages/index.vue index 4f04f91..b15d3bd 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -11,8 +11,8 @@ <view class="hero-section"> <view class="bg-img"> <view class="hero-content"> - <text class="hero-title">浜у搧搴撳瓨绠$悊绯荤粺</text> - <text class="hero-subtitle">楂樻晥銆佷究鎹风殑涓氬姟绠$悊鍏ュ彛</text> + <text class="hero-title"></text> + <text class="hero-subtitle"></text> </view> <view class="hero-wave"></view> </view> @@ -355,9 +355,14 @@ url: '/pages/cooperativeOffice/collaborativeApproval/index' }); break; - case '瀹㈡埛鎷滆': + case '瀹㈡埛鎷滆': uni.navigateTo({ url: '/pages/cooperativeOffice/clientVisit/index' + }); + break; + case '璁惧鍙拌处': + uni.navigateTo({ + url: '/pages/equipmentManagement/ledger/index' }); break; default: @@ -494,7 +499,8 @@ .bg-img { width: 100%; height: 8.75rem; - background: linear-gradient(135deg, #2979ff 0%, #1565c0 100%); + background-image: url("../static/images/banner/view-background.png"); + background-size: cover; border-radius: 0.75rem; position: relative; overflow: hidden; diff --git a/src/static/images/banner/view-background.png b/src/static/images/banner/view-background.png new file mode 100644 index 0000000..02904b9 --- /dev/null +++ b/src/static/images/banner/view-background.png Binary files differ -- Gitblit v1.9.3