修改订单页面

src/api/TagApplyApi.js

@@ -27,6 +27,18 @@ class TagApplyApi extends BaseCurdApi {
     data: data
   })
 
+  confirmOrder = (data) => this.api({
+    url: `${this.basePath}/confirm/order`,
+    method: 'POST',
+    data: data
+  })
+
+  update = (data) => this.api({
+    url: `${this.basePath}/update`,
+    method: 'PUT',
+    data: data
+  })
+
   constructor () {
     super('/tag/apply')
   }

src/components/DialogTagApplyDetail.vue

@@ -0,0 +1,210 @@
+<template>
+    <el-dialog
+      :visible.sync="visible"
+      :title="`订单详情 ${oData && oData.orderNo ? oData.orderNo : ''}`"
+      append-to-body
+      width="1200px"
+    >
+      <div class="flex column" style="padding-bottom:20px;height:580px">
+        <div class="flex valign-center">
+        <el-button
+          plain
+          icon="el-icon-delete"
+          type="primary"
+          size="small"
+          class="custom-plain-button"
+          @click="onBatchDeleteBtnClick"
+          :disabled="selectedList.length === 0 || (oData.tagApplyStateId !='0' && oData.tagApplyStateId != '1')"
+        >批量删除</el-button>
+      </div>
+        <div class="flex-1 fit-size" style="padding-top:20px;">
+          <el-table
+            ref="table"
+            :data="list"
+            stripe
+            border
+            height="100%"
+            size="small"
+            class="custom-el-table-style"
+            @selection-change="onSelectionChange"
+            @row-click="onRowClick"
+          >
+          <el-table-column
+            type="selection"
+            width="55"
+            align="center"
+             :selectable="tagSelectAble"
+            fixed
+          ></el-table-column>
+            <el-table-column
+              type="index"
+              label="序号"
+              width="60"
+              align="center"
+              fixed
+            ></el-table-column>
+            <el-table-column
+              label="商品编码"
+              prop="goodsCode"
+              header-align="center"
+              min-width="100"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              label="商品名称"
+              min-width="200"
+              prop="goodsName"
+              header-align="center"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              label="物料编码"
+              min-width="100"
+              prop="materielCode"
+              header-align="center"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              label="最小包装数量"
+              min-width="80"
+              prop="minimumPackingNumber"
+              header-align="center"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              label="最小包装单位"
+              min-width="80"
+              prop="minimumPackingUnit"
+              header-align="center"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              label="数量"
+              min-width="80"
+              prop="number"
+              header-align="center"
+              align="center"
+            >
+                <template slot-scope="scope">
+                    <integer-input v-model="scope.row.number"></integer-input>
+                </template>
+            </el-table-column>
+            <el-table-column
+                label="费用（元）"
+                prop="amount"
+                align="right"
+                min-width="70"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="标签类型"
+                prop="tagTypeName"
+                align="left"
+                min-width="120"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="操作栏"
+                min-width="80"
+                header-align="center"
+                align="center"
+              >
+                <template v-slot="{ row }">
+                  <div class="flex center layout-gap">
+                    <edit-button :data="row" :on-click="onDeleteBtnClick" icon="el-icon-delete" :disabled="oData.tagApplyStateId !='0' && oData.tagApplyStateId != '1'">删除</edit-button>
+                  </div>
+                </template>
+              </el-table-column>
+          </el-table>
+        </div>
+      </div>
+      <template #footer v-if="oData && (oData.tagApplyStateId === '0'||oData.tagApplyStateId === '1')">
+        <div class="flex center dialog-footer">
+          <el-button
+            @click="onCloseBtnClick"
+          >取消</el-button>
+
+          <el-button
+            type="primary"
+            @click="onOkBtnClick"
+          >确定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </template>
+
+<script>
+import BaseCurdList from '@@/utils/BaseCurdList'
+import TagApply from '@@/entries/TagApply'
+
+export default {
+  name: 'DialogTagApplyDetail',
+  extends: BaseCurdList(TagApply),
+  props: {
+    api: {
+      required: true,
+      type: Function
+    }
+  },
+  data: () => ({
+    visible: false,
+    oData: null
+  }),
+  methods: {
+    open (data) {
+      this.oData = data
+      this.visible = true
+      this.list = data.details
+    },
+    close () {
+      this.oData = null
+      this.visible = false
+      this.list = Object.freeze([])
+    },
+    tagSelectAble () {
+      return this.oData.tagApplyStateId === '0' || this.oData.tagApplyStateId === '1'
+    },
+    onBatchDeleteBtnClick () {
+      const { selectedList } = this
+      this.$confirm(`此操作将删除选中的记录, 是否继续？`, '确认', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        confirmButtonClass: 'confirm-dialog-confirm-btn',
+        cancelButtonClass: 'confirm-dialog-cancel-btn',
+        type: 'warning'
+      }).then(() => {
+        const ids = new Set(selectedList.map(data => data.id))
+        this.list = this.list.filter(item => !ids.has(item.id))
+        this.oData.details = this.list
+      }).catch(() => {})
+    },
+    onDeleteBtnClick (data) {
+      this.$confirm(`此操作将删除该记录, 是否继续？`, '确认', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        confirmButtonClass: 'confirm-dialog-confirm-btn',
+        cancelButtonClass: 'confirm-dialog-cancel-btn',
+        type: 'warning'
+      }).then(() => {
+        for (let i = 0; i < this.oData.details.length; i++) {
+          if (this.oData.details[i].id === data.id) {
+            this.oData.details.splice(i, 1)
+            break
+          }
+        }
+        this.list = this.oData.details
+      }).catch(() => {})
+    },
+    onCloseBtnClick () {
+      this.close()
+    },
+    onOkBtnClick () {
+      this.$$request(this.api, this.oData).then(() => {
+        this.close()
+      }).catch(console.error).finally(() => {})
+    }
+  }
+}
+</script>
+
+<style lang="scss"></style>

src/components/DialogTagDistribute.vue

@@ -22,18 +22,18 @@
                 <my-select
                   v-model="data.deliveryMethodId"
                   :options="optionGroup.DeliveryType ? optionGroup.DeliveryType.list : []"
-                  :disabled="data.tagApplyStateId === '4'"
+                  :disabled="data.tagApplyStateId === '5'"
                 ></my-select>
             </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="发货单号" prop="deliveryOrderNo" :rules= "(data.deliveryMethodId === '1') ? []:[{required:true,message:'请输入发货单号'}]">
-            <el-input v-model="data.deliveryOrderNo" :disabled="(data.deliveryMethodId === '1') || (data.tagApplyStateId === '4')"/>
+            <el-input v-model="data.deliveryOrderNo" :disabled="(data.deliveryMethodId === '1') || (data.tagApplyStateId === '5')"/>
           </el-form-item>
         </el-col>
         </el-row>
       </el-form>
-      <template #footer v-if="data && data.tagApplyStateId === '3'">
+      <template #footer v-if="data && data.tagApplyStateId === '4'">
       <div class="flex center dialog-footer">
         <el-button @click="onCloseBtnClick">取消</el-button>
         <el-button type="primary" @click="onSaveBtnClick">确定</el-button>

src/components/DialogTagDistributeDetail.vue

@@ -69,7 +69,7 @@
             ></el-table-column>
             <el-table-column
                 label="费用（元）"
-                prop="unitPrice"
+                prop="amount"
                 align="right"
                 min-width="70"
                 header-align="center"
@@ -106,7 +106,7 @@ export default {
     },
     close () {
       this.oData = null
-      this.visible = true
+      this.visible = false
       this.list = Object.freeze([])
     }
   }

src/views/TagApply.vue

@@ -82,6 +82,15 @@
           class="custom-plain-button"
           @click="onExportTemplateBtnClick"
         >下载模版</el-button>
+        <el-button
+         :disabled="selectedList.length === 0"
+          icon="el-icon-check"
+          plain
+          type="primary"
+          size="small"
+          class="custom-plain-button"
+          @click="onConfirmOrderBtnClick"
+        >确认订单</el-button>
         <el-button
           :disabled="selectedList.length === 0"
           icon="el-icon-check"
@@ -150,48 +159,6 @@
             header-align="center"
             align="left"
           ></el-table-column>
-          <el-table-column
-            label="物料编码"
-            prop="materielCode"
-            min-width="120"
-            header-align="center"
-            align="center"
-          ></el-table-column>
-          <el-table-column
-            label="商品编码"
-            prop="goodsCode"
-            min-width="120"
-            header-align="center"
-            align="center"
-          ></el-table-column>
-          <el-table-column
-            label="商品名称"
-            prop="goodsName"
-            min-width="120"
-            header-align="center"
-            align="left"
-          ></el-table-column>
-          <el-table-column
-            label="标签类型"
-            prop="tagTypeName"
-            min-width="150"
-            header-align="center"
-            align="left"
-          ></el-table-column>
-          <el-table-column
-            label="最小包装单元"
-            prop="minimumPackingUnit"
-            min-width="100"
-            header-align="center"
-            align="right"
-          ></el-table-column>
-          <el-table-column
-            label="需求数量"
-            prop="number"
-            min-width="85"
-            header-align="center"
-            align="right"
-          ></el-table-column>
           <el-table-column
             label="费用（元）"
             prop="amount"
@@ -213,6 +180,18 @@
             header-align="center"
             align="center"
           ></el-table-column>
+          <el-table-column
+                label="操作栏"
+                min-width="80"
+                header-align="center"
+                align="center"
+              >
+                <template v-slot="{ row }">
+                  <div class="flex center layout-gap">
+                    <edit-button :data="row" :on-click="onOpenDetailEditorBtnClick" icon="el-icon-tickets">详情</edit-button>
+                  </div>
+                </template>
+              </el-table-column>
         </el-table>
       </div>
 
@@ -237,6 +216,11 @@
   ></dialog-tag-apply-template-export>
 
   <dialog-tag-apply-order-export ref="orderExportDialog"></dialog-tag-apply-order-export>
+  <dialog-tag-apply-detail
+      ref="tagApplyDetailDialog"
+      :api="$$api.update"
+      @saved="loadList"
+    ></dialog-tag-apply-detail>
 </div>
 </template>
 
@@ -265,32 +249,57 @@ export default {
     },
     onConfirmPayBtnClick () {
       const { selectedList } = this
-      if (selectedList.length === 0) {
-        this.$notify({
-          title: '提示',
-          message: '请先勾选列表中的数据',
-          type: 'info',
-          position: 'bottom-right'
-        })
-
-        return
-      }
-
       const { $$idProp } = this
-      this.$$api.confirmPay(selectedList.map(data => data[$$idProp])).then((flag) => {
-        if (flag) {
-          this.$notify({
-            title: '成功',
-            message: '操作成功',
-            type: 'success',
-            position: 'bottom-right'
-          })
-          this.loadList()
+      const ids = []
+      selectedList.forEach(data => {
+        if (data.tagApplyStateId === '1') {
+          ids.push(data.id)
         }
-      }).catch(console.error).finally(() => {})
+      })
+      if (ids.length > 0) {
+        this.$$api.confirmPay(selectedList.map(data => data[$$idProp])).then((flag) => {
+          if (flag) {
+            this.$notify({
+              title: '成功',
+              message: '操作成功',
+              type: 'success',
+              position: 'bottom-right'
+            })
+            this.loadList()
+          }
+        }).catch(console.error).finally(() => {})
+      }
     },
     tagSelectAble (row) {
-      return row.tagApplyStateId === '0'
+      return row.tagApplyStateId === '0' || row.tagApplyStateId === '1'
+    },
+    onOpenDetailEditorBtnClick (data) {
+      this.$$request(TagApply.$$api.getDetail, data, this)
+        .then(data => {
+          this.$refs.tagApplyDetailDialog.open(data)
+        }).catch(console.error).finally(() => {})
+    },
+    onConfirmOrderBtnClick () {
+      const { selectedList } = this
+      const ids = []
+      selectedList.forEach(data => {
+        if (data.tagApplyStateId === '0') {
+          ids.push(data.id)
+        }
+      })
+      if (ids.length > 0) {
+        this.$$api.confirmOrder(ids).then((flag) => {
+          if (flag) {
+            this.$notify({
+              title: '成功',
+              message: '操作成功',
+              type: 'success',
+              position: 'bottom-right'
+            })
+            this.loadList()
+          }
+        }).catch(console.error).finally(() => {})
+      }
     }
   }
 }

src/views/TagDistribute.vue

@@ -126,7 +126,7 @@
                 <template v-slot="{ row }">
                   <div class="flex center layout-gap">
                     <edit-button :data="row" :on-click="onOpenDetailEditorBtnClick" icon="el-icon-tickets">详情</edit-button>
-                    <edit-button :data="row" :on-click="onTagDistributeBtnClick" icon="el-icon-share" :disabled="row.tagApplyStateId !== '3' && row.tagApplyStateId !== '4'">发放</edit-button>
+                    <edit-button :data="row" :on-click="onTagDistributeBtnClick" icon="el-icon-share" :disabled="row.tagApplyStateId !== '4' && row.tagApplyStateId !== '5'">发放</edit-button>
                   </div>
                 </template>
               </el-table-column>
@@ -161,7 +161,7 @@ export default {
   extends: BaseCurdList(TagDistribute),
   methods: {
     onTagDistributeBtnClick (data) {
-      this.onOpenEditorBtnClick(data, data.tagApplyStateId === '4')
+      this.onOpenEditorBtnClick(data, data.tagApplyStateId === '5')
     },
     onOpenDetailEditorBtnClick (data) {
       this.$$request(TagDistribute.$$api.getDetail, data, this)