优惠券分类

packages/xy-table/src/index.vue

@@ -146,7 +146,7 @@
           v-if="table.firstColumn.type === 'index'"
           :type="table.firstColumn.type"
           :width="table.firstColumn.width || 50"
-          :label="table.firstColumn.label"
+          :label="table.firstColumn.label || '序号'"
           :fixed="table.firstColumn.fixed"
           :align="table.firstColumn.align || 'center'"
         >

src/views/coupon/classify/index.vue

 <template>
   <div class="app-container">
-    <xy-table :table="table" :columns="columns" />
+    <xy-table ref="tableRef" :table="table" :columns="columns">
+      <template #isShow="{ scope }">
+        {{scope.row.isShow === '1' ? '否' : '是'}}
+      </template>
+    </xy-table>
+
+    <!-- 添加或修改岗位对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+        <el-form-item label="分类名称" prop="categoryName">
+          <el-input v-model="form.categoryName" placeholder="请输入分类名称" />
+        </el-form-item>
+        <el-form-item label="是否前端展示" prop="isShow">
+          <el-radio-group v-model="form.isShow">
+            <el-radio
+              v-for="dict in dict.type.classify_isshow"
+              :key="dict.value"
+              :label="dict.value"
+            >{{dict.label}}</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { listClassify } from '@/api/coupon/classify'
+import { listClassify, getClassify, addClassify, updateClassify, delClassify } from '@/api/coupon/classify'
 
 export default {
   name: 'Classify',
+  dicts: ['classify_isshow'],
   data() {
     return {
+      open: false,
+      title: undefined,
+      form: {
+        id: undefined,
+        categoryName: undefined,
+        isShow: '0'
+      },
+      rules: {
+        categoryName: [
+          { required: true, message: "分类名称不能为空", trigger: "blur" }
+        ]
+      },
       table: {
         rowKey: 'id',
         data: [],
+        firstColumn: { type: 'index' },
+        hiddenLine: true,
         // 表格内操作列
         operator: [
           {
@@ -47,25 +88,27 @@ export default {
           pageSize: 10
         },
         // 搜索表单配置
-        searchForm: {
-          formLabelWidth: '90px',
-          formData: {
-            param1: undefined
-          },
-          fieldList: [
-            { prop: 'param1', label: '决策流名称', type: 'input' },
-            { prop: 'param2', label: '决策流状态', type: 'input' }
-          ],
-          // 相关下拉列表
-          listOptions: {
+        // searchForm: {
+        //   formLabelWidth: '90px',
+        //   formData: {
+        //     param1: undefined
+        //   },
+        //   fieldList: [
+        //     { prop: 'param1', label: '决策流名称', type: 'input' },
+        //     { prop: 'param2', label: '决策流状态', type: 'input' }
+        //   ],
+        //   // 相关下拉列表
+        //   listOptions: {
 
-          }
-        },
+        //   }
+        // },
         // 请求
         request: listClassify
       },
       columns: [
-
+        { prop: 'categoryName', label: '分类名称' },
+        { prop: 'couponNum', label: '关联优惠券数量' },
+        { prop: 'isShow', label: '是否前端展示', slotName: 'isShow' },
       ]
     }
   },
@@ -76,15 +119,23 @@ export default {
     },
     /** 新增按钮操作 */
     handleAdd() {
-
+      this.reset();
+      this.open = true;
+      this.title = "新增分类";
     },
     /** 编辑按钮操作 */
     handleEdit(row) {
-
+      this.reset();
+      const id = row.id
+      getClassify(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改分类";
+      });
     },
     /** 删除按钮操作 */
     async handleDelete(row) {
-      const assetsInfoId = row.assetsInfoId
+      const id = row.id
       const confirmResult = await this.$confirm(
         '是否确认删除当前记录？',
         '提示',
@@ -99,13 +150,47 @@ export default {
         // this.$message.info('已取消删除！')
         return
       }
-      const res = await delAssetLibrary(assetsInfoId)
+      const res = await delClassify(id)
       if (res.code !== 200) {
         return this.$message.error('删除失败！')
       }
       this.$message.success('删除成功!')
       this.getList()
-    }
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != undefined) {
+            updateClassify(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addClassify(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: undefined,
+        categoryName: undefined,
+        isShow: '0'
+      };
+      this.resetForm("form");
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
   }
 }
 </script>

vue.config.js

@@ -34,7 +34,7 @@ module.exports = {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
         // target: `http://localhost:8080`,
-        target: `http://47.103.50.109:8901/sage-admin`,
+        target: `http://47.103.50.109:8901/test-api/sage-admin`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''