| | |
|---|
| | | <PageHeader title="台账详情" @back="goBack" /> |
|---|
| | | |
|---|
| | | <!-- 表单区域 --> |
|---|
| | | <u-form @submit="onSubmit" label-width="110" input-align="right" style="margin-top: 10px" error-message-align="right"> |
|---|
| | | <u-form-item label="销售合同号" prop="salesContractNo" border-bottom> |
|---|
| | | <u-input v-model="form.salesContractNo" placeholder="自动生成" disabled /> |
|---|
| | | </u-form-item> |
|---|
| | | <u-form-item |
|---|
| | | <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="salesContractNo" borderBottom="true" v-model="form.salesContractNo" placeholder="自动生成" disabled> |
|---|
| | | </van-field> |
|---|
| | | <van-field |
|---|
| | | v-model="form.salesman" |
|---|
| | | is-link |
|---|
| | | readonly |
|---|
| | | name="salesman" |
|---|
| | | label="业务员" |
|---|
| | | prop="salesman" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="form.salesman" |
|---|
| | | readonly |
|---|
| | | placeholder="点击选择业务员" |
|---|
| | | @click="showPicker = true" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | <u-form-item label="客户合同号" prop="customerContractNo" required border-bottom> |
|---|
| | | <u-input |
|---|
| | | v-model="form.customerContractNo" |
|---|
| | | placeholder="请输入客户合同号" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | <u-form-item |
|---|
| | | placeholder="点击选择业务员" |
|---|
| | | :rules="[{ required: true, message: '请选择业务员' }]" |
|---|
| | | @click="showPicker = true" |
|---|
| | | /> |
|---|
| | | <van-field label="客户合同号" name="customerContractNo" borderBottom="true" |
|---|
| | | v-model="form.customerContractNo" required |
|---|
| | | placeholder="请输入客户合同号" :rules="[{ required: true, message: '客户合同号不能为空' }]"> |
|---|
| | | </van-field> |
|---|
| | | <van-field |
|---|
| | | v-model="form.customerName" |
|---|
| | | is-link |
|---|
| | | readonly |
|---|
| | | required |
|---|
| | | name="customerName" |
|---|
| | | label="客户名称" |
|---|
| | | prop="customerName" |
|---|
| | | 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 |
|---|
| | | v-model="form.executionDate" |
|---|
| | | is-link |
|---|
| | | readonly |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="form.customerName" |
|---|
| | | 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 |
|---|
| | | name="executionDate" |
|---|
| | | label="签订日期" |
|---|
| | | prop="executionDate" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="form.executionDate" |
|---|
| | | readonly |
|---|
| | | placeholder="点击选择时间" |
|---|
| | | @click="showDatePicker = true" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | <u-popup v-model="showDatePicker" mode="bottom"> |
|---|
| | | <u-datetime-picker |
|---|
| | | placeholder="点击选择时间" |
|---|
| | | :rules="[{ required: true, message: '签订日期不能为空' }]" |
|---|
| | | @click="showDatePicker = true" |
|---|
| | | /> |
|---|
| | | <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom"> |
|---|
| | | <van-date-picker |
|---|
| | | v-model="pickerDateValue" |
|---|
| | | @confirm="onDateConfirm" |
|---|
| | | @cancel="showDatePicker = false" |
|---|
| | | /> |
|---|
| | | </u-popup> |
|---|
| | | <u-form-item label="付款方式" prop="paymentMethod" border-bottom> |
|---|
| | | <u-input v-model="form.paymentMethod" placeholder="请输入付款方式" /> |
|---|
| | | </u-form-item> |
|---|
| | | <u-form-item label="录入人" prop="entryPersonName" border-bottom> |
|---|
| | | <u-input v-model="form.entryPersonName" placeholder="请输入" disabled /> |
|---|
| | | </u-form-item> |
|---|
| | | <u-form-item label="录入日期" prop="entryDate" border-bottom> |
|---|
| | | <u-input v-model="form.entryDate" placeholder="请输入" disabled /> |
|---|
| | | </u-form-item> |
|---|
| | | <u-popup v-model="showPicker" mode="bottom"> |
|---|
| | | <u-picker |
|---|
| | | </van-popup> |
|---|
| | | <van-field label="付款方式" name="paymentMethod" borderBottom="true" v-model="form.paymentMethod" placeholder="请输入付款方式"> |
|---|
| | | </van-field> |
|---|
| | | <van-field label="录入人" name="entryPersonName" borderBottom="true" v-model="form.entryPersonName" 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 |
|---|
| | | :columns="userList" |
|---|
| | | v-model="pickerValue" |
|---|
| | | @confirm="onConfirm" |
|---|
| | | @cancel="showPicker = false" |
|---|
| | | /> |
|---|
| | | </u-popup> |
|---|
| | | <u-popup v-model="showCustomerPicker" mode="bottom"> |
|---|
| | | <u-picker |
|---|
| | | </van-popup> |
|---|
| | | <van-popup v-model:show="showCustomerPicker" destroy-on-close position="bottom"> |
|---|
| | | <van-picker |
|---|
| | | :columns="customerOption" |
|---|
| | | v-model="pickerCustomerValue" |
|---|
| | | @confirm="onCustomerConfirm" |
|---|
| | | @cancel="showCustomerPicker = false" |
|---|
| | | /> |
|---|
| | | </u-popup> |
|---|
| | | </van-popup> |
|---|
| | | |
|---|
| | | <!-- 产品大类选择器 --> |
|---|
| | | <u-popup v-model="showCategoryPicker" mode="bottom"> |
|---|
| | | <van-popup v-model:show="showCategoryPicker" destroy-on-close position="bottom"> |
|---|
| | | <!-- 头部按钮区域 --> |
|---|
| | | <view class="popup-header"> |
|---|
| | | <view @click="showCategoryPicker = false" class="cancelButton">取消</view> |
|---|
| | |
|---|
| | | check-strictly |
|---|
| | | @check-change="onCategoryConfirm" |
|---|
| | | /> |
|---|
| | | </u-popup> |
|---|
| | | </van-popup> |
|---|
| | | |
|---|
| | | <!-- 规格型号选择器 --> |
|---|
| | | <u-popup v-model="showSpecificationPicker" mode="bottom"> |
|---|
| | | <u-picker |
|---|
| | | <van-popup v-model:show="showSpecificationPicker" destroy-on-close position="bottom"> |
|---|
| | | <van-picker |
|---|
| | | :columns="modelOptions" |
|---|
| | | v-model="pickerSpecificationValue" |
|---|
| | | @confirm="onSpecificationConfirm" |
|---|
| | | @cancel="showSpecificationPicker = false" |
|---|
| | | /> |
|---|
| | | </u-popup> |
|---|
| | | </van-popup> |
|---|
| | | |
|---|
| | | <!-- 税率选择器 --> |
|---|
| | | <u-popup v-model="showTaxRatePicker" mode="bottom"> |
|---|
| | | <u-picker |
|---|
| | | <van-popup v-model:show="showTaxRatePicker" destroy-on-close position="bottom"> |
|---|
| | | <van-picker |
|---|
| | | :columns="taxRateOptions" |
|---|
| | | v-model="pickerTaxRateValue" |
|---|
| | | @confirm="onTaxRateConfirm" |
|---|
| | | @cancel="showTaxRatePicker = false" |
|---|
| | | /> |
|---|
| | | </u-popup> |
|---|
| | | </van-popup> |
|---|
| | | |
|---|
| | | <!-- 发票类型选择器 --> |
|---|
| | | <u-popup v-model="showInvoiceTypePicker" mode="bottom"> |
|---|
| | | <u-picker |
|---|
| | | <van-popup v-model:show="showInvoiceTypePicker" destroy-on-close position="bottom"> |
|---|
| | | <van-picker |
|---|
| | | :columns="invoiceTypeOptions" |
|---|
| | | v-model="pickerInvoiceTypeValue" |
|---|
| | | @confirm="onInvoiceTypeConfirm" |
|---|
| | | @cancel="showInvoiceTypePicker = false" |
|---|
| | | /> |
|---|
| | | </u-popup> |
|---|
| | | </van-popup> |
|---|
| | | <!-- 产品信息 --> |
|---|
| | | <view class="product-section"> |
|---|
| | | <view class="section-header"> |
|---|
| | | <text class="section-title">产品信息</text> |
|---|
| | | <u-button type="primary" size="small" @click="addProduct" class="add-btn" v-if="operationType !== 'view'"> |
|---|
| | | <u-icon name="plus" size="14" /> |
|---|
| | | 新增 |
|---|
| | | </u-button> |
|---|
| | | <van-button type="primary" size="small" @click="addProduct" class="add-btn" icon="plus" v-if="operationType !== 'view'">新增</van-button> |
|---|
| | | </view> |
|---|
| | | <view class="product-card" v-for="(product, idx) in productData" :key="idx"> |
|---|
| | | <!-- 产品类 --> |
|---|
| | | <view class="product-header"> |
|---|
| | | <view class="product-title"> |
|---|
| | | <u-icon name="file-text" color="#2979ff" size="15" /> |
|---|
| | | <van-icon name="description" color="#2979ff" size="15" /> |
|---|
| | | <text class="product-productCategory">产品 {{ idx + 1 }}</text> |
|---|
| | | </view> |
|---|
| | | <!-- 操作按钮 --> |
|---|
| | | <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 class="product-actions" v-if="operationType !== 'view'"> |
|---|
| | | <van-button type="danger" size="mini" @click="removeProduct(idx)" class="del-btn" icon="delete">删除</van-button> |
|---|
| | | </view> |
|---|
| | | </view> |
|---|
| | | |
|---|
| | | <!-- 产品信息表单 --> |
|---|
| | | <view class="product-form"> |
|---|
| | | <!-- 产品大类 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.productCategory" |
|---|
| | | is-link |
|---|
| | | readonly |
|---|
| | | name="productCategory" |
|---|
| | | label="产品大类" |
|---|
| | | prop="productCategory" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.productCategory" |
|---|
| | | readonly |
|---|
| | | placeholder="请选择" |
|---|
| | | @click="openCategoryPicker(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | placeholder="请选择" |
|---|
| | | :rules="[{ required: true, message: '请选择' }]" |
|---|
| | | @click="openCategoryPicker(idx)" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 规格型号 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.specificationModel" |
|---|
| | | is-link |
|---|
| | | readonly |
|---|
| | | name="specificationModel" |
|---|
| | | label="规格型号" |
|---|
| | | prop="specificationModel" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.specificationModel" |
|---|
| | | readonly |
|---|
| | | placeholder="请选择" |
|---|
| | | @click="openSpecificationPicker(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | :rules="[{ required: true, message: '请选择' }]" |
|---|
| | | placeholder="请选择" |
|---|
| | | @click="openSpecificationPicker(idx)" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 单位 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.unit" |
|---|
| | | name="unit" |
|---|
| | | label="单位" |
|---|
| | | prop="unit" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.unit" |
|---|
| | | placeholder="请输入" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | :rules="[{ required: true, message: '请输入' }]" |
|---|
| | | placeholder="请输入" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 税率 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.taxRate" |
|---|
| | | is-link |
|---|
| | | readonly |
|---|
| | | name="taxRate" |
|---|
| | | label="税率(%)" |
|---|
| | | prop="taxRate" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.taxRate" |
|---|
| | | readonly |
|---|
| | | placeholder="请选择" |
|---|
| | | @click="openTaxRatePicker(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | :rules="[{ required: true, message: '请选择' }]" |
|---|
| | | placeholder="请选择" |
|---|
| | | @click="openTaxRatePicker(idx)" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 含税单价 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.taxInclusiveUnitPrice" |
|---|
| | | name="taxInclusiveUnitPrice" |
|---|
| | | label="含税单价(元)" |
|---|
| | | prop="taxInclusiveUnitPrice" |
|---|
| | | type="number" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.taxInclusiveUnitPrice" |
|---|
| | | type="number" |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatTaxPrice(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | :rules="[{ required: true, message: '请输入' }]" |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatTaxPrice(idx)" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 数量 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.quantity" |
|---|
| | | name="quantity" |
|---|
| | | label="数量" |
|---|
| | | prop="quantity" |
|---|
| | | type="number" |
|---|
| | | :rules="[{ required: true, message: '请输入' }]" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.quantity" |
|---|
| | | type="number" |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatAmount(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatAmount(idx)" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 含税总价 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.taxInclusiveTotalPrice" |
|---|
| | | name="taxInclusiveTotalPrice" |
|---|
| | | label="含税总价(元)" |
|---|
| | | prop="taxInclusiveTotalPrice" |
|---|
| | | type="number" |
|---|
| | | :rules="[{ required: true, message: '请输入' }]" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.taxInclusiveTotalPrice" |
|---|
| | | type="number" |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatTaxTotal(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatTaxTotal(idx)" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 不含税总价 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.taxExclusiveTotalPrice" |
|---|
| | | name="taxExclusiveTotalPrice" |
|---|
| | | label="不含税总价(元)" |
|---|
| | | prop="taxExclusiveTotalPrice" |
|---|
| | | type="number" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.taxExclusiveTotalPrice" |
|---|
| | | type="number" |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatNoTaxTotal(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | :rules="[{ required: true, message: '请输入' }]" |
|---|
| | | placeholder="请输入" |
|---|
| | | @blur="formatNoTaxTotal(idx)" |
|---|
| | | /> |
|---|
| | | |
|---|
| | | <!-- 发票类型 --> |
|---|
| | | <u-form-item |
|---|
| | | <van-field |
|---|
| | | v-model="product.invoiceType" |
|---|
| | | is-link |
|---|
| | | readonly |
|---|
| | | name="invoiceType" |
|---|
| | | label="发票类型" |
|---|
| | | prop="invoiceType" |
|---|
| | | :rules="[{ required: true, message: '请选择' }]" |
|---|
| | | required |
|---|
| | | border-bottom |
|---|
| | | > |
|---|
| | | <u-input |
|---|
| | | v-model="product.invoiceType" |
|---|
| | | readonly |
|---|
| | | placeholder="请选择" |
|---|
| | | @click="openInvoiceTypePicker(idx)" |
|---|
| | | /> |
|---|
| | | </u-form-item> |
|---|
| | | placeholder="请选择" |
|---|
| | | @click="openInvoiceTypePicker(idx)" |
|---|
| | | /> |
|---|
| | | </view> |
|---|
| | | </view> |
|---|
| | | </view> |
|---|
| | | <view class="footer-btns" v-if="operationType !== 'view'"> |
|---|
| | | <u-button class="cancel-btn" @click="goBack">取消</u-button> |
|---|
| | | <u-button class="save-btn" type="primary" @click="onSubmit">保存</u-button> |
|---|
| | | <van-button class="cancel-btn" @click="goBack">取消</van-button> |
|---|
| | | <van-button class="save-btn" native-type="submit" form-type="submit">保存</van-button> |
|---|
| | | </view> |
|---|
| | | </u-form> |
|---|
| | | </van-form> |
|---|
| | | </view> |
|---|
| | | </template> |
|---|
| | | |
|---|
