From 9bee0b12896d72f497b0ef3ce93cde9f36de64ed Mon Sep 17 00:00:00 2001
From: gaoshp <291585735@qq.com>
Date: 星期三, 10 四月 2024 20:40:44 +0800
Subject: [PATCH] 完善分类维护页面

---
 src/api/model/setting.js                              |   25 +++++
 副本智能制造系统功能定义.xls                                      |    0 
 src/views/console/system/component-classification.vue |  204 ++++++++++++++++++++++++++++++++++++++++++--------
 3 files changed, 194 insertions(+), 35 deletions(-)

diff --git a/src/api/model/setting.js b/src/api/model/setting.js
index 80f283e..9d78f36 100644
--- a/src/api/model/setting.js
+++ b/src/api/model/setting.js
@@ -1,7 +1,7 @@
 /*
  * @Date: 2024-04-07 21:49:32
  * @LastEditors: Sneed
- * @LastEditTime: 2024-04-09 22:29:57
+ * @LastEditTime: 2024-04-10 19:45:58
  * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/api/model/setting.js
  */
 import config from "@/config"
@@ -10,10 +10,31 @@
 export default {
     getList: {
         url: `${config.API_URL}/blade-visual/visual-comp-type/list`,
-		name: "鑾峰彇浼戞伅鏃ュ垪琛�",
+		name: "鍒嗙被缁存姢鍒楄〃",
 		get: async function(){
 			return await http.get(this.url);
 		}
     },
+    insert: {
+        url: `${config.API_URL}/blade-visual/visual-comp-type/insert`,
+		name: "鍒嗙被缁存姢鏂板",
+		post: async function(data){
+			return await http.post(this.url,data);
+		}
+    },
+    update: {
+        url: `${config.API_URL}/blade-visual/visual-comp-type/update`,
+		name: "鍒嗙被缁存姢缂栬緫",
+		post: async function(data){
+			return await http.put(this.url,data);
+		}
+    },
+    del: {
+        url: `${config.API_URL}/blade-visual/visual-comp-type/remove`,
+		name: "鍒嗙被缁存姢鏂板",
+		delete: async function(data,conf){
+			return await http.delete(this.url,data,conf);
+		}
+    },
     
 }
\ No newline at end of file
diff --git a/src/views/console/system/component-classification.vue b/src/views/console/system/component-classification.vue
index ed142b3..52f2fa9 100644
--- a/src/views/console/system/component-classification.vue
+++ b/src/views/console/system/component-classification.vue
@@ -1,7 +1,7 @@
 <!--
  * @Date: 2024-04-09 22:18:47
- * @LastEditors: lzhe lzhe@example.com
- * @LastEditTime: 2024-04-10 17:07:52
+ * @LastEditors: Sneed
+ * @LastEditTime: 2024-04-10 20:40:09
  * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/console/system/component-classification.vue
  * 鍒嗙被缁存姢
 -->
@@ -12,16 +12,21 @@
             <el-button @click="del" plain type="danger" :disabled="selection.length == 0">鍒犻櫎</el-button>
         </el-header>
         <el-main>
-            <el-table :data="tableData" style="width: 100%;margin-bottom: 20px;" row-key="id" border default-expand-all>
+            <el-table @selection-change="handleSelectionChange" :data="tableData" style="width: 100%;margin-bottom: 20px;" row-key="id" border
+                :tree-props="{ hasChildren: 'has' }">
                 <el-table-column type="selection" width="55" />
                 <el-table-column prop="name" label="鍒嗙被鍚嶇О" />
+                <el-table-column prop="parentId" label="涓婄骇鍒嗙被" />
                 <el-table-column prop="icon" label="鍒嗙被鍥炬爣">
+                    <template #default="scope">
+                        <component v-if="icons.includes(scope.row.icon)" style="width: 20px;height: 20px;" :is='scope.row.icon'></component>
+                    </template>
                 </el-table-column>
                 <el-table-column prop="type" label="鍒嗙被缂栧彿" />
                 <el-table-column prop="orderNum" label="鎺掑垪椤哄簭" />
                 <el-table-column prop="status" label="鐘舵��">
                     <template #default="scope">
-                        <span>{{scope.row.status === 1 ? '鍚敤' : '鍋滅敤'}}</span>
+                        <span>{{ scope.row.status === 1 ? '鍚敤' : '鍋滅敤' }}</span>
                     </template>
                 </el-table-column>
                 <el-table-column label="鎿嶄綔" fixed="right" align="left" width="160">
@@ -39,56 +44,189 @@
                 </el-table-column>
             </el-table>
         </el-main>
+        <el-dialog v-model="dialogVisible" :title="dialogTitle" width="750" :before-close="handleClose">
+            <el-form :model="row" :rules="rules" ref="dialogForm" label-width="120px" label-position="center">
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="鍒嗙被鍚嶇О" prop="name">
+                            <el-input style="width: 240px" v-model="row.name" placeholder="璇疯緭鍏ュ垎绫诲悕绉�"
+                                clearable></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="涓婄骇鍒嗙被" prop="parentId">
+                            <el-select v-model="row.parentId" filterable placeholder="璇烽�夋嫨涓婄骇鍒嗙被" style="width: 240px">
+                                <el-option v-for="item in options" :key="item.value" :label="item.label"
+                                    :value="item.value" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="鍒嗙被鍥炬爣" prop="icon">
+                            <el-input @click="showIconDialog = true" style="width: 240px" v-model="row.icon" placeholder="璇烽�夋嫨鍒嗙被鍥炬爣"
+                                clearable></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="鍒嗙被缂栧彿" prop="type">
+                            <el-input style="width: 240px" v-model="row.type" placeholder="璇疯緭鍏ュ垎绫荤紪鍙�"
+                                clearable></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="鎺掑垪椤哄簭" prop="orderNum">
+                            <el-input-number style="width: 240px" default v-model="row.orderNum" :min="0"
+                                placeholder="璇疯緭鍏ユ帓鍒楅『搴�" />
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="鐘舵��" prop="status">
+                            <el-radio-group style="width: 240px" v-model="row.status">
+                                <el-radio v-for="item in statusList" :label="item.value" :key="item.value">{{ item.label }}</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button @click="dialogVisible = false">鍙栨秷</el-button>
+                    <el-button type="primary" @click="save">
+                        淇濆瓨
+                    </el-button>
+                </div>
+            </template>
+        </el-dialog>
+        <el-dialog v-model="showIconDialog" title="鍒嗙被鍥炬爣" width="750">
+            <div class="icons">
+                <component @click="setIcon(item)" class="icon" v-for="item in icons" :is='item' :key="item"></component>    
+            </div>
+            
+        </el-dialog>
     </el-container>
 </template>
 
 <script>
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+let icons = []
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+    icons.push(key)
+}
 export default {
+    components: {
+        ...ElementPlusIconsVue
+    },
     data() {
         return {
             tableData: [],
-            selection: []
+            selection: [],
+            dialogVisible: false,
+            row: {
+                id: '',
+                name: '',
+                parentId: '',
+                icon: '',
+                type: '',
+                orderNum: 0,
+                status: 1,
+            },
+            rules: {
+                name: [
+                    { required: true, message: '璇疯緭鍏ュ垎绫诲悕绉�' }
+                ],
+                type: [
+                    { required: true, message: '璇疯緭鍏ュ垎绫荤紪鍙�' }
+                ]
+            },
+            options: [],
+            statusList:[
+                {
+                    label: '鍚敤',
+                    value: 1
+                },
+                {
+                    label: '鍋滅敤',
+                    value: 0
+                }
+            ],
+            showIconDialog: false,
+            icons
         }
     },
-    created () {
+    created() {
         this.queryList()
     },
     methods: {
-        removeHasChildren(arr) {  
-            return arr.map(item => {  
-                // 鍒涘缓涓�涓笉鍖呭惈hasChildren鐨勬柊瀵硅薄  
-                const newItem = { ...item };  
-                delete newItem.hasChildren; // 鍒犻櫎hasChildren瀛楁  
-                // 濡傛灉children瀛楁瀛樺湪涓旀槸鏁扮粍锛屽垯閫掑綊澶勭悊children  
-                if (Array.isArray(newItem.children)) {  
-                newItem.children = this.removeHasChildren(newItem.children);  
-                }  
-            
-                return newItem;  
-            });  
+        add() {
+            this?.$refs?.dialogForm?.resetFields()
+            Object.keys(this.row).forEach(v => {
+                this.row[v] = ''
+            })
+            this.row.orderNum = 0
+            this.dialogTitle = '鏂板'
+            this.dialogVisible = true
         },
-        add () {
-            alert(2)
-        },
-        del () {
-            alert(1)
-        },
-        queryList () {
-            this.$API.setting.getList.get().then(res => {
-                this.tableData = this.removeHasChildren(res.data);
+        save() {
+            this.$refs.dialogForm.validate(async (valid) => {
+                if (valid) {
+                    let request = this.$API.setting.insert
+                    if (this?.row?.id) {
+                        request = this.$API.setting.update
+                    }
+                    request.post(this.row).then(res => {
+                        this.dialogVisible = false
+                        this.queryList()
+                    })
+                }
             })
         },
-        table_edit() {
-
+        del() {
+            this.$API.setting.del.delete({},{data: this.selection.map(v => v.id)}).then(res => {
+                this.queryList()
+            })
         },
-        table_del() {
-
+        queryList() {
+            this.$API.setting.getList.get().then(res => {
+                this.tableData = res.data;
+                this.options = res.data.map(item => ({
+                    value: item.id,
+                    label: item.name
+                }))
+            })
         },
-        handleSelectionChange (selection) {
+        table_edit(row) {
+            this.row = {...row}
+            console.log(this.row)
+            this.dialogTitle = '鏂板'
+            this.dialogVisible = true
+        },
+        table_del(row) {
+            this.$API.setting.del.delete({}, { data: [row.id] }).then(res => {
+                this.queryList()
+            })
+        },
+        handleSelectionChange(selection) {
+            console.log('>>>>>>')
             this.selection = selection;
+        },
+        setIcon(icon) {
+            console.log('>>>>>>',icon)
+            this.row.icon = icon
+            this.showIconDialog = false
         }
     },
 }
 </script>
 
-<style lang="scss" scoped></style>
\ No newline at end of file
+<style lang="scss" scoped>
+    .icons {
+        display: flex;
+        flex-wrap: wrap;
+    }
+    .icon {
+        margin: 10px;
+        width: 20px;
+        height: 20px;
+        cursor: pointer;
+    }
+</style>
\ No newline at end of file
diff --git "a/\345\211\257\346\234\254\346\231\272\350\203\275\345\210\266\351\200\240\347\263\273\347\273\237\345\212\237\350\203\275\345\256\232\344\271\211.xls" "b/\345\211\257\346\234\254\346\231\272\350\203\275\345\210\266\351\200\240\347\263\273\347\273\237\345\212\237\350\203\275\345\256\232\344\271\211.xls"
index 1ec237f..939ab16 100644
--- "a/\345\211\257\346\234\254\346\231\272\350\203\275\345\210\266\351\200\240\347\263\273\347\273\237\345\212\237\350\203\275\345\256\232\344\271\211.xls"
+++ "b/\345\211\257\346\234\254\346\231\272\350\203\275\345\210\266\351\200\240\347\263\273\347\273\237\345\212\237\350\203\275\345\256\232\344\271\211.xls"
Binary files differ

--
Gitblit v1.9.3