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 | 715 ++++++++++++++++++++++++++++++++++++-----------------------
1 files changed, 432 insertions(+), 283 deletions(-)
diff --git a/src/views/standardLibrary/index.vue b/src/views/standardLibrary/index.vue
index a447d44..6070828 100644
--- a/src/views/standardLibrary/index.vue
+++ b/src/views/standardLibrary/index.vue
@@ -1,14 +1,15 @@
<template>
<div class="standard-library-main">
<div class="content-main">
- <div class="library-bom">
+ <div class="library-bom" style="width: 300px">
<el-input
v-model="filterText"
placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�"
- />
+ ></el-input>
<el-button type="text">鍏ㄩ儴</el-button>
<el-tree
ref="tree"
+ style="width: 100%"
class="filter-tree"
:data="standardTree"
:props="defaultProps"
@@ -20,110 +21,125 @@
@node-click="nodeClick"
/>
</div>
- <div class="library-table">
+ <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>
- <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">
- <el-button type="primary" icon="el-icon-plus" @click="addTreeFormVisible = true">鏂板</el-button>
+ <span class="tipMsg">{{ msg !== "" ? msg : "" }}</span>
+ <el-button
+ type="primary"
+ icon="el-icon-plus"
+ @click="addTreeFormVisible = true"
+ >鏂板</el-button
+ >
+ <el-button
+ class="top_div_button"
+ icon="el-icon-delete-solid"
+ style="color: #00a5ff"
+ @click="deleteListClick"
+ >鍒犻櫎</el-button
+ >
</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%"
+ style="width: 100%; margin-bottom: 20px"
+ row-key="name"
+ border
+ height="calc(100vh - 250px)"
+ default-expand-all
+ ref="multipleTable"
+ @select="selectTr"
+ @select-all="selectAll"
+ :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
+ <el-table-column type="selection" label="搴忓彿"> </el-table-column>
<el-table-column
type="index"
+ width="50px"
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 }}
+ ></el-table-column>
+ <el-table-column label="椤圭洰鍚嶇О" sortable>
+ <template scope="scope">
+ <el-tag
+ ><div
+ class="firstDiv"
+ :style="`color: ${
+ scope.row.code == '[1]' ? '#16a7ff' : '#58c173'
+ }`"
+ >
+ {{ scope.row.code == "[1]" ? "01" : "02" }}
+ </div>
+ <span style="color: black">{{ scope.row.name }}</span></el-tag
+ >
</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"
- />
+ 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>
</div>
- <el-dialog class="addTree" title="娣诲姞鎸囨爣" width="28%" :visible.sync="addTreeFormVisible" @close="closeAddTreeForm">
+ <el-dialog
+ class="addTree"
+ title="娣诲姞鎸囨爣"
+ width="28%"
+ :visible.sync="addTreeFormVisible"
+ @close="closeAddTreeForm"
+ >
<el-form v-model="addTreeForm" label-position="top">
<el-form-item label="涓婄骇">
<el-cascader
v-model="addTreeForm.addTypeArr"
:options="formTypeOptions"
- :props="{ ...defaultProps,checkStrictly: true }"
+ :props="{ ...defaultProps, checkStrictly: true }"
clearable
@change="changeCascader"
/>
</el-form-item>
- <el-form-item v-show="addTreeForm.addTypeArr.length<2" label="鐗╂枡鍚嶇О">
+ <el-form-item
+ v-show="addTreeForm.addTypeArr.length < 2"
+ label="鐗╂枡鍚嶇О"
+ >
<el-input v-model="addTreeForm.materialName" />
</el-form-item>
- <el-form-item v-show="addTreeForm.addTypeArr.length<3" label="鎵ц鏍囧噯">
+ <el-form-item
+ v-show="addTreeForm.addTypeArr.length < 3"
+ label="鎵ц鏍囧噯"
+ >
<el-input v-model="addTreeForm.standardName" />
</el-form-item>
- <el-form-item v-show="addTreeForm.addTypeArr.length<4" label="瑙勬牸鍨嬪彿">
+ <el-form-item
+ v-show="addTreeForm.addTypeArr.length < 4"
+ label="瑙勬牸鍨嬪彿"
+ >
<el-input v-model="addTreeForm.specificationsName" />
</el-form-item>
</el-form>
@@ -136,227 +152,216 @@
</template>
<script>
-import { getMaterialList, getProductList, getProductSonList,
- addMaterial, addStandards, addSpecifications
-} from '@/api/standardLibrary'
+import {
+ getMaterialList,
+ getProductList,
+ addMaterial,
+ addStandards,
+ addSpecifications,
+ deleteListApi,
+ blurUpdateApi,
+} from "@/api/standardLibrary";
+
+import { selectproductModelApi } from "@/api/basicData/index";
export default {
data() {
return {
+ deleteList: [],
+ msg: "",
+ isAllSelect: false,
addTreeFormVisible: false,
- filterText: '',
+ filterText: "",
// 鏍囧噯搴揵om鏍�
standardTree: [],
// bom鐨�,榛樿閰嶇疆鍊�
defaultProps: {
- children: 'children',
- label: 'name',
- value: 'id'
+ children: "children",
+ label: "name",
+ value: "id",
},
- // 鏌ヨ鏉′欢
- searchData: {
- keyword: ''
- },
- tableData: [
- ],
+ tableData: [],
oldtableData: [],
- // 鍒嗛〉鍙傛暟
- pageParams: {
- pageNo: 1,
- pageSize: 12,
- total: 0
- },
- tablespecifications: [
- ],
+ tablespecifications: [],
// 閫変腑鐨勮妭鐐规暟鎹�
selectData: {},
formTypeOptions: [],
addTreeForm: {
- addTypeArr: []
- }
- }
+ addTypeArr: [],
+ },
+ };
},
watch: {
filterText(val) {
- this.$refs.tree.filter(val)
- }
+ this.$refs.tree.filter(val);
+ },
},
created() {
- this.getStandardTree()
+ this.getStandardTree();
},
methods: {
filterNode(value, data) {
- if (!value) return true
- return data.label.indexOf(value) !== -1
+ if (!value) return true;
+ return data.name.indexOf(value) !== -1;
},
// 鑾峰彇bom鏍戠殑鏍囧噯鏁版嵁
async getStandardTree() {
- const { data } = await getMaterialList()
- console.log(data)
- this.standardTree = data.map(item => {
- let name = null
+ const { data } = await getMaterialList();
+ this.standardTree = data.map((item) => {
+ let name = null;
switch (item.type) {
+ case 0:
+ name = "鍘熸潗鏂�";
+ break;
case 1:
- name = '鍘熸潗鏂�'
- break
- case 2:
- name = '鍗婃垚鍝�'
- break
- case 3:
- name = '鎴愬搧'
- break
+ name = "鎴愬搧";
+ break;
}
return {
- ...item, id: item.type, name
- }
- })
- console.log(this.standardTree)
+ ...item,
+ id: item.type,
+ name,
+ };
+ });
// formTypeOptions
// 榛樿绗竴涓洓绾ц妭鐐规悳绱紝鏂板閰嶇疆椤�
- const treeOptions = JSON.parse(JSON.stringify(this.standardTree))
- this.getDefault(treeOptions, 0)
- console.log(treeOptions)
- this.formTypeOptions = treeOptions
+ const treeOptions = JSON.parse(JSON.stringify(this.standardTree));
+ this.getDefault(treeOptions, 0);
+ 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)
- })
+ 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();
+ });
},
getDefault(arr, index) {
for (const item of arr) {
if (item.children && item.children?.length > 0) {
- // 鏈夊瓙鑺傜偣
- this.getDefault(item.children, index + 1)
+ // 鏈夊瓙鑺傜偣
+ this.getDefault(item.children, index + 1);
if (index === 2) {
- item.children = null
+ 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)
+ this.selectData = data;
+ this.getTableByClick(data);
}
- if (!('children' in data)) {
- return
+ if (!("children" in data)) {
+ return;
+ }
+ },
+ // 鑾峰彇鏍戣矾寰�
+ getParentData(node, name) {
+ if (node !== null) {
+ if (node.data.name !== undefined) {
+ this.msg = node.data.name + " > " + name;
+ }
+ this.getParentData(node.parent, this.msg);
}
},
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
- }
- }
- this.tableData = row
+ 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
+ this.$router.push(`/standardLibrary/SpecificationDetails/${row.id}`);
},
renderContent(h, { node, data, store }) {
// console.log('data', data)
// console.log('node', node)
// 鍒ゆ柇鏄惁鏄埗鑺傜偣鎴栨枃浠跺す
- const isFolder = ('children') in data
+ const isFolder = "children" in data;
return (
- <span class='tree-node'>
+ <span class="tree-node">
{isFolder ? (
<i
- class={node.expanded ? 'el-icon-folder-opened blue-folder' : 'el-icon-folder blue-folder'}
+ class={
+ node.expanded
+ ? "el-icon-folder-opened blue-folder"
+ : "el-icon-folder blue-folder"
+ }
></i>
) : (
- <i class='el-icon-document blue-folder'></i>
+ <i class="el-icon-document blue-folder"></i>
)}
- <div class='tree-lable'>[{node.level}] {data.name}</div>
+ <div class="tree-lable">
+ [{node.level}] {data.name}
+ </div>
</span>
- )
+ );
},
async subAddTreeForm() {
- this.addTreeFormVisible = false
- console.log(this.addTreeForm.addTypeArr.length)
- let res = null
+ this.addTreeFormVisible = false;
+ let res = null;
try {
switch (this.addTreeForm.addTypeArr.length) {
case 1:
- console.log(this.addTreeForm)
- res = await addMaterial({ ...this.addTreeForm, type: this.addTreeForm.addTypeArr.pop() })
- break
+ console.log(this.addTreeForm);
+ res = await addMaterial({
+ ...this.addTreeForm,
+ type: this.addTreeForm.addTypeArr.pop(),
+ });
+ break;
case 2:
- console.log(this.addTreeForm)
- res = await addStandards({ ...this.addTreeForm, materialId: this.addTreeForm.addTypeArr.pop() })
- break
+ console.log(this.addTreeForm);
+ res = await addStandards({
+ ...this.addTreeForm,
+ materialId: this.addTreeForm.addTypeArr.pop(),
+ });
+ break;
case 3:
- console.log(this.addTreeForm)
- res = await addSpecifications({ ...this.addTreeForm, standardId: this.addTreeForm.addTypeArr.pop() })
- break
+ console.log(this.addTreeForm);
+ res = await addSpecifications({
+ ...this.addTreeForm,
+ standardId: this.addTreeForm.addTypeArr.pop(),
+ });
+ break;
}
} catch (error) {
- this.$message.error('娣诲姞澶辫触')
+ this.$message.error("娣诲姞澶辫触");
}
- console.log(res)
- this.$message.success('娣诲姞鎴愬姛')
- this.addTreeForm = {}
- this.getStandardTree()
- this.getTableByClick(this.selectData)
+ console.log(res);
+ this.$message.success("娣诲姞鎴愬姛");
+ this.addTreeForm = {
+ addTypeArr: [],
+ };
+ this.getStandardTree();
+ this.getTableByClick(this.selectData);
},
changeCascader(data) {
- console.log(data)
- this.addTreeForm.addTypeArr = data
+ this.addTreeForm.addTypeArr = data;
},
closeAddTreeForm() {
this.addTreeForm = {
- addTypeArr: []
- }
- console.log(this.addTreeForm)
- }
+ addTypeArr: [],
+ };
+ console.log(this.addTreeForm);
+ },
/** 琛ㄦ牸鏌愯鐐瑰嚮浜嬩欢 */
// handleRowClick(row, column, event) {
// // 鍒ゆ柇褰撳墠琛屾槸鍚︽湁瀛愰泦锛岃嫢娌℃湁鍒欑粨鏉熷鐞�
@@ -364,138 +369,282 @@
// if (!row.children) return
// this.$refs.tableData.toggleRowExpansion(row)
// }
- }
-}
+ selectProductModelTable() {
+ selectproductModelApi(this.params).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.edit = true;
+ delete i.children;
+ }
+ });
+ this.tableData = res.data;
+ this.selectDataList();
+ });
+ },
+ selectDataList() {
+ this.tableData.forEach((a) => {
+ a.code = "[1]";
+ if (a.children != undefined) {
+ a.children.forEach((b) => {
+ b.code = "[2]";
+ });
+ }
+ });
+ },
+ // 琛ㄦ牸鏍戝叏閮ㄩ�変腑閰嶇疆
+ // 鍏ㄩ��/鍙栨秷閫夋搷浣�
+ selectAll(val) {
+ this.isAllSelect = !this.isAllSelect;
+ let data = this.tableData;
+ this.toggleSelect(data, this.isAllSelect, "all");
+ // 鑷畾涔�
+ if (this.isAllSelect) {
+ val.forEach((i) => {
+ 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) {
+ this.$set(row, "isChecked", !row.isChecked);
+ this.$nextTick(() => {
+ this.isAllSelect = row.isChecked;
+ this.toggleSelect(row, row.isChecked, "tr");
+ });
+
+ if (row.isChecked === true) {
+ 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);
+ return;
+ }
+ });
+ }
+ },
+ //閫掑綊瀛愮骇
+ toggleSelect(data, flag, type) {
+ if (type === "all") {
+ if (data.length > 0) {
+ data.forEach((item) => {
+ this.toggleSelection(item, flag);
+ if (item.children && item.children.length > 0) {
+ this.toggleSelect(item.children, flag, type);
+ }
+ });
+ }
+ } else {
+ if (data.children && data.children.length > 0) {
+ data.children.forEach((item) => {
+ item.isChecked = !item.isChecked;
+ this.$refs.multipleTable.toggleRowSelection(item, flag);
+ this.toggleSelect(item, flag, type);
+ });
+ }
+ }
+ },
+ //鏀瑰彉閫変腑
+ toggleSelection(row, flag) {
+ this.$set(row, "isChecked", flag);
+ this.$nextTick(() => {
+ if (flag) {
+ this.$refs.multipleTable.toggleRowSelection(row, flag);
+ } else {
+ this.$refs.multipleTable.clearSelection();
+ }
+ });
+ },
+ // 琛ㄦ牸鏍戝叏閮ㄩ�変腑閰嶇疆 缁撴潫
+ deleteListClick() {
+ deleteListApi(this.deleteList).then((res) => {
+ this.$message({
+ 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);
+ });
+ },
+ },
+};
</script>
<style lang="scss" scoped>
-
// el-table琛ㄦ牸瀵归綈
::v-deep .el-table__row:not([class*="el-table__row--level-"]) {
- td:nth-child(2){
+ td:nth-child(2) {
padding-left: 23px !important;
}
}
-// .dialogform {
-// transform: translate(-50%, -50%);
-// top: 50% !important;
-// left: 50% !important;
-// width: 1000px;
-// height: 800px;
-// }
-.standard-library-main{
- width: 100%;
+.standard-library-main {
+ width: 100vh;
height: 100%;
-// 椤甸潰涓績鍐呭鍖哄煙
- .content-main{
+ // 椤甸潰涓績鍐呭鍖哄煙
+ .content-main {
display: flex;
height: 100%;
min-height: calc(100vh - 88px);
max-height: calc(100vh - 88px);
padding: 15px;
- >div{
+ > div {
padding: 20px;
background: #fff;
}
- .library-bom{
- flex: 2;
- // width: 20%;
+ .library-bom {
+ // padding-right: 10px;
+ width: 300px;
+ overflow-y: auto;
// height: 100%;
max-height: 100%;
- margin-right: 12px;
- overflow-y: scroll;
+ // margin-right: 12px;
+ // overflow-y: scroll;
.el-tree {
- // margin-top: 12px;
- ::v-deep .el-tree-node__content{
+ // margin-top:
+ width: 100%;
+ ::v-deep .el-tree-node__content {
height: 24px !important;
font-size: 18px;
// display: inline-block !important;
padding: 2px;
// color: #333;
- .tree-node{
+ .tree-node {
display: flex;
align-items: center;
height: 20px;
}
- .tree-lable{
+ .tree-lable {
height: 100%;
line-height: 23px;
font-size: 12px;
padding-left: 8px;
}
- .blue-folder{
- color: rgb(64, 158, 255)
+ .blue-folder {
+ color: rgb(64, 158, 255);
}
}
}
- // .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{
+ .library-table {
// height: 100%;
- flex: 8;
+ width: 170vh;
max-height: 100%;
// flex: 8;
margin-left: 12px;
display: flex;
flex-direction: column;
// overflow-y: scroll;
- .table-header{
+ .table-header {
display: flex;
justify-content: space-between;
- .el-form-item{
+ width: 100%;
+ .el-form-item {
margin-bottom: 30px !important;
}
}
- .table-box{
- flex: 1;
- background: #fff;
- // padding: 20px 20px 10px 20px;
+ .table-box {
+ flex: 1;
+ background: #fff;
+ // padding: 20px 20px 10px 20px;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ > div:nth-child(3) {
+ // height: 20px;
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;
- justify-content: end;
- margin: 10px 0;
- }
+ justify-content: end;
+ margin: 10px 0;
+ }
}
}
}
- .addTree{
- .el-form-item{
+ .addTree {
+ .el-form-item {
margin-bottom: 10px;
}
- .el-cascader{
+ .el-cascader {
width: 100%;
}
}
}
+.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