Просмотр исходного кода

feat: 修复退款表格校验2

zhangyuhan 3 месяцев назад
Родитель
Сommit
c15f57b41c

+ 23 - 5
src/views/create-order/components/order-detail-submodule/SelectOrderDetailCard.vue

@@ -93,7 +93,7 @@
               </el-radio-group>
             </div>
           </ProductCard>
-          <el-form v-show="product.canSelect" class="product-form" :model="product.form" :rules="FormRules" label-width="80px">
+          <el-form v-show="product.canSelect" :disabled="!product.canSelect" ref="pForm" class="product-form" :model="product.form" :rules="FormRules" label-width="80px">
             <el-form-item label="退款金额" prop="money">
               <el-input v-model="product.form.money" @blur="formatInputMoney(product.form)" placeholder="请输入退款金额"></el-input>
             </el-form-item>
@@ -264,15 +264,33 @@ export default {
     formatInputMoney (f) {
       f.money = this.formatNumber((f.money || 0) * 100)
     },
-    getProductForm () {
-      return this.productData.filter(v => v.canSelect)
+    async getProductForm () {
+      let vCount = 0
+      let vCountSuccess = 0
+      for (let i = 0; i < this.$refs.pForm.length; i++) {
+        const v = this.$refs.pForm[i]
+        if (!v.disabled) {
+          vCount++
+          await v.validate().then(() => {
+            vCountSuccess++
+          })
+        } else {
+          v.resetFields()
+        }
+      }
+
+      if (vCount === vCountSuccess && vCountSuccess >= 1) {
+        return this.productData.filter(v => v.canSelect)
+      } else {
+        return []
+      }
     },
     init() {
       this.orderData = this.orderDetailInfo?.orderData || {}
       let productData = this.orderDetailInfo?.productData || []
       if(productData.length > 0) {
-        productData = productData.map(product => {
-          product.canSelect = false
+        productData = productData.map((product, index) => {
+          product.canSelect = index === 0
           product.form = {
             money: '',
             reason: '',

+ 8 - 4
src/views/order/components/new-detailModel.vue

@@ -112,9 +112,9 @@
       </div>
     </Modal>
     <!-- 退款登记 -->
-    <Modal :title="'退款登记'" v-model="tShow" class-name="order-model tui-model" :class="{ 'select-product-model': isMoreProduct}" :mask-closable="false"
+    <Modal :title="'退款登记'" v-model="tShow" class-name="order-model tui-model select-product-model" :mask-closable="false"
       @on-visible-change="visibleChange">
-      <select-order-detail-card v-show="isMoreProduct" :orderDetail="data" ref="selectProduct"></select-order-detail-card>
+      <select-order-detail-card :orderDetail="data" ref="selectProduct"></select-order-detail-card>
 <!--      <Form ref="models" :model="models" :rules="refundRuleValidate" :label-width="110">-->
 <!--        <FormItem label="退款金额" prop="refundMoney">-->
 <!--          <Input v-model="models.refundMoney" type="text" :maxlength="9" placeholder="请输入退款金额"-->
@@ -770,9 +770,13 @@ export default {
         this.$toast('付款码复制成功')
         this.paymentCodeShow = false
       },
-      doSubmitTk () {
-        const tkList = this.$refs.selectProduct.getProductForm()
+      async doSubmitTk () {
+        const tkList = await this.$refs.selectProduct.getProductForm()
         console.log(tkList)
+        if (!tkList.length) {
+          this.$notify.warning({title: '请填写退款信息!'})
+          return
+        }
         const totalMoney = tkList.reduce((a,b) => {
           return a + b.form.money
         }, 0)