From 6a983f2c1de101450fdf543c2fb9acd7037eabf0 Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期四, 23 五月 2024 18:22:14 +0800
Subject: [PATCH] 1

---
 src/views/console/product-process/process-route.vue |  175 ++++++++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 150 insertions(+), 25 deletions(-)

diff --git a/src/views/console/product-process/process-route.vue b/src/views/console/product-process/process-route.vue
index 0549bd5..316715c 100644
--- a/src/views/console/product-process/process-route.vue
+++ b/src/views/console/product-process/process-route.vue
@@ -1,40 +1,59 @@
 <template>
 	<div class="processPage">
 		<div class="roleContainer">
-			<div>+鏂板缓宸ヨ壓璺嚎</div>
+			<div class="addRoute">+鏂板缓宸ヨ壓璺嚎</div>
 			<el-input v-model="keyword" size="small" prefix-icon="el-icon-search" placeholder="璇疯緭鍏ュ悕绉�" clearable @keyup.enter="searchBtn"></el-input>
 			<ul class="left-ul">
 				<li v-for="(item,index) in leftData" :class="{active: item.active}" @click="changeTabaleLi(index)">
-					<span>銆恵{item.code}}銆憑{item.name}}</span>
+					<div>{{item.name}}</div>
+					<div>鍏宠仈浜у搧銆恵{item.productCode}}銆憑{item.productName}}</div>
+					<div>{{item.description}}</div>
+					<el-dropdown class="fix-btn">
+						<span class="el-dropdown-link">...</span>
+						<template #dropdown>
+						<el-dropdown-menu>
+							<el-dropdown-item @click="table_edit(item, index)">缂栬緫</el-dropdown-item>
+							<el-dropdown-item>鍒犻櫎</el-dropdown-item>
+						</el-dropdown-menu>
+						</template>
+					</el-dropdown>
 				</li>
 			</ul>
 		</div>
 		<div class="process-main-tabs">
 			<div class="process-main-header">
-				<div class="main-header-label">宸ヨ壓璺嚎</div>
+				<div class="main-header-label">宸ヨ壓璺嚎<span>{{leftData[0].name}}</span></div>
 				<div style="padding: 20px;border-bottom: 1px solid #dee;">
 					<div class="main-info">
-						<div class="main-info-title">宸ヨ壓璺嚎鐗堟湰</div>
+						<div class="info-top-title">宸ヨ壓璺嚎鐗堟湰</div>
 						<div class="main-info-tooltip">
-							<div class="main-info-item"><span style="background-color: yellow"></span><span>鏈畾鐗�</span></div>
+							<div class="main-info-item"><span style="background-color: #f8ab00"></span><span>鏈畾鐗�</span></div>
 							<div class="main-info-item"><span style="background-color: #b7c9f3"></span><span>宸插畾鐗�</span></div>
 						</div>
 					</div>
 					<div>
-						<el-button type="primary" @click="addVis" disabled>娣诲姞鏂扮増鏈�</el-button>
+						<div class="btn-box vistion-button">
+							<span class="vistion-button-round"></span>
+							<span class="vistion-button-name">V001</span>
+							<el-icon class="vistion-button-icon"><DocumentCopy /></el-icon>
+							<el-icon class="vistion-button-icon"><Delete /></el-icon>
+						</div>
+						<div class="btn-box most-vision">鏇村鐗堟湰...</div>
+						<el-button>+ 娣诲姞鏂扮増鏈�</el-button>
 					</div>
 				</div>
 			</div>
-			<div>鍏宠仈浜х嚎<span>-</span></div>
+			<div class="correlation-product-line">鍏宠仈浜х嚎<span>鍗冩枃绉戞妧</span></div>
 			<div class="process-main-content">
 				<div class="main-content-left">
-					<div class="main-info-title">宸ヨ壓璺嚎</div>
-					<div>
+					<div class="info-top-title">宸ヨ壓璺嚎</div>
+					<div style="margin-bottom: 12px;">
 	            		<el-button type="primary">鏂板</el-button>
 	            		<el-button type="primary">瀹氱増</el-button>
 	            		<el-button disabled>骞跺簭</el-button>
 					</div>
-					<el-table ref="multipleTableRef0" :data="tableData" border style="width: 100%" class="multipleTableRef">
+					<el-table ref="multipleTableRef0" :data="tableData" border style="width: 100%" class="multipleTableRef" @selection-change="HandleSelectionChange">
+						<el-table-column type="selection" width="55" />
 						<el-table-column prop="name" label="宸ュ簭椤哄簭"></el-table-column>
 						<el-table-column prop="code" label="宸ュ簭缂栧彿"></el-table-column>
 						<el-table-column prop="typeName" label="宸ュ簭鍚嶇О"></el-table-column>
@@ -76,12 +95,19 @@
 	        </template>
 	    </el-dialog> -->
 	</div>
+	<save-dialog v-if="dialog.save" ref="saveDialog" @success="addRouteSuccess" @closed="dialog.save=false"></save-dialog>
 </template>
 
 <script>
+	import saveDialog from './addRoute'
+	import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+	let icons = []
+	for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+		icons.push(key)
+	}
 	export default {
-		name: 'BOM',
-		components: {},
+		name: 'route',
+		components: {...ElementPlusIconsVue,saveDialog},
 		data() {
 			return {
 				testList: [],
@@ -96,17 +122,34 @@
 				visible: false,
 				leftData: [],
 				dialog: {
-					save: false,
-					permission: false
+					save: false
 				},
 				info: {},
-				tableData: []
+				tableData: [],
+				selection: []
 			}
 		},
 		mounted(){
-			//this.getLeftTree();
+			this.getLeftTree();
 		},
 		methods: {
+			table_edit(row){
+				this.dialog.save = true
+				this.$HTTP.get(`/api/blade-cps/craft-routing/not-band-craft?craftId=${row.id}`).then(res=> {
+					if(res.code == 200) {
+						this.dialog.save = true;
+						this.$nextTick(() => {
+							this.$refs.saveDialog.open('edit').setData(row,res.data);
+						})
+					}
+				})
+			},
+			addRouteSuccess() {
+				this.getLeftTree();
+			},
+			HandleSelectionChange(selection) {
+				this.selection = selection;
+			},
 			routeSubmit() {
 				this.$refs.dialogForm.validate(async (valid) => {
 					if (valid) {
@@ -126,9 +169,6 @@
 				})
 			},
 			searchBtn() {},
-			addVis() {
-				this.visible = true;
-			},
 			changeTabaleLi(index) {
 				this.leftData.forEach(item=> {
 					item.active = false;
@@ -137,7 +177,12 @@
 				this.info = this.leftData[index];
 			},
 			getLeftTree() {
-				this.$HTTP.get("/api/blade-cps/product/tree").then(res=> {
+				var params = [{
+					key: "name_like",value: ""
+				},{
+					key: "0",value: ""
+				}]
+				this.$HTTP.post("/api/blade-cps/craft-routing/list",{params}).then(res=> {
 					if(res.code == 200) {
 						this.leftData = res.data;
 					}
@@ -177,22 +222,42 @@
 }
 .left-ul {
 	margin-top: 12px;
-	padding-left:30px;
-	padding-right:30px;
 }
 .left-ul li {
-	padding: 6px 6px;
+	padding-left:30px;
+	padding-right:30px;
+	padding-top: 8px;
+	padding-bottom: 0px;
 	list-style: none;
 	cursor: pointer;
 	margin-bottom: 6px;
+	border: 1px solid #7ab3ee;
+	width: 100%;
+	position: relative;
+}
+.fix-btn {
+	position: absolute;
+	top: 8px;
+	right: 2px;
+	width: 30px;
+	height: 20px;
+	background-color: #ebeaea;
+	text-align: center;
+}
+.el-dropdown-link {
+	text-align: center;
+    display: inline-block;
+    width: 100%;
 }
 .left-ul .active {
-	background-color: #7ab3ee;
 	display: inline-block;
-	width: 100%;
 }
 .left-ul li:hover {
 	background-color: #eff4f9;
+}
+.left-ul li > div {
+	margin-bottom: 12px;
+	font-size: 14px;
 }
 .main-info {
 	display: flex;
@@ -203,13 +268,27 @@
     text-align: left;
     color: #333;
     height: 52px;
+	line-height: 52px;
+	font-weight: bold;
     border-bottom: 1px solid #dee;
     padding: 0 16px;
+}
+.main-header-label span {
+	margin-left: 12px;
 }
 .main-info-title {
 	font-size: 14px;
     padding-left: 8px;
     border-left: 2px solid #7ab3ee;
+}
+.info-top-title {
+	padding-left: 8px;
+    border-left: 4px solid #86bffa;
+    line-height: 18px;
+    margin-bottom: 16px;
+    font-weight: 700;
+    font-size: 16px;
+    color: #333;
 }
 .main-info-tooltip {
 	display: flex;
@@ -257,4 +336,50 @@
 .main-content-right ul li span {
 	margin-left:12px;
 }
+.addRoute {
+	color: #409eff;
+	padding: 12px 6px;
+	font-size: 14px;
+	cursor: pointer;
+}
+.btn-box {
+	display: inline-block;
+	margin-right: 20px;
+}
+.most-vision {
+	border-bottom: 1px solid #86bffa;
+	font-size: 14px;
+	font-weight: 700;
+}
+.vistion-button {
+	border: 1px solid #86bffa;
+    padding: 8px 12px;
+}
+.vistion-button-name {
+	vertical-align: middle;
+}
+.vistion-button-round {
+	width: 10px;
+    height: 10px;
+    border-radius: 50%;
+    margin-right: 4px;
+    display: inline-block;
+    background-color: #f8ab00;
+	vertical-align: middle;
+}
+.vistion-button-icon {
+	margin-left: 8px;
+	font-size: 14px;
+	vertical-align: middle;
+	cursor: pointer;
+}
+.correlation-product-line {
+	padding-top: 12px;
+	padding-bottom: 12px;
+	padding-left: 20px;
+	font-size: 14px;
+}
+.correlation-product-line span {
+	margin-left: 20px;
+}
 </style>

--
Gitblit v1.9.3