Ver código fonte

代码提交

cxd 7 meses atrás
pai
commit
a5831d9903
1 arquivos alterados com 237 adições e 233 exclusões
  1. 237 233
      ui/src/views/ProductMent/sysCategory/index.vue

+ 237 - 233
ui/src/views/ProductMent/sysCategory/index.vue

@@ -1,257 +1,261 @@
 <template>
-    <div class="system-category-container">
-      <!-- 顶部操作区 -->
-      <div class="operation-area">
-        <el-button type="primary" @click="handleAdd">新建系统类别</el-button>
-        <el-input
-          v-model="searchQuery"
-          placeholder="请输入系统类别编号或名称"
-          style="width: 200px; margin-left: 16px"
-          @keyup.enter.native="handleSearch"
-        >
-          <el-button slot="append" icon="el-icon-search" @click="handleSearch"></el-button>
-        </el-input>
-      </div>
+  <div class="system-category-container">
+    <!-- 顶部操作区 -->
+    <div class="operation-area">
+      <el-button type="primary" @click="handleAdd">新建系统类别</el-button>
+      <el-input
+        v-model="formQuery.sysNo"
+        placeholder="请输入系统类别编号或名称"
+        style="width: 200px; margin-left: 16px"
+        @keyup.enter.native="handleSearch"
+      >
+        <el-button slot="append" icon="el-icon-search" @click="handleSearch"></el-button>
+      </el-input>
+    </div>
 
-      <!-- 表格区域 -->
-      <el-table
-        :data="tableData"
+    <!-- 表格区域 -->
+    <el-table
+      :data="tableData"
 
-        style="width: 100%; margin-top: 20px"
-        v-loading="loading"
-      >
-        <el-table-column prop="sysCode" label="系统类别编号" width="180"></el-table-column>
-        <el-table-column prop="sysName" label="系统类别名称" width="180"></el-table-column>
-        <el-table-column prop="remark" label="备注"></el-table-column>
-        <el-table-column prop="sysProducts" label="产品数" width="120"></el-table-column>
-        <el-table-column label="操作" width="250" fixed="right">
-          <template slot-scope="scope">
-            <el-button size="mini" @click="handleView(scope.row)">查看</el-button>
-            <el-button size="mini" type="primary" @click="handleEdit(scope.row)">编辑</el-button>
-            <el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
+      style="width: 100%; margin-top: 20px"
+      v-loading="loading"
+    >
+      <el-table-column prop="sysNo" label="系统类别编号" width="180"></el-table-column>
+      <el-table-column prop="sysName" label="系统类别名称" width="180"></el-table-column>
+      <el-table-column prop="sysRemark" label="备注"></el-table-column>
+      <el-table-column prop="sysProducts" label="产品数" width="120"></el-table-column>
+      <el-table-column label="操作" width="250" fixed="right">
+        <template slot-scope="scope">
+          <el-button size="mini" @click="handleView(scope.row)">查看</el-button>
+          <el-button size="mini" type="primary" @click="handleEdit(scope.row)">编辑</el-button>
+          <el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
 
-      <!-- 分页 -->
-      <el-pagination
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :current-page="pagination.currentPage"
-        :page-sizes="[10, 20, 50, 100]"
-        :page-size="pagination.pageSize"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="pagination.total"
-        style="margin-top: 20px; text-align: right"
-      >
-      </el-pagination>
+    <!-- 分页 -->
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="pagination.currentPage"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="pagination.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="pagination.total"
+      style="margin-top: 20px; text-align: right"
+    >
+    </el-pagination>
 
-      <!-- 新增/编辑对话框 -->
-      <el-dialog
-        :title="dialogTitle"
-        :visible.sync="dialogVisible"
-        width="500px"
-        :close-on-click-modal="false"
+    <!-- 新增/编辑对话框 -->
+    <el-dialog
+      :title="dialogTitle"
+      :visible.sync="dialogVisible"
+      width="500px"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        :model="form"
+        :rules="rules"
+        ref="form"
+        label-width="120px"
+        :validate-on-rule-change="false"
       >
-        <el-form
-          :model="form"
-          :rules="rules"
-          ref="form"
-          label-width="120px"
-          :validate-on-rule-change="false"
-        >
-          <el-form-item label="系统类别编号" prop="sysCode">
-            <el-input v-model="form.sysCode" :disabled="dialogTitle === '编辑系统类别'"></el-input>
-          </el-form-item>
-          <el-form-item label="系统类别名称" prop="sysName">
-            <el-input v-model="form.sysName"></el-input>
-          </el-form-item>
-          <el-form-item label="备注" prop="remark">
-            <el-input type="textarea" v-model="form.remark" rows="3"></el-input>
-          </el-form-item>
-        </el-form>
-        <div slot="footer">
-          <el-button @click="cancelForm">取 消</el-button>
-          <el-button type="primary" @click="submitForm" :loading="submitLoading">确 定</el-button>
-        </div>
-      </el-dialog>
+        <el-form-item label="系统类别编号" prop="sysNo">
+          <el-input v-model="form.sysNo" :disabled="dialogTitle === '编辑系统类别'"></el-input>
+        </el-form-item>
+        <el-form-item label="系统类别名称" prop="sysName">
+          <el-input v-model="form.sysName"></el-input>
+        </el-form-item>
+        <el-form-item label="备注" prop="sysRemark">
+          <el-input type="textarea" v-model="form.sysRemark" rows="3"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button @click="cancelForm">取 消</el-button>
+        <el-button type="primary" @click="submitForm" :loading="submitLoading">确 定</el-button>
+      </div>
+    </el-dialog>
 
-      <!-- 查看详情对话框 -->
-      <el-dialog title="查看系统类别" :visible.sync="viewDialogVisible" width="500px">
-        <el-descriptions :column="1" border>
-          <el-descriptions-item label="系统类别编号">{{ viewForm.systemCode }}</el-descriptions-item>
-          <el-descriptions-item label="系统类别名称">{{ viewForm.systemName }}</el-descriptions-item>
-          <el-descriptions-item label="备注">{{ viewForm.remark || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="产品数">{{ viewForm.productCount }}</el-descriptions-item>
-        </el-descriptions>
-      </el-dialog>
-    </div>
-  </template>
+    <!-- 查看详情对话框 -->
+    <el-dialog title="查看系统类别" :visible.sync="viewDialogVisible" width="500px">
+      <el-descriptions :column="1" border>
+        <el-descriptions-item label="系统类别编号">{{ viewForm.systemCode }}</el-descriptions-item>
+        <el-descriptions-item label="系统类别名称">{{ viewForm.systemName }}</el-descriptions-item>
+        <el-descriptions-item label="备注">{{ viewForm.sysRemark || '-' }}</el-descriptions-item>
+        <el-descriptions-item label="产品数">{{ viewForm.productCount }}</el-descriptions-item>
+      </el-descriptions>
+    </el-dialog>
+  </div>
+</template>
 
-  <script>
+<script>
 
-  import { add, list } from '@/api/sysCategory/sysCategory'
-  import { listWork } from '@/api/worksCategory/worksCategory'
+import { add, list } from '@/api/sysCategory/sysCategory'
+import { listWork } from '@/api/worksCategory/worksCategory'
 
 
-  export default {
-    name: 'SystemCategoryManagement',
-    data() {
-      return {
-        searchQuery: '',
-        loading: false,
-        submitLoading: false,
-        tableData: [
-          {
-            systemCode: 'pjxs',
-            systemName: '拼接显示',
-            remark: '',
-            productCount: 500
-          }
-        ],
-        pagination: {
-          currentPage: 1,
-          pageSize: 10,
-          total: 1
-        },
-        dialogVisible: false,
-        viewDialogVisible: false,
-        dialogTitle: '',
-        form: {
-          sysCode: '',
-          sysName: '',
-          remark: ''
-        },
-        viewForm: {
-          sysCode: '',
-          sysName: '',
-          remark: '',
-          productCount: 0
-        },
-        rules: {
-          sysCode: [
-            { required: true, message: '请输入系统类别编号', trigger: 'blur' },
-            { min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }
-          ],
-          sysName: [
-            { required: true, message: '请输入系统类别名称', trigger: 'blur' },
-            { min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }
-          ]
+export default {
+  name: 'SystemCategoryManagement',
+  data() {
+    return {
+      searchQuery: '',
+      loading: false,
+      submitLoading: false,
+      tableData: [
+        {
+          systemCode: 'pjxs',
+          systemName: '拼接显示',
+          sysRemark: '',
+          productCount: 500
         }
+      ],
+      pagination: {
+        currentPage: 1,
+        pageSize: 10,
+        total: 1
+      },
+      dialogVisible: false,
+      viewDialogVisible: false,
+      dialogTitle: '',
+      form: {
+        sysNo: '',
+        sysName: '',
+        sysRemark: ''
+      },
+      formQuery: {
+        sysNo: ''
+      },
+
+      viewForm: {
+        sysNo: '',
+        sysName: '',
+        sysRemark: '',
+        productCount: 0
+      },
+      rules: {
+        sysNo: [
+          { required: true, message: '请输入系统类别编号', trigger: 'blur' },
+          { min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }
+        ],
+        sysName: [
+          { required: true, message: '请输入系统类别名称', trigger: 'blur' },
+          { min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    async loadData() {
+      this.loading = true
+      try {
+        list(this.formQuery).then(response => {
+          this.tableData = response.rows;
+          this.total = response.total;
+          this.loading = false;
+        });
+      } catch (error) {
+        this.$message.error('加载数据失败')
+      } finally {
+        this.loading = false
       }
     },
-    methods: {
-      async loadData() {
-        this.loading = true
+    handleSearch() {
+      this.pagination.currentPage = 1
+      this.loadData()
+    },
+    handleAdd() {
+      this.dialogTitle = '新建系统类别'
+      this.form = {
+        systemCode: '',
+        systemName: '',
+        sysRemark: ''
+      }
+      this.dialogVisible = true
+      this.$nextTick(() => {
+        this.$refs.form.clearValidate()
+      })
+    },
+    handleEdit(row) {
+      this.dialogTitle = '编辑系统类别'
+      this.form = { ...row }
+      this.dialogVisible = true
+      this.$nextTick(() => {
+        this.$refs.form.clearValidate()
+      })
+    },
+    handleView(row) {
+      this.viewForm = { ...row }
+      this.viewDialogVisible = true
+    },
+    handleDelete(row) {
+      this.$confirm('确认删除该系统类别?删除后不可恢复', '提示', {
+        type: 'warning',
+        confirmButtonText: '确定',
+        cancelButtonText: '取消'
+      }).then(async () => {
         try {
-          list(this.searchQuery).then(response => {
-            this.tableData = response.rows;
-            this.total = response.total;
-            this.loading = false;
-          });
+          // await deleteSystemCategory(row.systemCode)
+          this.$message.success('删除成功')
+          this.loadData()
         } catch (error) {
-          this.$message.error('加载数据失败')
-        } finally {
-          this.loading = false
-        }
-      },
-      handleSearch() {
-        this.pagination.currentPage = 1
-        this.loadData()
-      },
-      handleAdd() {
-        this.dialogTitle = '新建系统类别'
-        this.form = {
-          systemCode: '',
-          systemName: '',
-          remark: ''
+          this.$message.error('删除失败')
         }
-        this.dialogVisible = true
-        this.$nextTick(() => {
-          this.$refs.form.clearValidate()
-        })
-      },
-      handleEdit(row) {
-        this.dialogTitle = '编辑系统类别'
-        this.form = { ...row }
-        this.dialogVisible = true
-        this.$nextTick(() => {
-          this.$refs.form.clearValidate()
-        })
-      },
-      handleView(row) {
-        this.viewForm = { ...row }
-        this.viewDialogVisible = true
-      },
-      handleDelete(row) {
-        this.$confirm('确认删除该系统类别?删除后不可恢复', '提示', {
-          type: 'warning',
-          confirmButtonText: '确定',
-          cancelButtonText: '取消'
-        }).then(async () => {
+      }).catch(() => {})
+    },
+    handleSizeChange(val) {
+      this.pagination.pageSize = val
+      this.loadData()
+    },
+    handleCurrentChange(val) {
+      this.pagination.currentPage = val
+      this.loadData()
+    },
+    cancelForm() {
+      this.dialogVisible = false
+      this.$refs.form.clearValidate()
+    },
+    async submitForm() {
+      this.$refs.form.validate(async (valid) => {
+        if (valid) {
+          this.submitLoading = true
           try {
-            // await deleteSystemCategory(row.systemCode)
-            this.$message.success('删除成功')
-            this.loadData()
-          } catch (error) {
-            this.$message.error('删除失败')
-          }
-        }).catch(() => {})
-      },
-      handleSizeChange(val) {
-        this.pagination.pageSize = val
-        this.loadData()
-      },
-      handleCurrentChange(val) {
-        this.pagination.currentPage = val
-        this.loadData()
-      },
-      cancelForm() {
-        this.dialogVisible = false
-        this.$refs.form.clearValidate()
-      },
-      async submitForm() {
-        this.$refs.form.validate(async (valid) => {
-          if (valid) {
-            this.submitLoading = true
-            try {
-              // if (this.dialogTitle === '新建系统类别') {
-              //   await createSystemCategory(this.form)
-              // } else {
-              //   await updateSystemCategory(this.form)
-              // }
+            // if (this.dialogTitle === '新建系统类别') {
+            //   await createSystemCategory(this.form)
+            // } else {
+            //   await updateSystemCategory(this.form)
+            // }
 
-              add(this.form).then(response => {
-                  debugger;
-                  this.$modal.msgSuccess("新增成功");
-                  this.open = false;
-                  this.getList();
-              });
+            add(this.form).then(response => {
+              this.open = false;
+              this.getList();
+              this.$modal.msgSuccess("新增成功");
 
-              this.$message.success('保存成功')
-              this.dialogVisible = false
-              this.loadData()
-            } catch (error) {
-              this.$message.error('保存失败')
-            } finally {
-              this.submitLoading = false
-            }
+            });
+
+            this.$message.success('保存成功')
+            this.dialogVisible = false
+            this.loadData()
+          } catch (error) {
+            this.$message.error('保存失败')
+          } finally {
+            this.submitLoading = false
           }
-        })
-      }
-    },
-    created() {
-      this.loadData()
+        }
+      })
     }
+  },
+  created() {
+    this.loadData()
   }
-  </script>
+}
+</script>
 
-  <style scoped>
-  .system-category-container {
-    padding: 20px;
-  }
-  .operation-area {
-    display: flex;
-    align-items: center;
-  }
-  </style>
+<style scoped>
+.system-category-container {
+  padding: 20px;
+}
+.operation-area {
+  display: flex;
+  align-items: center;
+}
+</style>