修改需求

src/api/DataStatisticsApi.js

@@ -1,8 +1,16 @@
-import { api } from '@@/utils/api'
+// import { api } from '@@/utils/api'
+import BaseCurdApi from './BaseCurdApi'
 
-export default {
-  getTagTypeCountData: () => api({
-    url: '/data/statistics/tag/type/count',
-    method: 'GET'
-  })
+class DataStatisticsApi extends BaseCurdApi {
+  constructor () {
+    super('/statistics/tag/situation')
+  }
 }
+
+export default new DataStatisticsApi()
+// export default {
+//   getTagTypeCountData: () => api({
+//     url: '/statistics/tag/situation',
+//     method: 'GET'
+//   })
+// }

src/api/TagDistributeApi.js

@@ -8,12 +8,7 @@ class TagDistributeApi extends BaseCurdApi {
   save = (data) => this.api({
     url: `${this.basePath}`,
     method: 'PUT',
-    data: {
-      id: data.id,
-      deliveryMethodId: data.deliveryMethodId,
-      deliveryOrderNo: data.deliveryOrderNo,
-      recipient: data.recipient
-    }
+    data
   })
 }
 

src/api/TagNullifyApi.js

@@ -0,0 +1,15 @@
+import BaseCurdApi from './BaseCurdApi'
+
+class TagNullifyApi extends BaseCurdApi {
+  constructor () {
+    super('/tag/cancel')
+  }
+
+  tagCancel = (data) => this.api({
+    url: `${this.basePath}`,
+    method: 'POST',
+    data
+  })
+}
+
+export default new TagNullifyApi()

src/components/DialogAddTagNullify.vue

@@ -0,0 +1,94 @@
+<template>
+    <el-dialog
+      :visible.sync="visible"
+     title="新增标签作废"
+      append-to-body
+      width="750px"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        ref="form"
+        :model="data"
+        label-width="100px"
+      >
+      <el-row
+        :gutter="$$Constant.LAYOUT_GAP"
+        >
+        <el-col :span="12">
+            <el-form-item label="标签类型" prop="tagTypeId">
+                <my-select
+                  v-model="data.tagTypeId"
+                  :options="optionGroup.TagType ? optionGroup.TagType.list : []"
+                ></my-select>
+            </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="作废数量" prop="number" :rules= "[{required:true,message:'请输入作废数量'}]">
+            <IntegerInput v-model="data.number"/>
+          </el-form-item>
+        </el-col>
+        </el-row>
+      </el-form>
+      <template #footer>
+      <div class="flex center dialog-footer">
+        <el-button @click="onCloseBtnClick">取消</el-button>
+        <el-button type="primary" @click="onSaveTagNullifyBtnClick">确定</el-button>
+      </div>
+    </template>
+    </el-dialog>
+  </template>
+
+<script>
+import BaseCurdEditor from '@@/utils/BaseCurdEditor'
+import TagNullify from '@@/entries/TagNullify'
+
+export default {
+  name: 'DialogAddTagNullify',
+  extends: BaseCurdEditor(TagNullify),
+  props: {
+    optionGroup: {
+      required: true,
+      type: Object
+    }
+  },
+  data: () => ({
+    visible: false,
+    data: {tagTypeId: null, number: 0}
+  }),
+  methods: {
+    open () {
+      if (this.optionGroup.TagType && this.optionGroup.TagType.list && this.optionGroup.TagType.list.length > 0) {
+        this.data.tagTypeId = this.optionGroup.TagType.list[0].id
+      }
+      this.visible = true
+    },
+    close () {
+      this.visible = false
+    },
+    onSaveTagNullifyBtnClick () {
+      if (this.data.tagTypeId && this.data.number && this.data.number > 0) {
+        this.$$request(this.$$api.tagCancel, this.data).then((flag) => {
+          if (flag) {
+            this.$notify({
+              title: '成功',
+              message: '操作成功',
+              type: 'success',
+              position: 'bottom-right'
+            })
+            this.$emit('saveTagCancel')
+            this.close()
+          }
+        }).catch(console.error).finally(() => {})
+      } else {
+        this.$notify.error({
+          title: '新增失败',
+          message: '作废数量大于0',
+          position: 'bottom-right'
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss"></style>

src/components/DialogTagApplyDetail.vue

@@ -119,6 +119,16 @@
                 min-width="120"
                 header-align="left"
               ></el-table-column>
+              <el-table-column
+                label="预期收货日期"
+                prop="expectedReceiptDate"
+                min-width="100"
+                header-align="center"
+                align="center"
+              >
+              <template slot-scope="scope">
+              {{ scope.row.expectedReceiptDate ? new Date(scope.row.expectedReceiptDate).format('YYYY-MM-DD') : '' }}
+              </template></el-table-column>
               <el-table-column
                 v-if="oData && oData.tagApplyStateId === '0'"
                 label="操作栏"

src/components/DialogTagCodeSerialDetail.vue

@@ -80,6 +80,13 @@
             min-width="70"
             align="center"
           ></el-table-column>
+          <el-table-column
+              label="预期收货日期"
+              prop="formatExpectedReceiptDate"
+              min-width="100"
+              header-align="center"
+              align="center"
+            ></el-table-column>
         </el-table>
       </div>
     </div>
@@ -105,7 +112,8 @@ export default {
         return this.oData.details.map(item => {
           return {
             ...item,
-            formatSerialNumberRange: item.serialNumberRange ? item.serialNumberRange.join('-') : ''
+            formatSerialNumberRange: item.serialNumberRange ? item.serialNumberRange.join('-') : '',
+            formatExpectedReceiptDate: item.expectedReceiptDate ? new Date(item.expectedReceiptDate).format('YYYY-MM-DD') : ''
           }
         })
       } else {

src/components/DialogTagDistribute.vue

@@ -1,7 +1,7 @@
 <template>
     <el-dialog
       :visible.sync="visible"
-     :title="`${operatorType.name}发货方式`"
+     :title="`${data && data.isSend ? '查看':'修改'}发货方式`"
       append-to-body
       width="750px"
       :close-on-click-modal="false"
@@ -23,24 +23,24 @@
                 <my-select
                   v-model="data.deliveryMethodId"
                   :options="optionGroup.DeliveryType ? optionGroup.DeliveryType.list : []"
-                  :disabled="data.tagApplyStateId === '6'"
+                  :disabled="data.isSend"
                 ></my-select>
             </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item v-if="data.deliveryMethodId === '1'" label="提货人姓名" prop="recipient" :rules= "[{required:true,message:'请输入提货人姓名'}]">
-            <el-input v-model="data.recipient" :disabled="data.tagApplyStateId === '6'"/>
+            <el-input v-model="data.recipient" :disabled="data.isSend"/>
           </el-form-item>
           <el-form-item v-else label="发货单号" prop="deliveryOrderNo" :rules= "[{required:true,message:'请输入发货单号'}]">
-            <el-input v-model="data.deliveryOrderNo" :disabled="data.tagApplyStateId === '6'"/>
+            <el-input v-model="data.deliveryOrderNo" :disabled="data.isSend"/>
           </el-form-item>
         </el-col>
         </el-row>
       </el-form>
-      <template #footer v-if="data && data.tagApplyStateId === '5'">
+      <template #footer v-if="data && !data.isSend">
       <div class="flex center dialog-footer">
         <el-button @click="onCloseBtnClick">取消</el-button>
-        <el-button type="primary" @click="onSaveBtnClick">确定</el-button>
+        <el-button type="primary" @click="onSaveDistributeBtnClick">确定</el-button>
       </div>
     </template>
     </el-dialog>
@@ -58,6 +58,24 @@ export default {
       required: true,
       type: Object
     }
+  },
+  data: () => ({
+    visible: false,
+    data: null
+  }),
+  methods: {
+    open (data) {
+      this.data = data
+      this.visible = true
+    },
+    close () {
+      this.data = null
+      this.visible = false
+    },
+    onSaveDistributeBtnClick () {
+      this.$emit('saveDistribute', this.data)
+      this.close()
+    }
   }
 }
 </script>

src/components/DialogTagDistributeDetail.vue

@@ -34,7 +34,7 @@
             ></el-table-column>
             <el-table-column
               label="商品名称"
-              min-width="150"
+              min-width="200"
               prop="goodsName"
               header-align="center"
               align="center"
@@ -93,6 +93,57 @@
                 min-width="120"
                 header-align="left"
               ></el-table-column>
+              <el-table-column
+                label="申领人"
+                min-width="100"
+                prop="applicantName"
+                header-align="center"
+                align="center"
+              ></el-table-column>
+              <el-table-column
+                label="收获地址"
+                min-width="150"
+                prop="address"
+                header-align="left"
+                align="left"
+              ></el-table-column>
+              <el-table-column
+                label="联系电话"
+                min-width="100"
+                prop="phone"
+                header-align="center"
+                align="center"
+              ></el-table-column>
+              <el-table-column
+                label="预期收货日期"
+                prop="expectedReceiptDate"
+                min-width="100"
+                header-align="center"
+                align="center"
+              > <template slot-scope="scope">
+              {{ scope.row.expectedReceiptDate ? new Date(scope.row.expectedReceiptDate).format('YYYY-MM-DD') : '' }}
+              </template></el-table-column>
+              <el-table-column
+                label="发货方式"
+                prop="deliveryMethodName"
+                align="center"
+                min-width="80"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="发货单号"
+                prop="deliveryOrderNo"
+                align="center"
+                min-width="120"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="提货人姓名"
+                prop="recipient"
+                align="center"
+                min-width="100"
+                header-align="center"
+              ></el-table-column>
           </el-table>
         </div>
       </div>

src/components/DialogTagDistributeOperate.vue

@@ -0,0 +1,288 @@
+<template>
+    <el-dialog
+      :visible.sync="visible"
+      :title="`订单详情 ${oData && oData.orderNo ? oData.orderNo : ''}`"
+      append-to-body
+      width="1200px"
+      :close-on-click-modal="false"
+    >
+      <div class="flex column" style="padding-bottom:20px;height:600px">
+        <div class="flex-1 fit-size">
+          <el-table
+            ref="table"
+            :data="list"
+            stripe
+            border
+            height="100%"
+            size="small"
+            class="custom-el-table-style"
+            :span-method="onMergeCellsMethod"
+          >
+            <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"
+              fixed
+            ></el-table-column>
+            <el-table-column
+              label="商品名称"
+              min-width="200"
+              prop="goodsName"
+              header-align="center"
+              align="center"
+              fixed
+            ></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"
+            ></el-table-column>
+            <el-table-column
+                label="单价（元）"
+                prop="unitPrice"
+                align="right"
+                min-width="70"
+                header-align="right"
+              ><template slot-scope="scope">
+              {{ parseFloat(scope.row.unitPrice).toFixed(2) }}
+              </template></el-table-column>
+            <el-table-column
+                label="费用（元）"
+                prop="amount"
+                align="right"
+                min-width="70"
+                header-align="right"
+              ><template slot-scope="scope">
+              {{ parseFloat(scope.row.amount).toFixed(2) }}
+              </template></el-table-column>
+              <el-table-column
+                label="标签类型"
+                prop="tagTypeName"
+                align="left"
+                min-width="120"
+                header-align="left"
+              ></el-table-column>
+              <el-table-column
+                label="申领人"
+                min-width="100"
+                prop="applicantName"
+                header-align="center"
+                align="center"
+              ></el-table-column>
+              <el-table-column
+                label="收获地址"
+                min-width="150"
+                prop="address"
+                header-align="left"
+                align="left"
+              ></el-table-column>
+              <el-table-column
+                label="联系电话"
+                min-width="100"
+                prop="phone"
+                header-align="center"
+                align="center"
+              ></el-table-column>
+              <el-table-column
+                label="预期收货日期"
+                prop="expectedReceiptDate"
+                min-width="100"
+                header-align="center"
+                align="center"
+              > <template slot-scope="scope">
+              {{ scope.row.expectedReceiptDate ? new Date(scope.row.expectedReceiptDate).format('YYYY-MM-DD') : '' }}
+              </template></el-table-column>
+              <el-table-column
+                label="发货方式"
+                prop="deliveryMethodName"
+                align="center"
+                min-width="80"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="发货单号"
+                prop="deliveryOrderNo"
+                align="center"
+                min-width="120"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="提货人姓名"
+                prop="recipient"
+                align="center"
+                min-width="100"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="操作栏"
+                min-width="130"
+                header-align="center"
+                align="center"
+                width="130"
+                fixed="right"
+              >
+                <template v-slot="{ row }">
+                  <div class="flex center layout-gap">
+                    <edit-button :data="row" :on-click="onTagDistributeBtnClick" :disabled="row.isSend" icon="el-icon-share">发放</edit-button>
+                  </div>
+                </template>
+              </el-table-column>
+          </el-table>
+        </div>
+      </div>
+
+      <template #footer>
+      <div class="flex center dialog-footer">
+        <el-button @click="onCloseBtnClick">取消</el-button>
+        <el-button type="primary" @click="onSaveDistributeBtnClick">确定</el-button>
+      </div>
+    </template>
+      <dialog-tag-distribute
+      ref="editor"
+      :optionGroup="optionGroup1"
+      @saveDistribute="onSaveDistribute"
+    ></dialog-tag-distribute>
+    </el-dialog>
+
+  </template>
+
+<script>
+import BaseCurdList from '@@/utils/BaseCurdList'
+import TagDistribute from '@@/entries/TagDistribute'
+
+export default {
+  name: 'DialogTagDistributeOperate',
+  extends: BaseCurdList(TagDistribute),
+  props: {
+    optionGroup1: {
+      required: true,
+      type: Object
+    }
+  },
+  data: () => ({
+    visible: false,
+    oData: null
+  }),
+  computed: {
+    colspanMap () {
+      return this.list.reduce((map, item, index) => {
+        const key = `${item.address}|${item.applicantName}|${item.phone}|${item.isSend}`
+        let data = map[key]
+        if (!data) {
+          data = map[key] = {
+            span: 0,
+            index,
+            ids: []
+          }
+        }
+
+        data.ids.push(item.id)
+        data.span++
+        return map
+      }, {})
+    }
+  },
+  methods: {
+    open (data) {
+      this.oData = data
+      this.visible = true
+      this.list = data.details
+    },
+    close () {
+      this.oData = null
+      this.visible = false
+      this.list = Object.freeze([])
+    },
+    // 重写方法否则接口会调用2次
+    setOptionGroup () {
+
+    },
+    onTagDistributeBtnClick (data) {
+      this.$refs.editor.open(data)
+    },
+    onMergeCellsMethod ({ row, column, rowIndex, columnIndex }) {
+      let rowspan = 1
+
+      if (columnIndex === 17) { // 操作栏的列索引
+        const spanData = this.colspanMap[`${row.address}|${row.applicantName}|${row.phone}|${row.isSend}`]
+        rowspan = -(spanData.index === rowIndex) & spanData.span
+      }
+      return [rowspan, 1]
+    },
+    onCloseBtnClick () {
+      this.close()
+    },
+    onSaveDistribute (data) {
+      if (data.deliveryMethodId && (data.recipient || data.deliveryOrderNo)) {
+        let deliveryMethodName = ''
+        if (this.optionGroup1 && this.optionGroup1.DeliveryType) {
+          deliveryMethodName = this.optionGroup1.DeliveryType.map[data.deliveryMethodId].name
+        }
+        const spanData = this.colspanMap[`${data.address}|${data.applicantName}|${data.phone}|${data.isSend}`]
+        if (spanData) {
+          const ids = new Set(spanData.ids)
+          this.list.forEach(item => {
+            if (ids.has(item.id)) {
+              item.deliveryMethodId = data.deliveryMethodId
+              item.deliveryMethodName = deliveryMethodName
+              item.recipient = data.recipient
+              item.deliveryOrderNo = data.deliveryOrderNo
+            }
+          })
+          this.oData.details = this.list
+        }
+      }
+    },
+    onSaveDistributeBtnClick () {
+      if (this.oData) {
+        this.$$request(this.$$api.save, this.oData).then((flag) => {
+          if (flag) {
+            this.$notify({
+              title: '成功',
+              message: '操作成功',
+              type: 'success',
+              position: 'bottom-right'
+            })
+            this.$emit('saveDistribute', this.data)
+            this.close()
+          }
+        }).catch(console.error).finally(() => {})
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss"></style>

src/entries/TagInventory.js

@@ -0,0 +1,13 @@
+import BaseCurdEntry from './BaseCurdEntry'
+
+import dataStatisticsApi from '@@/api/DataStatisticsApi'
+
+export default class TagInventory extends BaseCurdEntry {
+  static get $$name () {
+    return 'TagInventory'
+  }
+
+  static get $$api () {
+    return dataStatisticsApi
+  }
+}

src/entries/TagNullify.js

@@ -0,0 +1,34 @@
+import BaseCurdEntry from './BaseCurdEntry'
+
+import tagNullifyApi from '@@/api/TagNullifyApi'
+
+import DataTimeRange from '@@/utils/DataTimeRange'
+
+import TagType from './TagType'
+
+export default class TagNullify extends BaseCurdEntry {
+    static $$getQuery = () => ({
+      ...(new DataTimeRange({
+        unit: 'Date',
+        diff: 7,
+        offset: 0
+      })),
+      order: [['createTime', 'DESC']]
+    })
+
+    static get $$name () {
+      return 'TagNullify'
+    }
+
+    static get $$api () {
+      return tagNullifyApi
+    }
+
+    static $$optionTargetConfigGroup = [
+      [{
+        Target: TagType
+      }]
+    ]
+
+      static $$optionData = {}
+}

src/router/index.js

@@ -107,6 +107,14 @@ export default new Router({
           permission: 'isAuthenticated'
         },
         component: () => import('@@/views/TagProviderDetail.vue')
+      }, {
+        path: '/page-in-src/tag-nullify',
+        name: 'TagNullify',
+        meta: {
+          title: '标签作废',
+          permission: 'isAuthenticated'
+        },
+        component: () => import('@@/views/TagNullify.vue')
       }]
     }
   ]

src/views/TagApply.vue

@@ -143,13 +143,6 @@
             header-align="center"
             align="center"
           ></el-table-column>
-          <el-table-column
-            label="预期收货日期"
-            prop="formatExpectedReceiptDate"
-            min-width="100"
-            header-align="center"
-            align="center"
-          ></el-table-column>
           <el-table-column
             label="供应商名称"
             prop="providerName"
@@ -157,6 +150,13 @@
             header-align="left"
             align="left"
           ></el-table-column>
+          <el-table-column
+            label="标签数量"
+            prop="tagNumber"
+            min-width="80"
+            header-align="center"
+            align="center"
+          ></el-table-column>
           <el-table-column
             label="费用（元）"
             prop="amount"

src/views/TagCode.vue

@@ -144,13 +144,6 @@
               header-align="center"
               align="center"
             ></el-table-column>
-            <el-table-column
-              label="预期收货日期"
-              prop="formatExpectedReceiptDate"
-              min-width="100"
-              header-align="center"
-              align="center"
-            ></el-table-column>
             <el-table-column
               label="供应商名称"
               prop="providerName"

src/views/TagDistribute.vue

@@ -77,13 +77,6 @@
                 header-align="center"
                 align="center"
               ></el-table-column>
-              <el-table-column
-                label="预期收货日期"
-                prop="formatExpectedReceiptDate"
-                min-width="100"
-                header-align="center"
-                align="center"
-              ></el-table-column>
               <el-table-column
                 label="供应商名称"
                 prop="providerName"
@@ -107,27 +100,6 @@
                 min-width="70"
                 header-align="center"
               ></el-table-column>
-              <el-table-column
-                label="发货方式"
-                prop="deliveryMethodName"
-                align="center"
-                min-width="80"
-                header-align="center"
-              ></el-table-column>
-              <el-table-column
-                label="发货单号"
-                prop="deliveryOrderNo"
-                align="center"
-                min-width="120"
-                header-align="center"
-              ></el-table-column>
-              <el-table-column
-                label="提货人姓名"
-                prop="recipient"
-                align="center"
-                min-width="100"
-                header-align="center"
-              ></el-table-column>
               <el-table-column
                 label="操作员"
                 prop="operatorName"
@@ -158,15 +130,16 @@
           />
         </div>
       </el-card>
-      <dialog-tag-distribute
-      ref="editor"
-      :optionGroup="optionGroup"
-      @saved="loadList"
-    ></dialog-tag-distribute>
 
     <dialog-tag-distribute-detail
       ref="tagDistributeDetailDialog"
     ></dialog-tag-distribute-detail>
+
+    <dialog-tag-distribute-operate
+      ref="tagDistributeOperateDialog"
+      :optionGroup1="optionGroup"
+      @saveDistribute="onsaveDistribute"
+    ></dialog-tag-distribute-operate>
     </div>
   </template>
 
@@ -179,13 +152,19 @@ export default {
   extends: BaseCurdList(TagDistribute),
   methods: {
     onTagDistributeBtnClick (data) {
-      this.onOpenEditorBtnClick(data, data.tagApplyStateId === '6')
+      this.$$request(TagDistribute.$$api.getDetail, data, this)
+        .then(data => {
+          this.$refs.tagDistributeOperateDialog.open(data)
+        }).catch(console.error).finally(() => {})
     },
     onOpenDetailEditorBtnClick (data) {
       this.$$request(TagDistribute.$$api.getDetail, data, this)
         .then(data => {
           this.$refs.tagDistributeDetailDialog.open(data)
         }).catch(console.error).finally(() => {})
+    },
+    onsaveDistribute () {
+      this.loadList()
     }
   }
 }

src/views/TagInventory.vue

@@ -1,13 +1,93 @@
 <template>
   <div class="wrapper flex column layout-gap">
+    <el-card shadow="hover" class="filter-card">
+      <el-form label-width="100px">
+        <el-row :gutter="$$Constant.LAYOUT_GAP">
+          <el-col :span="24" class="text-right">
+            <el-button
+              type="primary"
+              class="filter-button"
+              @click="onSearchBtnClick"
+            >查询</el-button>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+
     <el-card
       shadow="hover"
       class="z-card flex column flex-1 fit-size"
     >
       <div class="wrapper flex column layout-gap">
-        <div style="font-weight:bolder">饼状图</div>
+
         <div class="flex-1 fit-size">
-          <e-chart ref="eChart"></e-chart>
+          <el-table
+            ref="table"
+            :data="list"
+            stripe
+            border
+            highlight-current-row
+            height="100%"
+            size="small"
+            class="custom-el-table-style"
+          >
+            <el-table-column
+              type="index"
+              label="序号"
+              width="60"
+              align="center"
+              fixed
+            ></el-table-column>
+            <el-table-column
+              label="标签类型"
+              prop="tagTypeName"
+              align="center"
+              min-width="200"
+              header-align="center"
+            ></el-table-column>
+            <el-table-column
+              label="采购数量"
+              prop="buyNumber"
+              min-width="100"
+              header-align="center"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              label="发放数量"
+              prop="sendNumber"
+              min-width="100"
+              header-align="center"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              label="锁定数量"
+              prop="lockNumber"
+              align="center"
+              min-width="100"
+              header-align="center"
+            ></el-table-column>
+            <el-table-column
+              label="作废数量"
+              prop="cancelNumber"
+              align="center"
+              min-width="100"
+              header-align="center"
+            ></el-table-column>
+            <el-table-column
+              label="使用数量"
+              prop="useNumber"
+              align="center"
+              min-width="100"
+              header-align="center"
+            ></el-table-column>
+            <el-table-column
+              label="可用数量"
+              prop="availableNumber"
+              align="center"
+              min-width="100"
+              header-align="center"
+            ></el-table-column>
+          </el-table>
         </div>
       </div>
     </el-card>
@@ -15,43 +95,42 @@
 </template>
 
 <script>
-import BasePage from '@@/utils/BasePage'
-
-import dataStatisticsApi from '@@/api/DataStatisticsApi'
+import BaseCurdList from '@@/utils/BaseCurdList'
+import TagInventory from '@@/entries/TagInventory'
 
 export default {
   name: 'TagInventory',
-  extends: BasePage,
-  methods: {
-    getData () {
-      this.$$request(dataStatisticsApi.getTagTypeCountData).then(tagTypeCountDataList => {
-        if (tagTypeCountDataList.length > 0) {
-          this.$refs.eChart.setOpt({
-            series: [{
-              type: 'pie',
-              data: tagTypeCountDataList,
-              color: '#0078da',
-              itemStyle: {
-                borderColor: '#fff',
-                borderWidth: 1
-              },
-              label: {
-                formatter: '{b}\n{c}（{d}%）',
-                position: 'inside',
-                fontSize: 14,
-                lineHeight: 20
-              }
-            }]
-          })
-        } else {
-          this.$refs.eChart.clear()
-        }
-      }).catch(console.error).finally(() => {})
-    }
-  },
-  created () {
-    this.getData()
-  }
+  extends: BaseCurdList(TagInventory, false)
+  // methods: {
+  //   getData () {
+  //     this.$$request(dataStatisticsApi.getTagTypeCountData).then(tagTypeCountDataList => {
+  //       if (tagTypeCountDataList.length > 0) {
+  //         this.$refs.eChart.setOpt({
+  //           series: [{
+  //             type: 'pie',
+  //             data: tagTypeCountDataList,
+  //             color: '#0078da',
+  //             itemStyle: {
+  //               borderColor: '#fff',
+  //               borderWidth: 1
+  //             },
+  //             label: {
+  //               formatter: '{b}\n{c}（{d}%）',
+  //               position: 'inside',
+  //               fontSize: 14,
+  //               lineHeight: 20
+  //             }
+  //           }]
+  //         })
+  //       } else {
+  //         this.$refs.eChart.clear()
+  //       }
+  //     }).catch(console.error).finally(() => {})
+  //   }
+  // },
+  // created () {
+  //   this.getData()
+  // }
 }
 </script>
 

src/views/TagNullify.vue

@@ -0,0 +1,108 @@
+<template>
+    <div class="wrapper flex column layout-gap">
+      <el-card shadow="hover" class="filter-card">
+        <el-form label-width="100px">
+          <el-row :gutter="$$Constant.LAYOUT_GAP">
+            <el-col :span="8">
+                <el-form-item label="日期范围">
+                <data-time-query
+                :query="query"
+                style="width:100%"
+            ></data-time-query>
+          </el-form-item>
+        </el-col>
+            <el-col :span="16" class="text-right">
+                <el-button
+                type="primary"
+                icon="el-icon-plus"
+                class="filter-button"
+                @click="onAddBtnClick"
+              >标签作废</el-button>
+              <el-button
+                type="primary"
+                class="filter-button"
+                @click="onSearchBtnClick"
+              >查询</el-button>
+            </el-col>
+          </el-row>
+        </el-form>
+      </el-card>
+
+      <el-card
+        shadow="hover"
+        class="z-card flex column flex-1 fit-size"
+      >
+        <div class="wrapper flex column layout-gap">
+
+          <div class="flex-1 fit-size">
+            <el-table
+              ref="table"
+              :data="list"
+              stripe
+              border
+              highlight-current-row
+              height="100%"
+              size="small"
+              class="custom-el-table-style"
+            >
+              <el-table-column
+                type="index"
+                label="序号"
+                width="60"
+                align="center"
+                fixed
+              ></el-table-column>
+              <el-table-column
+                label="标签类型"
+                prop="tagTypeName"
+                align="center"
+                header-align="center"
+              ></el-table-column>
+              <el-table-column
+                label="作废数量"
+                prop="number"
+                header-align="center"
+                align="center"
+              ></el-table-column>
+              <el-table-column
+                label="作废时间"
+                prop="cTime"
+                header-align="center"
+                align="center"
+              ></el-table-column>
+            </el-table>
+          </div>
+          <my-pagination
+            :total="total"
+            :pagination="pagination"
+            @current-change="currentPageNoChange"
+          />
+        </div>
+      </el-card>
+      <dialog-add-tag-nullify
+      ref="addTagNullifyDialog"
+      :optionGroup="optionGroup"
+      @saveTagCancel="onSaveTagCancel"
+    ></dialog-add-tag-nullify>
+    </div>
+  </template>
+
+<script>
+import BaseCurdList from '@@/utils/BaseCurdList'
+import TagNullify from '@@/entries/TagNullify'
+
+export default {
+  name: 'TagNullify',
+  extends: BaseCurdList(TagNullify),
+  methods: {
+    onAddBtnClick () {
+      this.$refs.addTagNullifyDialog.open()
+    },
+    onSaveTagCancel () {
+      this.loadList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped></style>