From c47e02ce2df67fe5426bf186add45d141ddfbc00 Mon Sep 17 00:00:00 2001 From: wangting <wangting@vci-tech.com> Date: 星期五, 20 十二月 2024 18:18:13 +0800 Subject: [PATCH] 图标管理 --- Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/Icons/index.vue | 251 +++++++++++++---------------------- Source/plt-web/plt-web-ui/src/util/func.js | 6 Source/plt-web/plt-web-ui/src/api/UI/Icons.js | 10 Source/plt-web/plt-web-ui/src/components/PLT-basic-component/input-icon.vue | 68 ++++----- Source/plt-web/plt-web-ui/src/views/wel/homeConfig.vue | 64 +++++--- 5 files changed, 175 insertions(+), 224 deletions(-) diff --git a/Source/plt-web/plt-web-ui/src/api/UI/Icons.js b/Source/plt-web/plt-web-ui/src/api/UI/Icons.js index 812e71f..2db0ef1 100644 --- a/Source/plt-web/plt-web-ui/src/api/UI/Icons.js +++ b/Source/plt-web/plt-web-ui/src/api/UI/Icons.js @@ -3,7 +3,7 @@ // 鍥炬爣搴撴煡璇� export function getIcons(params) { return request({ - url: "/api/uiManagerController/getIcons", + url: "/api/webIconController/getAllIcon", method: "get", params }); @@ -12,7 +12,7 @@ // 鍒涘缓 export function addIcon(params) { return request({ - url: "/api/btmTypeController/addIcon", + url: "/api/webIconController/addIcon", method: "post", data:params }); @@ -21,7 +21,7 @@ // 淇敼 export function updateIcon(params) { return request({ - url: "/api/btmTypeController/updateIcon", + url: "/api/webIconController/editIcon", method: "put", data:params }); @@ -30,8 +30,8 @@ // 鍒犻櫎 export function deleteIcon(params) { return request({ - url: "/api/btmTypeController/deleteIcon", + url: "/api/webIconController/delIcon", method: "delete", - data:params + params }); } diff --git a/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/input-icon.vue b/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/input-icon.vue index cd445af..156d397 100644 --- a/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/input-icon.vue +++ b/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/input-icon.vue @@ -17,21 +17,21 @@ <span class="tag-group__title">鍒嗙被</span> <el-tag v-for="item in types" - :key="item" - :type="checkedTypes.includes(item)?'success':'info'" size="small" - effect="plain" @click="changeType(item)"> - {{ item }} + :key="item.value" + :type="checkedTypes.includes(item.value)?'success':'info'" size="small" + effect="plain" @click="changeType(item.value)"> + {{ item.label }} </el-tag> </div> <avue-input v-model="searchText" @change="handleSearch" placeholder="鏌ヨ" size="mini" prefixIcon="el-icon-search" style="width: 300px;max-width: 30%"></avue-input> </div> <div style="height: 60vh"> <el-tabs v-model="activeName" @tab-click="handleTabClick"> - <el-tab-pane v-for="item in iconList" :label="item.label" :name="item.label"> + <el-tab-pane v-for="item in iconList" :label="item.lable" :name="item.lable" style="height: calc(60vh - 80px);;overflow: auto "> <div class="iconList"> - <div class="iconItem" v-for="svg in item.list" :data-value="svg.name" @click="checkSvg(svg,item.type)"> - <div v-html="svg.svg"></div> - <span>{{svg.name.split(':')[1]}}</span> + <div class="iconItem" v-for="svg in item.list" :data-value="svg.name" @click="checkSvg(svg,item.lable)"> + <div v-html="svg.content"></div> + <!--<span>{{svg.name.split(':')[1]}}</span>--> </div> </div> </el-tab-pane> @@ -79,7 +79,16 @@ data(){ return { visible: false, - types: ['鏍囩涓�' , '鏍囩浜�' , '鏍囩涓�' , '鏍囩鍥�','鏍囩浜�' ], + types: [{ + label:'鎸夐挳', + value:0 + },{ + label:'鏍囩浜�', + value:1 + },{ + label:'鏍囩涓�', + value:2 + }], checkedTypes:[], searchText:'', activeName:'', @@ -103,16 +112,16 @@ } this.allIconList=this.iconList; if(this.iconList && this.iconList.length>0){ - this.activeName=this.iconList[0].label; + this.activeName=this.iconList[0].lable; }else { - /*getIcons().then(res => { + getIcons().then(res => { this.iconList=res.data.data; this.allIconList=this.iconList; store.dispatch("setIcons", this.iconList); if(this.iconList&&this.iconList.length>0) { - this.activeName=this.iconList[0].label; + this.activeName=this.iconList[0].lable; } - })*/ + }) } }, methods:{ @@ -122,26 +131,7 @@ handleFocus() { if (!this.disabled) { if(this.iconList&&this.iconList.length>0) { - this.activeName=this.iconList[0].label; - }else { - if (!validatenull(this.$store.state.icons)) { - this.iconList = this.$store.state.icons; - } else { - this.iconList = getStore({ name:'icons'}); - } - this.allIconList=this.iconList; - if(this.iconList && this.iconList.length>0){ - this.activeName=this.iconList[0].label; - }else { - /*getIcons().then(res => { - this.iconList=res.data.data; - this.allIconList=this.iconList; - store.dispatch("setIcons", this.iconList); - if(this.iconList&&this.iconList.length>0) { - this.activeName=this.iconList[0].label; - } - })*/ - } + this.activeName=this.iconList[0].lable; } this.visible = true; } @@ -157,11 +147,12 @@ if(this.checkedTypes.length==0){ this.iconList=this.allIconList }else{ + const checkedTypes=JSON.stringify(this.checkedTypes); this.iconList=this.allIconList.filter(item=> { - return this.checkedTypes.includes(item.type); + return checkedTypes.indexOf(JSON.stringify(item.groups))!=-1; }) } - this.activeName=this.iconList[0].label; + this.activeName=this.iconList[0].lable; }, handleTabClick(tab, event){ @@ -173,10 +164,9 @@ let iconList=[] this.allIconList.forEach(item=> { iconList.push({ - label:item.label, - type:item.type, + lable:item.lable, list: item.list.filter(iconItem=>{ - return iconItem.name.replace(item.label,'').indexOf(data.value)!=-1; + return iconItem.name.replace(item.lable,'').indexOf(data.value)!=-1; }) }) }) @@ -187,7 +177,7 @@ this.$emit('input','') }, checkSvg(item){ - this.svgHtml=item.svg; + this.svgHtml=item.content; this.$emit('input',item.name) this.dialogClose(); } diff --git a/Source/plt-web/plt-web-ui/src/util/func.js b/Source/plt-web/plt-web-ui/src/util/func.js index adc21af..e3c463d 100644 --- a/Source/plt-web/plt-web-ui/src/util/func.js +++ b/Source/plt-web/plt-web-ui/src/util/func.js @@ -328,11 +328,11 @@ let iconList = getStore({name: 'icons'}); if (iconList && iconList.length > 0) { let libName = name.split(':')[0]; - let currentLic = iconList.find(item => item.label == libName); + let currentLic = iconList.find(item => item.lable == libName); if (currentLic.list) { currentLic.list.find(item => { if (item.name == name) { - svgHtml = item.svg; + svgHtml = item.content; } return item.name == name; }) @@ -342,7 +342,7 @@ this.iconList=res.data.data; store.dispatch("setIcons", this.iconList); if(this.iconList.length>0) { - this.activeName=this.iconList[0].label; + this.activeName=this.iconList[0].lable; } }) } diff --git a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/Icons/index.vue b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/Icons/index.vue index 855611b..228d56c 100644 --- a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/Icons/index.vue +++ b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/Icons/index.vue @@ -7,10 +7,10 @@ <span class="tag-group__title">鍒嗙被</span> <el-tag v-for="item in types" - :key="item" - :type="checkedTypes.includes(item)?'success':'info'" size="small" - effect="plain" @click="changeType(item)"> - {{ item }} + :key="item.value" + :type="checkedTypes.includes(item.value)?'success':'info'" size="small" + effect="plain" @click="changeType(item.value)"> + {{ item.label }} </el-tag> </div> <avue-input v-model="searchText" @change="handleSearch" placeholder="鏌ヨ" size="mini" prefixIcon="el-icon-search" style="width: 300px;max-width: 30%"></avue-input> @@ -19,13 +19,14 @@ <div> <el-button icon="el-icon-plus" type="primary" size="mini" @click="uploadHandler">娣诲姞</el-button> </div> + <el-tabs v-model="activeName" @tab-click="handleClick"> - <el-tab-pane v-for="item in iconList" :label="item.label" :name="item.label"> + <el-tab-pane v-for="item in iconList" :label="item.lable" :name="item.lable" style="height: calc(100vh - 270px);overflow: auto "> <div class="iconList"> - <div :class="'iconItem '+(svg.checked?'activeIconItem':'')" v-for="svg in item.list" + <div class="iconItem" v-for="svg in item.list" :data-value="svg.name" v-right-click="{action:checkSvg,data:svg}"> - <div v-html="svg.svg"></div> - <span>{{svg.name.split(':')[1]}}</span> + <div v-html="svg.content"></div> + <!--<span>{{svg.name.split(':')[1]}}</span>--> </div> </div> <div v-if="menuVisible" class="el-cascader-panel is-bordered iconList__menu" :style="menuPosition"> @@ -45,11 +46,7 @@ width="500px" @close="visibleCloseHandler" > - <avue-form ref="form" :option="option" v-model="form"> </avue-form> - <span slot="footer" class="dialog-footer"> - <el-button size="small" type="primary" @click="uploadSaveHandler">纭� 瀹�</el-button> - <el-button size="small" @click="visibleCloseHandler">鍙� 娑�</el-button> - </span> + <avue-form ref="form" :option="option" v-model="form" :upload-after="uploadAfter"> </avue-form> </el-dialog> <!-- 淇敼 --> <el-dialog @@ -94,7 +91,16 @@ }, data() { return { - types: ['鏍囩涓�' , '鏍囩浜�' , '鏍囩涓�' , '鏍囩鍥�','鏍囩浜�' ], + types: [{ + label:'鎸夐挳', + value:0 + },{ + label:'鏍囩浜�', + value:1 + },{ + label:'鏍囩涓�', + value:2 + }], checkedTypes:[], searchText:'', activeName:'', @@ -108,38 +114,28 @@ emptyBtn:false, column: [{ label: '鍒嗙被', - prop: 'type', + prop: 'groups', type: 'select', span: 24, multiple:true, - dicData:[{ - label:'鏍囩涓�', - value:0 - },{ - label:'鏍囩浜�', - value:1 - },{ - label:'鏍囩涓�', - value:2 - }] + dicData:this.types }, { label: "闄勪欢涓婁紶", prop: "file", - dataType: "object", type: "upload", + dataType: "object", accept:'.json', + action:"api/webIconController/importIcon", data:{}, headers:this.uploadHeaders, - propsHttp: { - res: "data", - }, span: 24, - action: "", } ] }, form:{ - type:[] + type:'svg', + groups:[], + file:null }, editVisible:false, editOption:{ @@ -150,6 +146,7 @@ label: 'name', prop: 'name', type: 'input', + disabled:true, span: 24, rules: [{ required: true, @@ -158,7 +155,7 @@ }] }, { label: "svg", - prop: "svg", + prop: "content", type: "textarea", span: 24, rules: [{ @@ -171,7 +168,7 @@ editForm:{ oid:'', name:'', - svg:'' + content:'' }, menuVisible:false, menuPosition: { @@ -187,11 +184,31 @@ }; }, }, + watch:{ + 'form.groups'(val){ + this.option.column[1].data={ + type:'svg', + groups:val + } + } + }, created() { this.initList(); + this.option.column[0].dicData=this.types; }, methods:{ - initList(){ + initList(reload){ + if(reload){ + getIcons().then(res => { + this.iconList = res.data.data; + this.allIconList = this.iconList; + store.dispatch("setIcons", this.iconList); + if (this.iconList.length > 0) { + this.activeName = this.iconList[0].lable; + } + }) + return; + } if (!validatenull(this.$store.state.icons)) { this.iconList = this.$store.state.icons; } else { @@ -199,118 +216,28 @@ } this.allIconList=this.iconList; if(this.iconList && this.iconList.length>0){ - this.activeName=this.iconList[0].label; + this.activeName=this.iconList[0].lable; }else { getIcons().then(res => { - this.iconList=res.data.data; - this.iconList=[{ - label:'iconoir', - type:'鏍囩涓�', - list:[{ + this.iconList = [{ + lable: 'iconoir', + list: [{ + oid: '', + groups: '0', "name": "iconoir:accessibility", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12s4.477 10 10 10M7 9l5 1m5-1l-5 1m0 0v3m0 0l-2 5m2-5l2 5\"/><path fill=\"currentColor\" d=\"M12 7a.5.5 0 1 1 0-1a.5.5 0 0 1 0 1\"/></g></svg>" - }, - { - "name": "iconoir:accessibility-sign", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"m11.5 12.5l7-.5l-1.5 6.5m-5.5-6l4.5-5L12.5 5L10 7.5m8.5-1a2 2 0 1 1 0-4a2 2 0 0 1 0 4\"/><path d=\"M5.5 12.5a5 5 0 0 1 7.584 6M3.729 15A5 5 0 0 0 11 20.831\"/></g></svg>" - }, - { - "name": "iconoir:accessibility-tech", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\"><path d=\"M3 19V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z\"/><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m12.5 12.16l4-.16l-.5 4.5M11.833 12L13.5 9.538L10.833 8L9.5 9.846\"/><path fill=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M15.5 7.5a.5.5 0 1 1 0-1a.5.5 0 0 1 0 1\"/><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M10.5 18a3 3 0 1 1 0-6a3 3 0 0 1 0 6\"/></g></svg>" - }, - { - "name": "iconoir:activity", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M3 12h3l3-9l6 18l3-9h3\"/></svg>" - }, - { - "name": "iconoir:adobe-after-effects", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M21 7v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4\"/><path d=\"M14 13v-1a2 2 0 0 1 2-2v0a2 2 0 0 1 2 2v1zm0 0v1a2 2 0 0 0 2 2h1.5M6 16l1.125-3M12 16l-1.125-3m-3.75 0L9 8l1.875 5m-3.75 0h3.75\"/></g></svg>" - }, - { - "name": "iconoir:adobe-after-effects-solid", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M21.75 17A4.75 4.75 0 0 1 17 21.75H7A4.75 4.75 0 0 1 2.25 17V7A4.75 4.75 0 0 1 7 2.25h10A4.75 4.75 0 0 1 21.75 7zm-3.5-1a.75.75 0 0 1-.75.75H16A2.75 2.75 0 0 1 13.25 14v-2a2.75 2.75 0 1 1 5.5 0v1a.75.75 0 0 1-.75.75h-3.25V14c0 .69.56 1.25 1.25 1.25h1.5a.75.75 0 0 1 .75.75m-1-3.75V12a1.25 1.25 0 1 0-2.5 0v.25zM5.298 15.736a.75.75 0 1 0 1.404.527l.943-2.513h2.71l.943 2.513a.75.75 0 1 0 1.404-.527l-3-8a.75.75 0 0 0-1.404 0zm4.495-3.486H8.207L9 10.136z\" clip-rule=\"evenodd\"/></svg>" - }, - { - "name": "iconoir:adobe-illustrator", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M21 7v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4m-5 5v4m0-7v.01\"/><path d=\"m7 16l1.125-3M13 16l-1.125-3m-3.75 0L10 8l1.875 5m-3.75 0h3.75\"/></g></svg>" - }, - { - "name": "iconoir:adobe-illustrator-solid", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M17 21.75A4.75 4.75 0 0 0 21.75 17V7A4.75 4.75 0 0 0 17 2.25H7A4.75 4.75 0 0 0 2.25 7v10A4.75 4.75 0 0 0 7 21.75zM15.25 16a.75.75 0 0 0 1.5 0v-4a.75.75 0 0 0-1.5 0zM16 9.76a.75.75 0 0 1-.75-.75V9a.75.75 0 0 1 1.5 0v.01a.75.75 0 0 1-.75.75m-9.702 5.977a.75.75 0 1 0 1.404.526l.943-2.513h2.71l.943 2.513a.75.75 0 1 0 1.404-.527l-3-8a.75.75 0 0 0-1.404 0zM10 10.136l.793 2.114H9.207z\" clip-rule=\"evenodd\"/></svg>" - }] - },{ - label:'iconoir2', - type:'鏍囩浜�', - list:[{ - "name": "iconoir2:adobe-illustrator", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M21 7v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4m-5 5v4m0-7v.01\"/><path d=\"m7 16l1.125-3M13 16l-1.125-3m-3.75 0L10 8l1.875 5m-3.75 0h3.75\"/></g></svg>" - }, - { - "name": "iconoir2:adobe-illustrator-solid", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M17 21.75A4.75 4.75 0 0 0 21.75 17V7A4.75 4.75 0 0 0 17 2.25H7A4.75 4.75 0 0 0 2.25 7v10A4.75 4.75 0 0 0 7 21.75zM15.25 16a.75.75 0 0 0 1.5 0v-4a.75.75 0 0 0-1.5 0zM16 9.76a.75.75 0 0 1-.75-.75V9a.75.75 0 0 1 1.5 0v.01a.75.75 0 0 1-.75.75m-9.702 5.977a.75.75 0 1 0 1.404.526l.943-2.513h2.71l.943 2.513a.75.75 0 1 0 1.404-.527l-3-8a.75.75 0 0 0-1.404 0zM10 10.136l.793 2.114H9.207z\" clip-rule=\"evenodd\"/></svg>" - }, - { - "name": "iconoir2:adobe-indesign", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M21 7v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4M8.5 8v8\"/><path d=\"M15.5 12v3.4a.6.6 0 0 1-.6.6h-1.4a2 2 0 0 1-2-2v0a2 2 0 0 1 2-2zm0 0V9\"/></g></svg>" - }, - { - "name": "iconoir2:adobe-indesign-solid", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M21.75 17A4.75 4.75 0 0 1 17 21.75H7A4.75 4.75 0 0 1 2.25 17V7A4.75 4.75 0 0 1 7 2.25h10A4.75 4.75 0 0 1 21.75 7zM8.5 16.75a.75.75 0 0 1-.75-.75V8a.75.75 0 0 1 1.5 0v8a.75.75 0 0 1-.75.75m5-4h1.25v2.5H13.5a1.25 1.25 0 1 1 0-2.5m0 4a2.75 2.75 0 1 1 0-5.5h1.25V9a.75.75 0 0 1 1.5 0v6.4a1.35 1.35 0 0 1-1.35 1.35z\" clip-rule=\"evenodd\"/></svg>" - }, - { - "name": "iconoir2:adobe-lightroom", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M21 7v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4\"/><path d=\"M7 8v8h4m3-5.5V13m0 3v-3m0 0s0-2.5 3-2.5\"/></g></svg>" - }, - { - "name": "iconoir2:adobe-lightroom-solid", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M21.75 17A4.75 4.75 0 0 1 17 21.75H7A4.75 4.75 0 0 1 2.25 17V7A4.75 4.75 0 0 1 7 2.25h10A4.75 4.75 0 0 1 21.75 7zM7 16.75a.75.75 0 0 1-.75-.75V8a.75.75 0 0 1 1.5 0v7.25H11a.75.75 0 0 1 0 1.5zm6.25-.75a.75.75 0 0 0 1.5 0v-2.998l.003-.045a2 2 0 0 1 .265-.82c.235-.392.736-.887 1.982-.887a.75.75 0 0 0 0-1.5c-.973 0-1.713.232-2.268.586a.75.75 0 0 0-1.482.164z\" clip-rule=\"evenodd\"/></svg>" - }, - { - "name": "iconoir2:adobe-photoshop", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M21 7v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4\"/><path d=\"M7 16v-4m0 0V8h2a2 2 0 0 1 2 2v0a2 2 0 0 1-2 2zm10-1c-.306-.613-.933-1-1.618-1H15a1.5 1.5 0 0 0-1.5 1.5v0A1.5 1.5 0 0 0 15 13h.5a1.5 1.5 0 0 1 1.5 1.5v0a1.5 1.5 0 0 1-1.5 1.5h-.382a1.81 1.81 0 0 1-1.618-1v0\"/></g></svg>" - }, - { - "name": "iconoir2:adobe-photoshop-solid", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M21.75 17A4.75 4.75 0 0 1 17 21.75H7A4.75 4.75 0 0 1 2.25 17V7A4.75 4.75 0 0 1 7 2.25h10A4.75 4.75 0 0 1 21.75 7zM7 16.75a.75.75 0 0 1-.75-.75V8A.75.75 0 0 1 7 7.25h2a2.75 2.75 0 1 1 0 5.5H7.75V16a.75.75 0 0 1-.75.75m.75-5.5H9a1.25 1.25 0 1 0 0-2.5H7.75zm8.579.085a.75.75 0 1 0 1.342-.67a2.56 2.56 0 0 0-2.29-1.415H15a2.25 2.25 0 0 0 0 4.5h.5a.75.75 0 0 1 0 1.5h-.382a1.06 1.06 0 0 1-.947-.585a.75.75 0 0 0-1.342.67a2.56 2.56 0 0 0 2.289 1.415h.382a2.25 2.25 0 1 0 0-4.5H15a.75.75 0 0 1 0-1.5h.382c.4 0 .768.227.947.585\" clip-rule=\"evenodd\"/></svg>" - }, - { - "name": "iconoir2:adobe-xd", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M21 7v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4M7 8l4 8m-4 0l4-8\"/><path d=\"M17 12v3.4a.6.6 0 0 1-.6.6H15a2 2 0 0 1-2-2v0a2 2 0 0 1 2-2zm0 0V9\"/></g></svg>" - }, - { - "name": "iconoir2:adobe-xd-solid", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M21.75 17A4.75 4.75 0 0 1 17 21.75H7A4.75 4.75 0 0 1 2.25 17V7A4.75 4.75 0 0 1 7 2.25h10A4.75 4.75 0 0 1 21.75 7zm-15.085-.33a.75.75 0 0 1-.336-1.006L8.162 12L6.329 8.335a.75.75 0 0 1 1.342-.67l1.33 2.658l1.328-2.659a.75.75 0 0 1 1.342.671L9.839 12l1.832 3.664a.75.75 0 0 1-1.342.671L9 13.677l-1.329 2.658a.75.75 0 0 1-1.006.336M15 12.75h1.25v2.5H15a1.25 1.25 0 1 1 0-2.5m0 4a2.75 2.75 0 1 1 0-5.5h1.25V9a.75.75 0 0 1 1.5 0v6.4a1.35 1.35 0 0 1-1.35 1.35z\" clip-rule=\"evenodd\"/></svg>" - }, - { - "name": "iconoir2:african-tree", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M12 22V12m0-4v4m0 0l3-3m-2.576 9.576l6.169-6.169a5.502 5.502 0 0 0-.513-8.234a9.904 9.904 0 0 0-12.16 0a5.502 5.502 0 0 0-.513 8.234l6.169 6.169a.6.6 0 0 0 .848 0\"/></svg>" - }, - { - "name": "iconoir2:agile", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M17.5 19H22m0 0l-2.5-2.5M22 19l-2.5 2.5M12 2L9.5 4.5L12 7\"/><path d=\"M10.5 4.5a7.5 7.5 0 0 1 0 15H2\"/><path d=\"M6.756 5.5A7.5 7.5 0 0 0 3 12c0 1.688.558 3.246 1.5 4.5\"/></g></svg>" - }, - { - "name": "iconoir2:air-conditioner", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M22 3.6V11H2V3.6a.6.6 0 0 1 .6-.6h18.8a.6.6 0 0 1 .6.6M18 7h1M2 11l.79 2.584A2 2 0 0 0 4.702 15H6m16-4l-.79 2.584A2 2 0 0 1 19.298 15H18m-8.5-.5s0 7-3.5 7m8.5-7s0 7 3.5 7m-6-7v7\"/></svg>" - }, - { - "name": "iconoir2:airplane", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><path fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M10.5 4.5v4.667a.6.6 0 0 1-.282.51l-7.436 4.647a.6.6 0 0 0-.282.508v.9a.6.6 0 0 0 .746.582l6.508-1.628a.6.6 0 0 1 .746.582v2.96a.6.6 0 0 1-.205.451l-2.16 1.89c-.458.402-.097 1.151.502 1.042l3.256-.591a.6.6 0 0 1 .214 0l3.256.591c.599.11.96-.64.502-1.041l-2.16-1.89a.6.6 0 0 1-.205-.452v-2.96a.6.6 0 0 1 .745-.582l6.51 1.628a.6.6 0 0 0 .745-.582v-.9a.6.6 0 0 0-.282-.508l-7.436-4.648a.6.6 0 0 1-.282-.509V4.5a1.5 1.5 0 0 0-3 0\"/></svg>" - }, - { - "name": "iconoir2:airplane-helix", - "svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-miterlimit=\"1.5\" stroke-width=\"1.5\"><path d=\"M12 15a3 3 0 1 0 0-6a3 3 0 0 0 0 6\"/><path d=\"M12 9s-1.988-1.975-2-4c.001-1.993-.05-4.001 2-4c1.948.001 1.997 1.976 2 4c.003 1.985-2 4-2 4m3 3s1.975-1.988 4-2c1.993.001 4.001-.05 4 2c-.001 1.948-1.976 1.997-4 2c-1.985.003-4-2-4-2m-6 0s-1.975 1.988-4 2c-1.993-.001-4.001.05-4-2c.001-1.948 1.976-1.997 4-2c1.985-.003 4 2 4 2m3 3s1.988 1.975 2 4c-.001 1.993.05 4.001-2 4c-1.948-.001-1.997-1.976-2-4c-.003-1.985 2-4 2-4\" clip-rule=\"evenodd\"/></g></svg>" - }] + "content": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"><path d=\"M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12s4.477 10 10 10M7 9l5 1m5-1l-5 1m0 0v3m0 0l-2 5m2-5l2 5\"/><path fill=\"currentColor\" d=\"M12 7a.5.5 0 1 1 0-1a.5.5 0 0 1 0 1\"/></g></svg>" + }] }] - this.allIconList=this.iconList; + this.iconList = res.data.data; + this.allIconList = this.iconList; store.dispatch("setIcons", this.iconList); - if(this.iconList.length>0) { - this.activeName=this.iconList[0].label; + if (this.iconList.length > 0) { + this.activeName = this.iconList[0].lable; } }) } }, - changeType(type){ + changeType(type){debugger; if(this.checkedTypes.includes(type)){ this.checkedTypes=this.checkedTypes.filter(item=> item!=type) }else { @@ -320,11 +247,12 @@ if(this.checkedTypes.length==0){ this.iconList=this.allIconList }else{ + const checkedTypes=JSON.stringify(this.checkedTypes); this.iconList=this.allIconList.filter(item=> { - return this.checkedTypes.includes(item.type); + return checkedTypes.indexOf(JSON.stringify(item.groups))!=-1; }) } - this.activeName=this.iconList[0].label; + this.activeName=this.iconList[0].lable; }, handleSearch(data){ if(data.value==''){ @@ -333,10 +261,9 @@ let iconList=[] this.allIconList.forEach(item=> { iconList.push({ - label:item.label, - type:item.type, + lable:item.lable, list: item.list.filter(iconItem=>{ - return iconItem.name.replace(item.label,'').indexOf(data.value)!=-1; + return iconItem.name.replace(item.lable,'').indexOf(data.value)!=-1; }) }) }) @@ -348,9 +275,24 @@ uploadHandler(){ this.visible = true; }, + //涓婁紶鍚� + uploadAfter(res,done){ + if (res.success) { + this.$message.success(res.msg); + this.initList(true); + this.visibleCloseHandler(); + }else { + this.$message.error(res.msg); + } + done(); + }, // 鍏抽棴瀵硅瘽妗� visibleCloseHandler() { - const form = {} + const form = { + type:'svg', + groups:[], + file:null + } this.form = form; this.visible = false; this.$refs.form.clearValidate(); @@ -372,12 +314,12 @@ done() addIcon(this.form).then(res => { if (res.data.code === 200) { - this.$message.success(res.data.obj); - this.initList(); + this.$message.success(res.data.msg); + this.initList(true); done(); this.visibleCloseHandler(); } else { - this.$message.error(res.data.obj); + this.$message.error(res.data.msg); } }) } else { @@ -395,12 +337,12 @@ done() updateIcon(this.editForm).then(res => { if (res.data.code === 200) { - this.$message.success(res.data.obj); - this.initList(); + this.$message.success(res.data.msg); + this.initList(true); done(); this.closeHandler(); } else { - this.$message.error(res.data.obj); + this.$message.error(res.data.msg); } }) } else { @@ -410,8 +352,9 @@ }, closeHandler(){ this.editForm={ + oid:'', name:'', - svg:'' + content:'' } this.editVisible=false; }, @@ -425,8 +368,8 @@ const obj = {name,oid}; deleteIcon(obj).then(res => { if (res.data.code === 200) { - this.$message.success(res.data.obj); - this.getTreeList(); + this.$message.success(res.data.msg); + this.initList(true); } }) }).catch(() => { @@ -452,8 +395,8 @@ flex-wrap: wrap; } .iconList .iconItem{ - width: 65px; - margin: 6px; + width: 35px; + margin: 6px 12px; text-align: center; } .iconList .iconItem div:hover{ diff --git a/Source/plt-web/plt-web-ui/src/views/wel/homeConfig.vue b/Source/plt-web/plt-web-ui/src/views/wel/homeConfig.vue index 73b5660..fc9ae9f 100644 --- a/Source/plt-web/plt-web-ui/src/views/wel/homeConfig.vue +++ b/Source/plt-web/plt-web-ui/src/views/wel/homeConfig.vue @@ -38,6 +38,11 @@ <el-form ref="form" :model="form" :rules="rules" label-width="95px" size="small"> <el-row> <el-col :span="24"> + <el-form-item label="鎺掑簭锛�" prop="orderNum"> + <avue-input-number v-model="form.orderNum" precision="0" style="width: 100%" :max="24" :min="1" controls-position=""></avue-input-number> + </el-form-item> + </el-col> + <el-col :span="24"> <el-form-item label="缁勪欢锛�" prop="id"> <avue-select v-model="form.id" placeholder="璇烽�夋嫨缁勪欢" type="tree" :dic="dic"></avue-select> </el-form-item> @@ -48,19 +53,19 @@ </el-form-item> </el-col> <el-col :span="24"> - <el-form-item label="鍗犳嵁鍒楁暟锛�" prop="span" tip="鎬诲垪鏁颁负24"> - <avue-input-number v-model="form.span" precision="0" style="width: 100%" :max="24" :min="1" controls-position="" tip="鎬诲垪鏁颁负24锛屽鍗犳弧鏁磋璇疯緭鍏�24"></avue-input-number> - </el-form-item> - </el-col> - <el-col :span="24"> <el-form-item label="鍥炬爣锛�" prop="icon"> <input-icon v-model="form.icon" placeholder="璇烽�夋嫨鍥炬爣"> </input-icon> </el-form-item> </el-col> <el-col :span="24"> - <el-form-item label="鎻忚堪锛�" prop="description"> - <el-input v-model="form.description" :rows="2" type="textarea"></el-input> + <el-form-item label="鍗犳嵁鍒楁暟锛�" prop="span" tip="鎬诲垪鏁颁负24"> + <avue-input-number v-model="form.span" precision="0" style="width: 100%" :max="24" :min="2" controls-position="" labelTip="鎬诲垪鏁颁负24锛屽鍗犳弧鏁磋璇疯緭鍏�24"></avue-input-number> + </el-form-item> + </el-col> + <el-col :span="24"> + <el-form-item label="楂樺害鍗犳瘮锛�" prop="height"> + <avue-input-number v-model="form.height" style="width: 100%" :min="0" :max="1" controls-position=""></avue-input-number> </el-form-item> </el-col> </el-row> @@ -74,7 +79,6 @@ </template> <script> -import iconList from "@/config/iconList"; import basicOption from "@/util/basic-option"; import {addSave, deleteStatus, editSave, gridStatus} from "@/api/modeling/statusPool/api"; import func from "@/util/func"; @@ -83,7 +87,6 @@ name: "homeConfig", data() { return { - iconList: iconList, loading: false, data: [], option: { @@ -94,6 +97,10 @@ calcHeight: -60, column: [ { + label: '鎺掑簭', + prop: 'orderNum', + }, + { label: '缁勪欢', prop: 'id', }, @@ -102,25 +109,27 @@ prop: 'title', }, { + label: '鍥炬爣', + prop: 'icon', + }, + { label: '鍗犳嵁鍒楁暟', prop: 'span' }, { - label: '鏍囩', - prop: 'name', - sortable: true, - }, - { - label: '鎻忚堪', - prop: 'description', + label: '楂樺害鍗犳瘮', + prop: 'height', }, ] }, dialogTitle: '', form: { + orderNum:1, id: "", - name: "", - description: "" + title: "", + span:24, + icon: "", + height:1 }, rules: { id: [ @@ -128,14 +137,20 @@ ], span:[ {required: true, message: '璇疯緭鍏ュ崰鎹垪鏁�', trigger: 'blur'}, + ], + height:[ + {required: true, message: '璇疯緭鍏ラ珮搴﹀崰姣�', trigger: 'blur'}, ] }, dic:[{ label:'寰呭姙娴佺▼浠诲姟', value:'UndoTaskPortlet' },{ - label:'閫夐」2', - value:1 + label:'寰呭姙浜嬮」', + value:'taskPortlet' + },{ + label:'test', + value:'test' }], visible: false, selectList: [], @@ -182,6 +197,7 @@ // 鍒涘缓鎸夐挳 addClickHandler() { this.visible = true; + this.form.orderNum=this.data.length; this.dialogTitle = 'add'; }, @@ -244,10 +260,12 @@ // 鍏抽棴瀵硅瘽妗� visibleCloseHandler() { const form = { + orderNum:1, id: "", - name: "", - imagePath: "", - description: "" + title: "", + span:24, + icon: "", + height:1 } this.form = form; this.visible = false; -- Gitblit v1.9.3