From 95fda13c28cb664a57336dd2e01d5b41ec4f717f Mon Sep 17 00:00:00 2001
From: 王震 <10952869+daywangzhen@user.noreply.gitee.com>
Date: 星期五, 25 八月 2023 12:57:19 +0800
Subject: [PATCH] 查看详情页
---
src/views/standardLibrary/index.vue | 343 +++++++++++++++++++++++---------------------------------
1 files changed, 140 insertions(+), 203 deletions(-)
diff --git a/src/views/standardLibrary/index.vue b/src/views/standardLibrary/index.vue
index 274125d..6070828 100644
--- a/src/views/standardLibrary/index.vue
+++ b/src/views/standardLibrary/index.vue
@@ -2,7 +2,10 @@
<div class="standard-library-main">
<div class="content-main">
<div class="library-bom" style="width: 300px">
- <el-input v-model="filterText" placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" />
+ <el-input
+ v-model="filterText"
+ placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�"
+ ></el-input>
<el-button type="text">鍏ㄩ儴</el-button>
<el-tree
ref="tree"
@@ -20,37 +23,8 @@
</div>
<div class="library-table" style="width: 80%">
<div class="table-header">
- <div class="search-bar">
- <el-form ref="form" :inline="true" :model="searchData">
- <el-form-item>
- <span>鍘熸潗鏂欑紪鐮侊細</span>
- <el-input
- v-model="searchData.keyword"
- placeholder="璇疯緭鍏ヤ汉鍛樺悕绉�/鍘熸潗鏂欏悕绉�"
- >
- <i slot="prefix" class="el-input__icon el-icon-search" />
- </el-input>
- </el-form-item>
- <el-form-item>
- <span>鍘熸潗鏂欏悕绉帮細</span>
- <el-input
- v-model="searchData.keyword"
- placeholder="璇疯緭鍏ュ師鏉愭枡鍚嶇О"
- >
- <i slot="prefix" class="el-input__icon el-icon-search" />
- </el-input>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="filteredTableData"
- >鏌ヨ</el-button
- >
- <el-button type="primary" plain @click="resetBtn"
- >閲嶇疆</el-button
- >
- </el-form-item>
- </el-form>
- </div>
<div class="serve-btn">
+ <span class="tipMsg">{{ msg !== "" ? msg : "" }}</span>
<el-button
type="primary"
icon="el-icon-plus"
@@ -60,7 +34,6 @@
<el-button
class="top_div_button"
icon="el-icon-delete-solid"
- size="small"
style="color: #00a5ff"
@click="deleteListClick"
>鍒犻櫎</el-button
@@ -68,42 +41,6 @@
</div>
</div>
<div class="table-box">
- <!-- <el-table
- ref="tableData"
- row-key="id"
- max-height="680"
- :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
- :cell-style="{ textAlign: 'left' }"
- :header-cell-style="{
- border: '0px',
- background: '#f5f7fa',
- color: '#606266',
- boxShadow: 'inset 0 1px 0 #ebeef5',
- textAlign: 'left',
- }"
- :data="tableData"
- style="width: 100%"
- >
- <el-table-column type="index" label="搴忓彿" width="100px">
- <template v-if="scope.row.index + 1" slot-scope="scope">
- {{ scope.row.index + 1 }}
- </template>
- </el-table-column>
- <el-table-column prop="father" label="鍚嶇О" width="320px">
- <template slot-scope="scope">
- <el-tag
- size="mini"
- :type="scope.row.father ? '' : 'success'"
- :style="{ borderRadius: '40%', marginRight: '12px' }"
- >{{ scope.row.father ? "01" : "02" }}</el-tag
- >
- {{ scope.row.father || scope.row.name }}
- </template>
- </el-table-column>
- <el-table-column prop="unit" label="鍗曚綅" width="300px" />
- <el-table-column prop="required" label="鏍囧噯" width="300px" />
- <el-table-column prop="internal" label="鍐呮帶鍒�" width="300px" />
- </el-table> -->
<el-table
:data="tableData"
style="width: 100%; margin-bottom: 20px"
@@ -142,22 +79,30 @@
label="鍗曚綅"
sortable
></el-table-column>
+ <el-table-column label="鏍囧噯鍊�" sortable>
+ <template scope="scope">
+ <el-input
+ v-if="scope.row.edit === true || scope.row.code === '[2]'"
+ @blur="requiredOnfocus(scope)"
+ v-model="scope.row.required"
+ placeholder="璇疯緭鍏ユ爣鍑嗗��"
+ ></el-input>
+ </template>
+ </el-table-column>
+ <el-table-column prop="internal" label="鍐呮帶鍊�" sortable>
+ <template scope="scope">
+ <el-input
+ v-if="scope.row.edit === true || scope.row.code === '[2]'"
+ @blur="requiredOnfocus(scope)"
+ v-model="scope.row.internal"
+ placeholder="璇疯緭鍏ュ唴鎺у��"
+ ></el-input>
+ </template>
+ </el-table-column>
</el-table>
<!-- 寮瑰嚭琛ㄥ崟椤� -->
<div>
<!-- -->
- </div>
- <div>
- <!-- 鍒嗛〉鍣� -->
- <!-- <el-pagination
- :current-page="pageParams.pageNo"
- :page-sizes="[10, 15, 20, 25]"
- :page-size="pageParams.pageSize"
- layout="total, sizes, prev, pager, next, jumper"
- :total="pageParams.total"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- /> -->
</div>
</div>
</div>
@@ -210,11 +155,11 @@
import {
getMaterialList,
getProductList,
- getProductSonList,
addMaterial,
addStandards,
addSpecifications,
deleteListApi,
+ blurUpdateApi,
} from "@/api/standardLibrary";
import { selectproductModelApi } from "@/api/basicData/index";
@@ -222,6 +167,8 @@
data() {
return {
deleteList: [],
+ msg: "",
+ isAllSelect: false,
addTreeFormVisible: false,
filterText: "",
// 鏍囧噯搴揵om鏍�
@@ -232,18 +179,8 @@
label: "name",
value: "id",
},
- // 鏌ヨ鏉′欢
- searchData: {
- keyword: "",
- },
tableData: [],
oldtableData: [],
- // 鍒嗛〉鍙傛暟
- pageParams: {
- pageNo: 1,
- pageSize: 12,
- total: 0,
- },
tablespecifications: [],
// 閫変腑鐨勮妭鐐规暟鎹�
selectData: {},
@@ -264,22 +201,18 @@
methods: {
filterNode(value, data) {
if (!value) return true;
- return data.label.indexOf(value) !== -1;
+ return data.name.indexOf(value) !== -1;
},
// 鑾峰彇bom鏍戠殑鏍囧噯鏁版嵁
async getStandardTree() {
const { data } = await getMaterialList();
- console.log(data);
this.standardTree = data.map((item) => {
let name = null;
switch (item.type) {
- case 1:
+ case 0:
name = "鍘熸潗鏂�";
break;
- case 2:
- name = "鍗婃垚鍝�";
- break;
- case 3:
+ case 1:
name = "鎴愬搧";
break;
}
@@ -289,19 +222,16 @@
name,
};
});
- console.log(this.standardTree);
// formTypeOptions
// 榛樿绗竴涓洓绾ц妭鐐规悳绱紝鏂板閰嶇疆椤�
const treeOptions = JSON.parse(JSON.stringify(this.standardTree));
this.getDefault(treeOptions, 0);
- console.log(treeOptions);
this.formTypeOptions = treeOptions;
this.$nextTick().then(() => {
const firstNode = document.querySelector(
".el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node"
);
firstNode.click();
- // console.log(firstNode)
});
},
getDefault(arr, index) {
@@ -313,80 +243,52 @@
item.children = null;
}
}
- // else {
- // // if ('children' in item) {
- // // //
- // // } else {
- // // // console.log(index, item)
- // // }
- // }
}
},
// 鐐瑰嚮bom鏍戣妭鐐规柟娉�
async nodeClick(data, node, element) {
- // console.log('data', data)
- // console.log('children' in data)
// 鏄瓙鑺傜偣
if (node.level === 4) {
- console.log(data, node);
+ this.getParentData(node.parent, node.data.name);
// 瀛樹笅閫変腑鑺傜偣
this.selectData = data;
- // eslint-disable-next-line prefer-const
this.getTableByClick(data);
}
if (!("children" in data)) {
return;
}
},
- async getTableByClick(data) {
- // eslint-disable-next-line prefer-const
- let {
- data: { row, total },
- } = await getProductList({
- pageNo: this.pageParams.pageNo,
- pageSize: this.pageParams.pageSize,
- specificationsId: data.id,
- });
- // console.log(row)
- this.pageParams.total = total;
- row = row.map((item, index) => ({ ...item, index }));
- for (const item of row) {
- if (item.children) {
- const res = await getProductSonList({ fatherName: item.father });
- item.children = res.data;
- item.id = item.father;
+ // 鑾峰彇鏍戣矾寰�
+ getParentData(node, name) {
+ if (node !== null) {
+ if (node.data.name !== undefined) {
+ this.msg = node.data.name + " > " + name;
}
+ this.getParentData(node.parent, this.msg);
}
- this.tableData = row;
+ },
+ async getTableByClick(data) {
+ await getProductList({
+ specificationsId: data.id,
+ }).then((res) => {
+ res.data.forEach((i) => {
+ if (i.name === undefined) {
+ i.name = i.children[0].name;
+ i.unit = i.children[0].unit;
+ i.id = i.children[0].id;
+ i.required = i.children[0].required;
+ i.internal = i.children[0].internal;
+ i.edit = true;
+ delete i.children;
+ }
+ });
+ this.tableData = res.data;
+ this.selectDataList();
+ });
},
specificationDetails(row) {
// 璺宠浆浜у搧瑙勬牸璇︽儏椤�
this.$router.push(`/standardLibrary/SpecificationDetails/${row.id}`);
- },
- handleSizeChange(val) {
- console.log(`姣忛〉 ${val} 鏉);
- this.pageParams.pageSize = val;
- this.getTableByClick(this.selectData);
- },
- handleCurrentChange(val) {
- console.log(`褰撳墠椤�: ${val}`);
- this.pageParams.pageNo = val;
- this.getTableByClick(this.selectData);
- },
- // 鏌ヨ鎸夐挳
- filteredTableData() {
- this.oldtableData = this.tableData;
- // 鏍规嵁杈撳叆鐨勫叧閿瓧寰楀埌杩囨护鍚庣殑鏁版嵁锛屽鏋滄湁灏辨妸杩囨护鍚庣殑鏁版嵁灞曠ず鍦ㄩ〉闈笂
- const filteredtabledata = this.tableData.filter((item) => {
- return item.name.includes(this.searchData.keyword);
- });
- // console.log('filteredtabledata', filteredtabledata)
- this.tableData = filteredtabledata;
- },
- // 閲嶇疆鎸夐挳
- resetBtn() {
- this.searchData.keyword = "";
- this.tableData = this.oldtableData;
},
renderContent(h, { node, data, store }) {
// console.log('data', data)
@@ -414,7 +316,6 @@
},
async subAddTreeForm() {
this.addTreeFormVisible = false;
- console.log(this.addTreeForm.addTypeArr.length);
let res = null;
try {
switch (this.addTreeForm.addTypeArr.length) {
@@ -446,12 +347,13 @@
console.log(res);
this.$message.success("娣诲姞鎴愬姛");
- this.addTreeForm = {};
+ this.addTreeForm = {
+ addTypeArr: [],
+ };
this.getStandardTree();
this.getTableByClick(this.selectData);
},
changeCascader(data) {
- console.log(data);
this.addTreeForm.addTypeArr = data;
},
closeAddTreeForm() {
@@ -501,20 +403,17 @@
// 鑷畾涔�
if (this.isAllSelect) {
val.forEach((i) => {
- let isExist = false;
- this.deleteList.findIndex((c) => {
- if (c === i.id) {
- isExist = true;
- }
- });
- if (!isExist && i.id !== undefined) {
+ if (i.id !== undefined) {
this.deleteList.push(i.id);
+ } else {
+ i.children.forEach((c) => {
+ this.deleteList.push(c.id);
+ });
}
});
} else {
this.deleteList.splice(0, this.deleteList.length);
}
- // 鑷畾涔夌粨鏉�
},
//閫夋嫨鏌愯
selectTr(selection, row) {
@@ -523,9 +422,26 @@
this.isAllSelect = row.isChecked;
this.toggleSelect(row, row.isChecked, "tr");
});
+
if (row.isChecked === true) {
- this.deleteList.push(row.id);
+ if (row.children !== undefined) {
+ row.children.forEach((i) => {
+ this.deleteList.push(i.id);
+ });
+ } else {
+ this.deleteList.push(row.id);
+ }
} else if (row.isChecked === false) {
+ if (row.children !== undefined) {
+ row.children.forEach((i) => {
+ this.deleteList.findIndex((c, index) => {
+ if (c === i.id) {
+ this.deleteList.splice(index, 1);
+ return;
+ }
+ });
+ });
+ }
this.deleteList.findIndex((c, index) => {
if (c === row.id) {
this.deleteList.splice(index, 1);
@@ -533,7 +449,6 @@
}
});
}
- console.log(`output->this.deleteList`, this.deleteList);
},
//閫掑綊瀛愮骇
toggleSelect(data, flag, type) {
@@ -574,6 +489,22 @@
message: res.message,
type: "success",
});
+ this.getTableByClick(this.selectData);
+ });
+ },
+ async requiredOnfocus(scope) {
+ let obj = {
+ id: scope.row.id,
+ required: scope.row.required,
+ internal: scope.row.internal,
+ };
+
+ await blurUpdateApi(obj).then((res) => {
+ this.$message({
+ message: res.message,
+ type: "success",
+ });
+ this.getTableByClick(this.selectData);
});
},
},
@@ -587,13 +518,6 @@
padding-left: 23px !important;
}
}
-// .dialogform {
-// transform: translate(-50%, -50%);
-// top: 50% !important;
-// left: 50% !important;
-// width: 1000px;
-// height: 800px;
-// }
.standard-library-main {
width: 100vh;
height: 100%;
@@ -611,6 +535,7 @@
.library-bom {
// padding-right: 10px;
width: 300px;
+ overflow-y: auto;
// height: 100%;
max-height: 100%;
// margin-right: 12px;
@@ -640,28 +565,6 @@
}
}
}
- // .el-tree {
- // margin-top: 12px;
- // ::v-deep .el-tree-node__content{
- // height: 24px !important;
- // font-size: 14px;
- // display: inline-block !important;
- // padding: 2px;
- // color: #333;
- // }
- // ::v-deep .el-tree-node__content:hover{
- // background: rgba(58,124,253,0.1) ;
- // // opacity: 0.31;
- // border-radius: 3px;
- // color: #333 !important;
- // }
- // ::v-deep .el-tree-node:focus>.el-tree-node__content{
- // background: rgba(58,124,253,0.1) ;
- // // opacity: 0.31;
- // border-radius: 3px;
- // color: #333 !important;
- // }
- // }
}
.library-table {
// height: 100%;
@@ -675,6 +578,7 @@
.table-header {
display: flex;
justify-content: space-between;
+ width: 100%;
.el-form-item {
margin-bottom: 30px !important;
}
@@ -686,12 +590,6 @@
display: flex;
flex-direction: column;
justify-content: space-between;
-
- .el-table {
- // flex: 1;
- // max-height: 680px;
- // overflow-y: scroll;
- }
> div:nth-child(3) {
// height: 20px;
display: flex;
@@ -710,4 +608,43 @@
}
}
}
+.search-bar {
+ .el-input {
+ position: relative;
+ font-size: 0.07292rem;
+ display: inline-block;
+ width: 70%;
+ }
+}
+.firstDiv {
+ float: left;
+ width: 20px;
+ height: 20px;
+ border-radius: 50%;
+ background-color: #eff5ff;
+ margin-top: 5px;
+ justify-content: center;
+ display: flex;
+ align-items: center;
+ margin-right: 8px;
+}
+.el-tag.el-tag {
+ border-color: transparent;
+ background-color: transparent;
+}
+.el-tag.el-tag:hover {
+ border-color: transparent;
+ background-color: transparent;
+}
+.serve-btn {
+ width: 100%;
+ padding-bottom: 6px;
+ text-align: right;
+}
+.tipMsg {
+ float: left;
+ font-size: 16px;
+ font-weight: 500;
+ color: #999999;
+}
</style>
--
Gitblit v1.9.3