labsetting

src/views/warehouseManagement/labelSetting.vue

@@ -11,12 +11,55 @@
       <el-button type="primary" icon="el-icon-search" @click="getList">搜索</el-button>
     </el-form>
     <el-row :gutter="20">
-      <el-col :span="16"> <el-button type="primary" @click="newplan">新建生产计划</el-button> </el-col>
+      <el-col :span="16"> <el-button type="primary" @click="addlabel">新增</el-button> </el-col>
     </el-row>
+
+    <el-table
+      border
+      stripe
+      :data="labelsettingList"
+      v-loading="loading"
+      style="width: 100%"
+      height="500"
+      highlight-current-row
+      :header-cell-style="{ 'text-align': 'center' }"
+    >
+      <el-table-column prop="id" label="流水号" sortable></el-table-column>
+      <el-table-column prop="productName" label="产品名称"> </el-table-column>
+      <el-table-column prop="packageCode" label="包装码"> </el-table-column>
+      <el-table-column prop="productCode" label="产品码"> </el-table-column>
+      <el-table-column fixed="right" label="操作" width="280">
+        <template slot-scope="scope">
+          <el-button size="mini" @click="handleUpdate(scope.$index, scope.row)">修改</el-button>
+          <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="pagination.total > 0"
+      :total="pagination.total"
+      :page.sync="pagination.pageNum"
+      :limit.sync="pagination.pageSize"
+      @pagination="getList"
+    />
+
+    <el-dialog title="dialog.title" :visible.sync="dialog.open" width="98%">
+      <el-form :model="dialog" :rules="dialog.rules" label-width="150px">
+        <el-form-item label="产品名称" prop="productName"> <el-input v-model="dialog.productName"></el-input></el-form-item>
+        <el-form-item label="包装码" prop="packageCode"> <el-input v-model="dialog.packageCode"></el-input></el-form-item>
+        <el-form-item label="产品码" prop="productCode"> <el-input v-model="dialog.productCode"></el-input></el-form-item>
+      </el-form>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="dialogSubmit">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
+import {queryLabelList,AddHandle,UpdateHandle,handleDelete} from '@/api/warehouseManagement/labelSetting.js'
 export default {
   name: 'labelSetting',
   data() {
@@ -25,8 +68,100 @@ export default {
         id: '',
         productName: '',
       },
+      labelsettingList: [],
+
+      pagination: {
+        total: 0,
+        pageNum: 0,
+        pageSize: 30,
+      },
+      dialog: {
+        open: false,
+        title: '',
+        productName: '',
+        packageCode: '',
+        productCode: '',
+        rules: {
+          productName: [{ required: true, message: '产品名称不能为空', trigger: 'blur' }],
+          packageCode: [{ required: true, message: '包装码不能为空', trigger: 'blur' }],
+          productCode: [{ required: true, message: '产品码不能为空', trigger: 'blur' }],
+        },
+      },
+      loading: false,
+      flag: 1,
     }
   },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    //todo 获取
+    getList() {
+      const query = { ...this.search }
+      query.pageNum = pagination.pageNum
+      query.pageSize = pagination.pageSize
+
+      queryLabelList()
+        .then((res) => {
+          if (res.code == 200) {
+            this.labelsettingList = res.data
+            this.loading = false
+          }
+        })
+        .catch()
+    },
+    //todo  添加标签按钮
+    addlabel() {
+      this.dialog.open = true
+      this.dialog.title = '增加'
+      this.flag = 1
+    },
+
+    //todo 对话框确认
+    dialogSubmit() {
+      const query = {}
+      query.productName = this.dialog.productName
+      query.packageCode = this.dialog.packageCode
+      query.productCode = this.dialog.packageCode
+      if (flag) {
+        //新增
+        AddHandle(query).then((res) => {})
+      } else {
+        //修改
+        UpdateHandle(query).then((res) => {})
+      }
+
+      this.cancel()
+      this.loading = true
+      this.getList()
+    },
+    //todo 对话框取消
+    cancel() {
+      this.dialog.open = false
+      this.dialog.productName = ''
+      this.dialog.packageCode = ''
+      this.dialog.packageCode = ''
+    },
+    //todo 修改按钮
+    handleUpdate(index, row) {
+      this.dialog.open = true
+      this.dialog.title = '修改'
+      this.flag = 0
+      this.dialog.productName = row.productName
+      this.dialog.packageCode = row.packageCode
+      this.dialog.productCode = row.productCode
+    },
+    //todo 删除按钮
+    handleDelete(index, row) {
+      deleteHandler(row.id).then((res) => {
+        if (res.code == 200 && res.data == 1) {
+          this.$notify.success('删除成功')
+        } else {
+          this.$notify.error('删除失败，联系管理员')
+        }
+      })
+    },
+  },
 }
 </script>