From 3a3997f3510be2125fc6f91d29c6271402d09c99 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BE=99=E8=BF=90=E6=A8=A1?= <1724894114@qq.com>
Date: Thu, 19 Sep 2024 23:23:06 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=BF=AB=E6=8D=B7=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E5=85=A5=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/favicon.ico                            | Bin 2097 -> 1119 bytes
 src/api/model/home.js                         |  19 +++
 src/assets/icons/index.js                     |   3 +
 src/style/home.scss                           | 106 ++++++------
 .../home/console/components/shortcuts.vue     | 159 ++++++++++++++++++
 src/views/home/console/index.vue              |  37 ++--
 src/views/setting/company/see.vue             |  16 +-
 7 files changed, 260 insertions(+), 80 deletions(-)
 create mode 100644 src/api/model/home.js
 create mode 100644 src/views/home/console/components/shortcuts.vue

diff --git a/public/favicon.ico b/public/favicon.ico
index cf48032424818f67969eeb342c32e65ca96f0fac..1fe714d63a2ee2c45c659038d1263d5059ac286e 100644
GIT binary patch
delta 1084
zcmV-C1jGBW5Z?$PiBL{Q4GJ0x0000DNk~Le0000W0000W2nGNE0CReJ^pPPne*^SM
zL_t(|0nJxmOjB1F|6MJAR$A<6sT0SzoyHkpSe(-(OV*kt!)-2OV|&>iSoUVNWolv!
z@uB+QgC+)uJ{nOUOpGz9M#aQG(3ogqB-UVw5JN9$sUp&Xts)4=@0{D>E!NO#DgKi0
z-h0ly=lp)(ch2|SdnKd@#+Zptf3;)|GCP?}W{TYolPP3gG7p(slB6&)0V0;k8p%Q|
zJ+$z#cw2CfW5n-@##r>y_S(-f2R}<S8uXx@WtLnk!k%r<lZlYEoRWr|uhUJayL&F7
zkX6UCWP#>}D+}a^ak%0Q5rJ4({KzhB6a^(70T;55&Em+^e19X_d;u1Ue~z&^055DN
z9n|ugfL$j#rmuI>^}ib`U@_*y(-p+3vLdv1J;1l0m*A+U2iJDjV%g$C3`d@$Zr_Dj
z-R5)Et+Vk<QQElxhxUQU*n}Xp%SGrPio#Toiz|16sFp2QxzvOky+cqQjiP%%51X|R
zwqm0gH~Ms(+J;%^B`hbge;PQrfP~`U?RzZFa&aNTG^t6Sk53mH$a6Cqj$Oyt#H6@?
zrlTMEISUaOj-u3JfNVA5&?YC+gq;hJwLK5R&uC&D2^m5-Iu2zpf?z0u-oYpMdgVtb
zH5cIc)n0s8^)c30E)nGK0GSI&cv1N7h49r1t154e8BOOpv38jifBod?rOp7hZmhy*
zC5tHBMtBu9T0OxqYIe7#LWq`44mc}H;!Uv$6L2>;imTlZFflnbO>m|AA)Mt)P(xlf
z{A$O4-&bId+lzI}RiV~GJzT$kf#$QFV$A<PRKjkvBo)AyN(+gngEk85cb&obi%FXF
z1JtgSak#w)TYjv>fBse<E>Z+I_-4El2$QH1wC&s|`uI|<-hL8`3Uc5-@CQ;vm=_{N
z+tYPFgk0T1O0@yFuPbQx4WP{z#EU704fayu!M2~O#Irl<s;9^8J?%v(`W&v`)+92}
zKFa&^Ak2RsNhUy4!dvmy2<`g8k!O^O<CKPGd{~f2ga-Wle`OhNQE1P5?_o8iV<Ux{
zL$^SEm-P)raO#F4p8d<YB7uRYahcgD>O_ca2E2R^w3F5ImVa<m^y+hSgz_m1Qzy~q
zLZ7EYJx$KjvFY51=#TN^K<jM`3_ryulo5OhXX4S5F>yZK(T93Rf<O-!;3jM2JQ5WO
z?tz2W)<a9Mf3(OT)|rcG_@x^E)Rc=+G8Lc8w*&a5T;0tTrA4oKu7zBzrmBNB@(j4e
zkv3uz%RX8-_xtfW<`;BoM)uGg<DCCbvIMYs_$W;#V*WnM=P(j}mhNvFQ$N)*k)C{x
z^nT5fMB^|^51|;bJlp&dQUrVTd+sD#g$(_kzXWfI5^*&MwjsIz0000<MNUMnLSTX{
CTnl&r

delta 2069
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

diff --git a/src/api/model/home.js b/src/api/model/home.js
new file mode 100644
index 0000000..453e591
--- /dev/null
+++ b/src/api/model/home.js
@@ -0,0 +1,19 @@
+import config from "@/config";
+import http from "@/utils/request";
+
+export default {
+	quickList: {
+		url: `${config.API_URL}/user.quick.function`,
+		name: "用户快捷功能列表",
+		post: async function (params) {
+			return await http.post(this.url, params);
+		},
+	},
+	quickSave: {
+		url: `${config.API_URL}/user.quick.function.save`,
+		name: "用户快捷功能列表",
+		post: async function (params) {
+			return await http.post(this.url, params);
+		},
+	},
+};
diff --git a/src/assets/icons/index.js b/src/assets/icons/index.js
index c5b3577..fc286eb 100644
--- a/src/assets/icons/index.js
+++ b/src/assets/icons/index.js
@@ -111,6 +111,9 @@ export { default as FinanceMag } from './menu/Finance.vue'
 export { default as Reports } from './menu/ReportForms.vue'
 export { default as ShipmentMag } from './menu/Shipment.vue'
 export { default as Inventory } from './menu/Stock.vue'
+// 二层菜单
+export { default as AccountInfo } from './menu/UserInfo.vue'
+export { default as OrderList } from './menu/WorkOrder.vue'
 
 export { default as Gather } from './home/gather.vue'
 export { default as HomeChart } from './home/chart.vue'
diff --git a/src/style/home.scss b/src/style/home.scss
index ce9f4d2..492d17e 100644
--- a/src/style/home.scss
+++ b/src/style/home.scss
@@ -16,59 +16,68 @@
 		flex: 1;
 		display: flex;
 		overflow: hidden;
-		.boxScrollbar{
+	}
+}
+
+.inletView{
+	display: flex;
+	align-items: flex-start;
+	flex-wrap: wrap;
+	.leftBox{
+		display: flex;
+		align-items: center;
+		flex-wrap: wrap;
+	}
+	.item{
+		display: flex;
+		align-items: center;
+		flex-direction: column;
+		margin:0 18px 0 0;
+		padding-bottom: 20px;
+		width: 50px;
+		.img{
+			width: 50px;height: 50px;background: var(--el-color-primary);border-radius: 8px;
+			display: flex;align-items: center;justify-content: center;
+			cursor: pointer;
+		}
+		.text{
+			margin-top: 8px;
+			width: 100%;
+			white-space: nowrap;
+			text-overflow: ellipsis;
+			overflow: hidden;
+		}
+	}
+	.add{
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		margin:0;
+		padding-bottom: 20px;
+		.addBack{
+			background: #f2f2f2;
+			border-radius: 8px;
+			width: 50px;
+			height: 50px;
 			display: flex;
 			align-items: center;
+			justify-content: center;
+			cursor: pointer;
+		}
+		.icon{
+			width: 30px;
+			height: 30px;
+			color: #888;
+		}
+		.text{
+			width: 50px;
+			text-align: center;
 		}
 	}
 }
 
 .headerBox{
 	.cardBox{
-		.inletView{
-			display: flex;
-			align-items: center;
-			.leftBox{
-				display: flex;
-				align-items: center;
-			}
-			.item{
-				display: flex;
-				align-items: center;
-				flex-direction: column;
-				margin-right: 30px;
-				.img{
-					width: 50px;
-				}
-				.text{
-					margin-top: 8px;
-				}
-			}
-			.add{
-				display: flex;
-				justify-content: center;
-				align-items: center;
-				margin: 0;
-				.addBack{
-					background: #f2f2f2;
-					border-radius: 8px;
-					width: 50px;
-					height: 50px;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-				}
-				.icon{
-					width: 30px;
-					height: 30px;
-					color: #888;
-				}
-				.text{
-					width: 50px;
-					text-align: center;
-				}
-			}
-		}
 		.newBell{
 			display: flex;
 			flex-wrap: wrap;
@@ -161,13 +170,6 @@
 	}
 }
 
-.boxScrollbar{
-	.el-scrollbar__wrap{
-		display: flex;
-		align-items: center;
-	}
-}
-
 
 @media (max-width: 992px){
 	.consoleView{
diff --git a/src/views/home/console/components/shortcuts.vue b/src/views/home/console/components/shortcuts.vue
new file mode 100644
index 0000000..e933870
--- /dev/null
+++ b/src/views/home/console/components/shortcuts.vue
@@ -0,0 +1,159 @@
+<template>
+	<view class="pointBox inletView">
+		<el-scrollbar height="100%" class="boxScrollbar">
+			<div class="leftBox">
+				<div class="item" v-for="(item,index) in inletList" :key="index">
+					<div class="img">
+						<el-icon size="26" color="#fff" class="icon" v-if="item.meta && item.meta.icon"><component :is="item.meta.icon || 'el-icon-menu'" /></el-icon>
+					</div>
+					<text class="text">{{item.meta && item.meta.title}}</text>
+				</div>
+				<div class="item add" @click="inletVisible=true">
+					<div class="addBack">
+						<i class="icon"><sc-icon-HomeAdd /></i>
+					</div>
+					<text class="text">添加</text>
+				</div>
+			</div>
+		</el-scrollbar>
+	</view>
+
+	<el-drawer v-model="inletVisible" :size="450" title="快捷功能管理" destroy-on-close>
+		<el-container>
+			<el-main>
+				<div class="dragList">
+					<div class="title">已选快捷功能</div>
+					<draggable class="dragView" v-model="inletList" animation="200" item-key="id" group="people">
+						<template #item="{ element }">
+							<div class="box">
+								<div class="img">
+									<el-icon size="26" color="#fff" class="icon" v-if="element.meta && element.meta.icon"><component :is="element.meta.icon || 'el-icon-menu'" /></el-icon>
+								</div>
+								<div class="text">{{element.meta && element.meta.title}}</div>
+							</div>
+						</template>
+					</draggable>
+					<el-empty v-if="inletList.length==0" :image-size="80" description="未添加任何快捷功能"></el-empty>
+				</div>
+				<div class="dragList">
+					<div class="title">常用功能拖拽到上方快捷功能中</div>
+					<draggable class="dragView" v-model="list" animation="200" item-key="id" group="people">
+						<template #item="{ element }">
+							<div class="box">
+								<div class="img imgDis">
+									<el-icon size="26" color="#fff" class="icon" v-if="element.meta && element.meta.icon"><component :is="element.meta.icon || 'el-icon-menu'" /></el-icon>
+								</div>
+								<div class="text">{{element.meta && element.meta.title}}</div>
+							</div>
+						</template>
+					</draggable>
+					<el-empty v-if="list.length==0" :image-size="80" description="暂无数据"></el-empty>
+				</div>
+			</el-main>
+			<el-footer style="padding:10px;">
+				<el-button type="primary" @click="save" :loading="isSave">保存配置</el-button>
+			</el-footer>
+		</el-container>
+	</el-drawer>
+</template>
+
+<script>
+import draggable from 'vuedraggable'
+export default {
+	name: "shortcuts",
+	components:{
+		draggable
+	},
+	data(){
+		return{
+			isSave:false,
+			listData:[],
+			inletList:[],
+			inletVisible:false,
+			list:[]
+		}
+	},
+	watch:{
+
+	},
+	mounted() {
+		this.getList()
+	},
+	methods:{
+		async getList() {
+			const res = await this.$API.home.quickList.post();
+			if(res.code == 200){
+				let isCheArr = [];
+				let noList = [];
+				res.data.forEach(item=>{
+					if(item.checked){
+						isCheArr.push(item);
+					}else{
+						noList.push(item);
+					}
+				})
+				this.listData = res.data;
+				this.inletList = isCheArr;
+				this.list = noList;
+			}
+		},
+		async save() {
+			if(this.inletList && this.inletList.length>0){
+				this.inletList.forEach(item=>{
+					item.checked = true;
+				})
+			}
+			if(this.list && this.list.length>0){
+				this.list.forEach(item=>{
+					item.checked = false
+				})
+			}
+			let newArr = [...this.inletList,...this.list];
+			this.isSave = true;
+			const params = newArr.map((item,index)=>({name:item.name,status:item.checked,sort:index+1}))
+			const res = await this.$API.home.quickSave.post(params);
+			this.isSave = false;
+			if (res.code == 200) {
+				this.$message.success('保存成功');
+				await this.getList();
+			}
+		}
+	}
+}
+</script>
+
+<style scoped lang="scss">
+	.pointBox{width: 100%;height: 100%;overflow: hidden;display: flex;align-items: center;justify-content: flex-start;}
+	.icon{color: #fff;}
+
+	.dragList{
+		.title{
+			border-top: 1px solid #f2f2f2;
+			padding-top: 10px;
+		}
+	}
+	.dragView{
+		min-height: 40px;
+		display: flex;flex-wrap: wrap;
+		.box{
+			display: flex;
+			align-items: center;
+			flex-direction: column;
+			margin:0 20px 0 0;
+			padding:10px 0 10px 0;
+			width: 50px;
+			.img{
+				width: 50px;height: 50px;background: var(--el-color-primary);border-radius: 8px;
+				display: flex;align-items: center;justify-content: center;
+				cursor: pointer;
+			}
+			.imgDis{
+				background: var(--el-color-primary-light-8);
+			}
+			.text{
+				margin-top: 8px;
+				width: 100%;white-space: nowrap;overflow: hidden;text-overflow:ellipsis;
+			}
+		}
+	}
+</style>
diff --git a/src/views/home/console/index.vue b/src/views/home/console/index.vue
index 33ded0c..e1cbfe7 100644
--- a/src/views/home/console/index.vue
+++ b/src/views/home/console/index.vue
@@ -5,22 +5,9 @@
 				<el-row class="colRow" :gutter="20">
 					<el-col class="leftCol" :span="10" :md="10" :sm="24" :xs="24">
 						<div class="cardBox">
-							<div class="cardTitle">快捷功能入口</div>
-							<div class="cardBody inletView">
-								<el-scrollbar class="boxScrollbar">
-									<div class="leftBox">
-										<div class="item" v-for="(item,index) in inletList" :key="index">
-											<el-image class="img" :src="item.url"></el-image>
-											<text class="text">{{item.name}}</text>
-										</div>
-									</div>
-								</el-scrollbar>
-								<div class="item add">
-									<div class="addBack">
-										<i class="icon"><sc-icon-HomeAdd /></i>
-									</div>
-									<text class="text">添加</text>
-								</div>
+							<div class="cardTitle">占位</div>
+							<div class="cardBody">
+
 							</div>
 						</div>
 					</el-col>
@@ -103,9 +90,9 @@
 					</el-col>
 					<el-col class="rightCol" :span="8" :md="8" :sm="24" :xs="24">
 						<div class="cardBox chartView">
-							<div class="cardTitle">占位</div>
+							<div class="cardTitle">快捷功能入口</div>
 							<div class="cardBody">
-								<pointBox />
+								<shortcuts />
 							</div>
 						</div>
 					</el-col>
@@ -120,23 +107,20 @@ import progressBox from "./components/progress";
 import barBox from "./components/bar";
 import ringBox from "./components/ring";
 import pointBox from "./components/point";
+import shortcuts from "./components/shortcuts";
+
 export default {
 	name: "index",
 	components:{
 		progressBox,
 		barBox,
 		ringBox,
-		pointBox
+		pointBox,
+		shortcuts
 	},
 	data(){
 		return{
-			inletList:[
-				{name:'日报',url:'https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/home1.png'},
-				{name:'销售订单',url:'https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/home2.png'},
-				{name:'库存列表',url:'https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/home3.png'},
-				{name:'统计',url:'https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/home4.png'},
-				{name:'维修订单',url:'https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/home4.png'},
-			],
+
 			briefing:[
 				{num:189376,name:'数据采集条数',icon:'sc-icon-Gather'},
 				{num:12496,name:'维保待维修',icon:'sc-icon-HomeSetup'},
@@ -185,6 +169,7 @@ export default {
 		}
 		.footerBox{
 			flex: 5;
+			overflow: hidden;
 			padding-top: 5px;
 		}
 		.colRow{
diff --git a/src/views/setting/company/see.vue b/src/views/setting/company/see.vue
index 4cca31b..d136e40 100644
--- a/src/views/setting/company/see.vue
+++ b/src/views/setting/company/see.vue
@@ -20,10 +20,22 @@
 				<span>{{form.owner}} {{form.mobile}}</span>
 			</el-form-item>
 			<el-form-item label="公司LOGO" prop="logo">
-				<el-image style="height: 80px;width: 80px;border-radius: 2px;" fit="cover" :src="form.logo"></el-image>
+				<el-image style="height: 80px;width: 80px;border-radius: 2px;" fit="cover" :src="form.logo">
+					<template #error>
+						<div class="image-slot" style="text-align: center;font-size: 60px;">
+							<el-icon><el-icon-Picture /></el-icon>
+						</div>
+					</template>
+				</el-image>
 			</el-form-item>
 			<el-form-item label="证件照" prop="doc_attach">
-				<el-image v-for="item in form.doc_attach" :key="item" style="height: 80px;width: 80px;border-radius: 2px;margin: 0 5px 5px 0" fit="cover" :src="item.doc_url"></el-image>
+				<el-image v-for="item in form.doc_attach" :key="item" style="height: 80px;width: 80px;border-radius: 2px;margin: 0 5px 5px 0" fit="cover" :src="item.doc_url">
+					<template #error>
+						<div class="image-slot" style="text-align: center;font-size: 60px;">
+							<el-icon><el-icon-Picture /></el-icon>
+						</div>
+					</template>
+				</el-image>
 			</el-form-item>
 		</el-form>
 		<template #footer>