From 5c48ef2b8267c38bae717202615e1618074ee31c Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期五, 29 八月 2025 15:25:05 +0800 Subject: [PATCH] 修改组件 --- src/pages/procurementManagement/procurementLedger/detail.vue | 285 ++++++++++++++++++++++++++------------------------------ 1 files changed, 134 insertions(+), 151 deletions(-) diff --git a/src/pages/procurementManagement/procurementLedger/detail.vue b/src/pages/procurementManagement/procurementLedger/detail.vue index 52aa35c..9292d1d 100644 --- a/src/pages/procurementManagement/procurementLedger/detail.vue +++ b/src/pages/procurementManagement/procurementLedger/detail.vue @@ -4,58 +4,57 @@ <PageHeader title="鍙拌处璇︽儏" @back="goBack" /> <!-- 琛ㄥ崟鍖哄煙 --> - <van-form @submit="onSubmit" label-width="110px" input-align="right" style="margin-top: 10px" error-message-align="right" scroll-to-error scroll-to-error-position="center"> - <van-field label="閲囪喘鍚堝悓鍙�" name="purchaseContractNumber" borderBottom="true" v-model="form.purchaseContractNumber" placeholder="鑷姩鐢熸垚" :rules="[{ required: true, message: '璇疯緭鍏�' }]"> - </van-field> - <van-field - v-model="form.salesContractNo" - is-link - readonly - name="salesContractNo" - label="閿�鍞悎鍚屽彿" - required - placeholder="鐐瑰嚮閫夋嫨閿�鍞悎鍚屽彿" - :rules="[{ required: true, message: '璇烽�夋嫨閿�鍞悎鍚屽彿' }]" - @click="showPicker = true" - /> - <van-field - v-model="form.supplierName" - is-link - readonly - required - name="supplierName" - label="渚涘簲鍟嗗悕绉�" - placeholder="鐐瑰嚮閫夋嫨渚涘簲鍟�" - :rules="[{ required: true, message: '璇烽�夋嫨渚涘簲鍟�' }]" - @click="showCustomerPicker = true" - /> - <van-field label="椤圭洰鍚嶇О" name="projectName" borderBottom="true" v-model="form.projectName" placeholder="璇疯緭鍏ラ」鐩悕绉�" :rules="[{ required: true, message: '椤圭洰鍚嶇О涓嶈兘涓虹┖' }]" required> - </van-field> - <van-field label="浠樻鏂瑰紡" name="paymentMethod" borderBottom="true" v-model="form.paymentMethod" placeholder="璇疯緭鍏ヤ粯娆炬柟寮�"> - </van-field> - <van-field label="褰曞叆浜�" name="recorderName" borderBottom="true" v-model="form.recorderName" placeholder="璇疯緭鍏�" disabled> - </van-field> - <van-field label="褰曞叆鏃ユ湡" name="entryDate" borderBottom="true" v-model="form.entryDate" placeholder="璇疯緭鍏�" disabled> - </van-field> - <van-popup v-model:show="showPicker" destroy-on-close position="bottom"> - <van-picker + <u-form @submit="onSubmit" label-width="110" input-align="right" style="margin-top: 10px" error-message-align="right"> + <u-form-item label="閲囪喘鍚堝悓鍙�" prop="purchaseContractNumber" required border-bottom> + <u-input v-model="form.purchaseContractNumber" placeholder="鑷姩鐢熸垚" /> + </u-form-item> + <u-form-item label="閿�鍞悎鍚屽彿" prop="salesContractNo" required border-bottom> + <u-input + v-model="form.salesContractNo" + readonly + placeholder="鐐瑰嚮閫夋嫨閿�鍞悎鍚屽彿" + @click="showPicker = true" + /> + </u-form-item> + <u-form-item label="渚涘簲鍟嗗悕绉�" prop="supplierName" required border-bottom> + <u-input + v-model="form.supplierName" + readonly + placeholder="鐐瑰嚮閫夋嫨渚涘簲鍟�" + @click="showCustomerPicker = true" + /> + </u-form-item> + <u-form-item label="椤圭洰鍚嶇О" prop="projectName" required border-bottom> + <u-input v-model="form.projectName" placeholder="璇疯緭鍏ラ」鐩悕绉�" /> + </u-form-item> + <u-form-item label="浠樻鏂瑰紡" border-bottom> + <u-input v-model="form.paymentMethod" placeholder="璇疯緭鍏ヤ粯娆炬柟寮�" /> + </u-form-item> + <u-form-item label="褰曞叆浜�" border-bottom> + <u-input v-model="form.recorderName" placeholder="璇疯緭鍏�" disabled /> + </u-form-item> + <u-form-item label="褰曞叆鏃ユ湡" border-bottom> + <u-input v-model="form.entryDate" placeholder="璇疯緭鍏�" disabled /> + </u-form-item> + <u-popup v-model="showPicker" mode="bottom"> + <u-picker :columns="salesContractList" v-model="pickerValue" @confirm="onConfirm" @cancel="showPicker = false" /> - </van-popup> - <van-popup v-model:show="showCustomerPicker" destroy-on-close position="bottom"> - <van-picker + </u-popup> + <u-popup v-model="showCustomerPicker" mode="bottom"> + <u-picker :columns="supplierList" v-model="pickerCustomerValue" @confirm="onCustomerConfirm" @cancel="showCustomerPicker = false" /> - </van-popup> + </u-popup> <!-- 浜у搧澶х被閫夋嫨鍣� --> - <van-popup v-model:show="showCategoryPicker" destroy-on-close position="bottom"> + <u-popup v-model="showCategoryPicker" mode="bottom"> <!-- 澶撮儴鎸夐挳鍖哄煙 --> <view class="popup-header"> <view @click="showCategoryPicker = false" class="cancelButton">鍙栨秷</view> @@ -69,175 +68,159 @@ check-strictly @check-change="onCategoryConfirm" /> - </van-popup> + </u-popup> <!-- 瑙勬牸鍨嬪彿閫夋嫨鍣� --> - <van-popup v-model:show="showSpecificationPicker" destroy-on-close position="bottom"> - <van-picker + <u-popup v-model="showSpecificationPicker" mode="bottom"> + <u-picker :columns="modelOptions" v-model="pickerSpecificationValue" @confirm="onSpecificationConfirm" @cancel="showSpecificationPicker = false" /> - </van-popup> + </u-popup> <!-- 绋庣巼閫夋嫨鍣� --> - <van-popup v-model:show="showTaxRatePicker" destroy-on-close position="bottom"> - <van-picker + <u-popup v-model="showTaxRatePicker" mode="bottom"> + <u-picker :columns="taxRateOptions" v-model="pickerTaxRateValue" @confirm="onTaxRateConfirm" @cancel="showTaxRatePicker = false" /> - </van-popup> + </u-popup> <!-- 鍙戠エ绫诲瀷閫夋嫨鍣� --> - <van-popup v-model:show="showInvoiceTypePicker" destroy-on-close position="bottom"> - <van-picker + <u-popup v-model="showInvoiceTypePicker" mode="bottom"> + <u-picker :columns="invoiceTypeOptions" v-model="pickerInvoiceTypeValue" @confirm="onInvoiceTypeConfirm" @cancel="showInvoiceTypePicker = false" /> - </van-popup> + </u-popup> <!-- 浜у搧淇℃伅 --> <view class="product-section"> <view class="section-header"> <text class="section-title">浜у搧淇℃伅</text> - <van-button type="primary" size="small" @click="addProduct" class="add-btn" icon="plus" v-if="operationType !== 'view'">鏂板</van-button> + <u-button type="primary" size="small" @click="addProduct" class="add-btn" v-if="operationType !== 'view'"> + <u-icon name="plus" size="14" /> + 鏂板 + </u-button> </view> <view class="product-card" v-for="(product, idx) in productData" :key="idx"> <!-- 浜у搧绫� --> <view class="product-header"> <view class="product-title"> - <van-icon name="description" color="#2979ff" size="15" /> + <u-icon name="file-text" color="#2979ff" size="15" /> <text class="product-productCategory">浜у搧 {{ idx + 1 }}</text> </view> <!-- 鎿嶄綔鎸夐挳 --> - <view class="product-actions" v-if="operationType !== 'view'"> - <van-button type="danger" size="mini" @click="removeProduct(idx)" class="del-btn" icon="delete">鍒犻櫎</van-button> + <view class="product-actions" v-if="operationType !== 'view'"> + <u-button type="error" size="mini" @click="removeProduct(idx)" class="del-btn"> + <u-icon name="trash" size="12" /> + 鍒犻櫎 + </u-button> </view> </view> <!-- 浜у搧淇℃伅琛ㄥ崟 --> <view class="product-form"> <!-- 浜у搧澶х被 --> - <van-field - v-model="product.productCategory" - is-link - readonly - name="productCategory" - label="浜у搧澶х被" - required - placeholder="璇烽�夋嫨" - :rules="[{ required: true, message: '璇烽�夋嫨' }]" - @click="openCategoryPicker(idx)" - /> + <view class="product-category" prop="productCategory" required border-bottom> + <u-input + v-model="product.productCategory" + readonly + placeholder="璇烽�夋嫨" + @click="openCategoryPicker(idx)" + /> + </view> <!-- 瑙勬牸鍨嬪彿 --> - <van-field - v-model="product.specificationModel" - is-link - readonly - name="specificationModel" - label="瑙勬牸鍨嬪彿" - required - :rules="[{ required: true, message: '璇烽�夋嫨' }]" - placeholder="璇烽�夋嫨" - @click="openSpecificationPicker(idx)" - /> + <view class="product-specificationModel" prop="specificationModel" required border-bottom> + <u-input + v-model="product.specificationModel" + readonly + placeholder="璇烽�夋嫨" + @click="openSpecificationPicker(idx)" + /> + </view> <!-- 鍗曚綅 --> - <van-field - v-model="product.unit" - name="unit" - label="鍗曚綅" - required - :rules="[{ required: true, message: '璇疯緭鍏�' }]" - placeholder="璇疯緭鍏�" - /> + <view class="product-unit" prop="unit" required border-bottom> + <u-input + v-model="product.unit" + placeholder="璇疯緭鍏�" + /> + </view> <!-- 绋庣巼 --> - <van-field - v-model="product.taxRate" - is-link - readonly - name="taxRate" - label="绋庣巼(%)" - required - :rules="[{ required: true, message: '璇烽�夋嫨' }]" - placeholder="璇烽�夋嫨" - @click="openTaxRatePicker(idx)" - /> + <view class="product-taxRate" prop="taxRate" required border-bottom> + <u-input + v-model="product.taxRate" + readonly + placeholder="璇烽�夋嫨" + @click="openTaxRatePicker(idx)" + /> + </view> <!-- 鍚◣鍗曚环 --> - <van-field - v-model="product.taxInclusiveUnitPrice" - name="taxInclusiveUnitPrice" - label="鍚◣鍗曚环(鍏�)" - type="number" - required - :rules="[{ required: true, message: '璇疯緭鍏�' }]" - placeholder="璇疯緭鍏�" - @blur="formatTaxPrice(idx)" - /> + <view class="product-taxInclusiveUnitPrice" prop="taxInclusiveUnitPrice" required border-bottom> + <u-input + v-model="product.taxInclusiveUnitPrice" + type="number" + placeholder="璇疯緭鍏�" + @blur="formatTaxPrice(idx)" + /> + </view> <!-- 鏁伴噺 --> - <van-field - v-model="product.quantity" - name="quantity" - label="鏁伴噺" - type="number" - :rules="[{ required: true, message: '璇疯緭鍏�' }]" - required - placeholder="璇疯緭鍏�" - @blur="formatAmount(idx)" - /> + <view class="product-quantity" prop="quantity" required border-bottom> + <u-input + v-model="product.quantity" + type="number" + placeholder="璇疯緭鍏�" + @blur="formatAmount(idx)" + /> + </view> <!-- 鍚◣鎬讳环 --> - <van-field - v-model="product.taxInclusiveTotalPrice" - name="taxInclusiveTotalPrice" - label="鍚◣鎬讳环(鍏�)" - type="number" - :rules="[{ required: true, message: '璇疯緭鍏�' }]" - required - placeholder="璇疯緭鍏�" - @blur="formatTaxTotal(idx)" - /> + <view class="product-taxInclusiveTotalPrice" prop="taxInclusiveTotalPrice" required border-bottom> + <u-input + v-model="product.taxInclusiveTotalPrice" + type="number" + placeholder="璇疯緭鍏�" + @blur="formatTaxTotal(idx)" + /> + </view> <!-- 涓嶅惈绋庢�讳环 --> - <van-field - v-model="product.taxExclusiveTotalPrice" - name="taxExclusiveTotalPrice" - label="涓嶅惈绋庢�讳环(鍏�)" - type="number" - required - :rules="[{ required: true, message: '璇疯緭鍏�' }]" - placeholder="璇疯緭鍏�" - @blur="formatNoTaxTotal(idx)" - /> + <view class="product-taxExclusiveTotalPrice" prop="taxExclusiveTotalPrice" required border-bottom> + <u-input + v-model="product.taxExclusiveTotalPrice" + type="number" + placeholder="璇疯緭鍏�" + @blur="formatNoTaxTotal(idx)" + /> + </view> <!-- 鍙戠エ绫诲瀷 --> - <van-field - v-model="product.invoiceType" - is-link - readonly - name="invoiceType" - label="鍙戠エ绫诲瀷" - :rules="[{ required: true, message: '璇烽�夋嫨' }]" - required - placeholder="璇烽�夋嫨" - @click="openInvoiceTypePicker(idx)" - /> + <view class="product-invoiceType" prop="invoiceType" required border-bottom> + <u-input + v-model="product.invoiceType" + readonly + placeholder="璇烽�夋嫨" + @click="openInvoiceTypePicker(idx)" + /> + </view> </view> </view> </view> <view class="footer-btns" v-if="operationType !== 'view'"> - <van-button class="cancel-btn" @click="goBack">鍙栨秷</van-button> - <van-button class="save-btn" native-type="submit" form-type="submit">淇濆瓨</van-button> + <u-button class="cancel-btn" @click="goBack">鍙栨秷</u-button> + <u-button class="save-btn" type="primary" @click="onSubmit">淇濆瓨</u-button> </view> - </van-form> + </u-form> </view> </template> @@ -737,10 +720,10 @@ .form-section { margin-top: 1rem; } -.van-field { +.u-form-item { height: 3.4rem; } -.van-cell { +.u-cell { align-items: center; } .product-section { -- Gitblit v1.9.3