From 835f3363757f6b5703c9385a6d60feff5681f93c Mon Sep 17 00:00:00 2001 From: QYF-GitLab1 <1940665526@qq.com> Date: 星期三, 24 七月 2024 18:32:31 +0800 Subject: [PATCH] 1 --- src/pages/academicSchools/index.vue | 736 +++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 613 insertions(+), 123 deletions(-) diff --git a/src/pages/academicSchools/index.vue b/src/pages/academicSchools/index.vue index 31f0a9d..613b85e 100644 --- a/src/pages/academicSchools/index.vue +++ b/src/pages/academicSchools/index.vue @@ -62,10 +62,11 @@ <div class="selectActivelyBox" @click="selectActively"> <p v-if="formData.actively.length == 0">璇烽�夋嫨娲诲姩鍦�</p> <el-tag + style="margin-right: 5px" v-for="item in formData.actively" - :key="item.id" + :key="item.index" size="small" - closable + type="info" >{{ item.name }}</el-tag > </div> @@ -131,12 +132,83 @@ </el-col> </el-row> <div style="text-align: right"> - <el-button type="primary" size="mini" @click="searchFun" + <el-button + size="mini" + style="background-color: #244a7b; color: #fff" + @click="searchFun" >鎼滅储</el-button > <el-button size="mini" @click="resetForm">閲嶇疆</el-button> </div> </el-form> + <div class="fromTable"> + <el-table + :data="tableData" + class="lightBo" + style="width: 100%" + empty-text="鏆傛棤鎼滅储淇℃伅" + size="small" + :border="true" + > + <el-table-column + prop="id" + label="搴忓彿" + width="70" + ></el-table-column> + <el-table-column prop="name" width="120" label="濮撳悕"> + <template slot-scope="scope"> + <a + style="cursor: pointer; color: #027edc" + @click=" + () => { + currentId = scope.row.id; + getData(); + isAdvancedSearch = false; + } + " + >{{ scope.row.name }}</a + > + </template> + </el-table-column> + <el-table-column prop="alias" label="鍒悕"></el-table-column> + <el-table-column prop="place" label="娲诲姩鍦�"></el-table-column> + <el-table-column + prop="medicalBranch" + label="鍖诲鍒嗙" + width="120" + ></el-table-column> + <el-table-column prop="workName" label="浣滃搧"></el-table-column> + <el-table-column + prop="personLabel" + width="120" + label="浜虹墿鏍囩" + ></el-table-column> + <el-table-column + prop="socialDistinction" + label="绀句細韬唤" + width="120" + ></el-table-column> + <el-table-column + prop="period" + width="120" + label="鏃舵湡" + ></el-table-column> + </el-table> + <div class="drawerPage"> + <el-pagination + class="paging flex" + background + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + :current-page="formData.currentPage" + :page-sizes="[10, 20, 60, 100]" + :page-size="formData.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="formData.total" + > + </el-pagination> + </div> + </div> </view> <div v-if="showPerson" class="personDialog"> <i @@ -176,7 +248,7 @@ style="margin-top: 0.1rem; flex: 1; width: 100%; position: relative" > <div - v-if="!loading && relationships.length == 0" + v-if="!loading && links.length == 0" style=" position: absolute; top: 30%; @@ -185,6 +257,7 @@ text-align: center; font-size: 0.2rem; color: #666; + z-index: 99; " > 鏆傛棤鐩稿叧鏁版嵁 @@ -200,10 +273,25 @@ text-align: center; font-size: 0.2rem; color: #666; + z-index: 99; " ></div> </div> <div id="customDialog" class="customDialog"> + <div class="title"> + <span>{{ detailData.name }}</span> + <span @click="closeDom">鍏抽棴</span> + </div> + <div class="content"> + <p>濮撳悕锛歿{ detailData.name }}</p> + <p>鍒悕锛歿{ detailData.alias }}</p> + <p>绫嶈疮锛歿{ detailData.nativePlace }}</p> + <p>鍖诲鍒嗙锛� {{ detailData.medicalBranch }}</p> + <p>灏忎紶锛歿{ detailData.biography }}</p> + </div> + <div class="btn" @click="spaceTimeArr(detailData.id)">鏌ョ湅鏇村>>></div> + </div> + <div id="schoolDialog" class="customDialog"> <div class="title"> <span>{{ detailData.name }}</span> <span @click="closeDom">鍏抽棴</span> @@ -222,8 +310,82 @@ :visible.sync="drawer" direction="rtl" :before-close="handleClose" + class="customDrawer" > - <span>鎴戞潵鍟�!</span> + <div class="drawerContent"> + <div class="drawerTips">閬镐腑鐨勫湴鍧�锛�</div> + <div class="drawerTable"> + <div class="tableTabs"> + <div class="inputItem"> + <el-input + placeholder="璜嬭几鍏ュ湴鍚嶆悳绱�" + v-model="tableKey" + class="input-with-select" + @keyup.enter="searchAddress" + > + <el-button + @click="searchAddress" + type="primary" + slot="append" + icon="el-icon-search" + ></el-button> + </el-input> + </div> + <div class="selectItem"> + <el-select v-model="dynastyId" placeholder="璜嬮伕鎿囨檪鏈�"> + <el-option + v-for="item in dynastyData" + :key="item.dynastyId + '0'" + :label="item.name" + :value="item.dynastyId" + ></el-option> + </el-select> + </div> + </div> + <el-table + ref="multipleTable" + :data="gridData" + style="width: 100%" + height="530" + @selection-change="handleSelectionChange" + row-key="index" + > + <el-table-column type="selection" width="55"> </el-table-column> + <el-table-column prop="currentName" label="鍦板悕"> </el-table-column> + <el-table-column width="250" label="骞翠唬鍗�闁�"> + <template slot-scope="scope">{{ + scope.row.start + "-" + scope.row.end + }}</template> + </el-table-column> + <el-table-column + prop="dynastyName" + label="鏅傛湡" + width="250" + show-overflow-tooltip + > + </el-table-column> + </el-table> + </div> + <div class="drawerPage"> + <el-pagination + class="paging flex" + background + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + :current-page="currentPage" + :page-sizes="[10, 20, 60, 100]" + :page-size="pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="total" + > + </el-pagination> + </div> + <div class="drawerBtn"> + <el-button @click="setCurrent">鍏ㄩ伕鐣跺墠闋�</el-button> + <el-button @click="setCurrent('cancle')">鍙栨秷鍏ㄩ伕</el-button> + <el-button @click="drawer = false" type="primary">纰哄畾</el-button> + </div> + </div> </el-drawer> </view> </template> @@ -232,17 +394,19 @@ import { getPersonData, getHotSearch, - getPDataStatistics, academicSearch, getPersonTag, getSocialDistinction, - getDynastyAll + getDynastyAll, + getAdvancedData, + getPlaceInfo, } from "@/api/index.js"; import * as echarts from "echarts"; -import MyForm from "@/components/form/form.vue"; export default { data() { return { + // 楂樼礆鎼滅储琛ㄦ牸 + tableData: [], loading: true, hotAciveIndex: "", currentId: 21682, @@ -254,11 +418,30 @@ hotKeyList: [], searchKey: "", // 鍒嗙被 - categories: [], + categories: [ + { + name: "浜插睘鍏崇郴", + }, + { + name: "甯堟壙鍏崇郴", + }, + { + name: "鏂囩尞浣滃搧", + }, + { + name: "绀句細鍏崇郴", + }, + { + name: "娲诲姩鍦�", + }, + { + name: "瀛︽湳娴佹淳", + }, + ], // 褰撳墠浜虹墿淇℃伅 ownInfo: null, detailData: { - name: "" + name: "", }, isAdvancedSearch: false, formData: { @@ -267,23 +450,37 @@ works: "", personTags: "", socialIdentity: "", - period: "" + period: "", + page: 1, + currentPage: 1, + pageSize: 10, + total: 0, }, showPerson: false, personList: [], personPageInfo: { totalCount: 0, page: 1, - limit: 10 + limit: 10, }, personTag: [], socialDistinction: [], dynastyData: [], + // 鎶藉眽 + gridData: [], + page: 1, + currentPage: 1, + pageSize: 10, + total: 0, drawer: false, + dynastyId: "", + tableKey: "", + multipleTableSelection: [], + // echarts infoOfPersons: [], infoOfSchools: [], nodeDatas: [], - links: [] + links: [], }; }, mounted() { @@ -291,6 +488,8 @@ this.hotSearch(); // 鑾峰彇浜虹墿鏍囩銆佺ぞ浼氳韩浠� this.getOptionInfo(); + // 鐛插彇鍦板潃鍒楄〃 + this.getAddressList(); // 鐩戝惉绐楀彛澶у皬鍙樺寲 window.addEventListener("resize", this.relation); }, @@ -298,6 +497,83 @@ this.searchKey = options.keyword; }, methods: { + // 鎼滅储鍦板潃 + searchAddress() { + this.gridData = []; + this.getAddressList(); + }, + // 鍒嗛〉 + handleSizeChange(val) { + this.pageSize = val; + this.getAddressList(); + }, + handleCurrentChange(val) { + this.page = val; + this.getAddressList(); + }, + // 琛ㄦ牸閫夋嫨 + handleSelectionChange(val) { + const data = val.map((item) => { + return { + ...item, + name: item.currentName, + id: item.dynastyId, + }; + }); + this.formData.actively = data; + this.multipleTableSelection = this.formData.actively; + }, + // 鍏ㄩ伕 + setCurrent(str) { + if (str == "cancle") { + this.$refs.multipleTable.clearSelection(); + return false; + } + if (this.gridData.length) { + this.$refs.multipleTable.clearSelection(); + this.gridData.forEach((row) => { + this.$refs.multipleTable.toggleRowSelection(row); + }); + const data = this.gridData.map((item) => { + return { + ...item, + name: item.currentName, + id: item.dynastyId, + }; + }); + this.formData.actively = data; + this.multipleTableSelection = this.formData.actively; + } + }, + // 鐛插彇鍦板潃鍒楄〃 + getAddressList() { + const data = { + page: this.page, + pageSize: this.pageSize, + }; + if (this.dynastyId != "") { + data["dynastyId"] = this.dynastyId; + } + if (this.tableKey != "") { + data["keyword"] = this.tableKey; + } + getPlaceInfo(data).then((res) => { + if (res?.success && res?.npage) { + this.total = res.npage.totalCount; + } + if (res?.success && res?.list.length) { + this.gridData = res?.list?.map((item, i) => { + return { + ...item, + index: i, + }; + }); + } else { + this.gridData = []; + } + }); + }, + getOptionInfo() { getDynastyAll().then((res) => { this.dynastyData = res.list; @@ -309,25 +585,102 @@ this.socialDistinction = res.list; }); }, + resetForm(formName) { this.formData = { name: "", actively: [], works: "", - personTags: "", - socialIdentity: "", - period: "" + personTags: [], + socialIdentity: [], + period: [], + page: 1, + currentPage: 1, + pageSize: 10, + total: 0, }; }, + searchFun() { - console.log(this.formData); + const palceData = this.formData.actively?.map((item) => { + return { + ancientName: item.ancientName ?? "", + dynastyId: item.dynastyId, + currentName: item.currentName, + }; + }); + let Obj = { + keyword: this.formData.name, + placeList: [...palceData], + literatureName: this.formData.works, + personTagIdList: this.formData.personTags, + socialDistinctionIdList: this.formData.socialIdentity, + dynastyIdList: this.formData.period, + page: this.formData.page, + pageSize: this.formData.pageSize, + }; + // // 鎼滅储 + getAdvancedData(Obj).then((res) => { + if (res?.success) { + this.tableData = res.list.map((item) => { + return { + id: item.personId, + name: + item?.NAME?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + alias: + item?.ALIAS?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + place: + item?.NATIVE_PLACE?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + medicalBranch: + item?.MEDICAL_BRANCH?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + socialDistinction: + item?.SOCIAL_IDENTITY?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + period: + item?.PERIOD?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + workName: + item?.REPRESENTATIVE_WORKS?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + personLabel: + item?.PERSON_LABEL?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + }; + }); + // 鎬绘暟閲� + this.formData.total = res.npage.totalCount; + } + }); }, + selectActively() { this.drawer = true; }, + handleClose(done) { done(); }, + // 鑾峰彇浜虹墿鍏崇郴 getPersonInfo(arr, str, newArr, order, type, parent) { for (let i = 0; i < arr.length; i++) { @@ -343,7 +696,7 @@ parentName: parent?.NAME[0]?.content1 ?? parent.parentName, name: personInfo?.NAME[0]?.content1, category: type, - symbolSize: 15 + symbolSize: 15, }; if (order > 80) { order = 80; @@ -445,7 +798,7 @@ const data = item[str]?.map((e) => { return { ...e, - personId: item.personId + personId: item.personId, }; }); if (ele[str] && data?.length) { @@ -457,6 +810,7 @@ } return arr; }, + //鏁扮粍鍘婚噸 deduplicateArray(arr, idKey) { // 浣跨敤涓�涓緟鍔╁璞℃潵璺熻釜宸茬粡瑙佽繃鐨処D @@ -481,16 +835,19 @@ getData() { this.loading = true; getPersonData(this.currentId).then((res) => { - console.log("1111111111111", res); - this.infoOfPersons = res.object.infoOfPersons; - this.infoOfSchools = res.object.infoOfSchools; - this.nodeDatas = []; - this.links = []; - this.handleData([res.object.personChain], null); - console.log("this.nodeDatas", this.nodeDatas); - console.log("this.links", this.links); - this.loading = false; - this.relation(); + if (res && res.object) { + this.infoOfPersons = res?.object?.infoOfPersons; + this.infoOfSchools = res?.object?.infoOfSchools; + this.nodeDatas = []; + this.links = []; + this.handleData([res.object.personChain], null); + this.loading = false; + this.relation(); + } else { + this.loading = false; + this.nodeDatas = []; + this.links = []; + } // this.nodes = []; // this.relationships = []; // let kinData = []; @@ -612,9 +969,9 @@ // this.relationships.push(obj); // }); // } - }); }, + // 閫掑綊澶勭悊鎵�鏈夊眰绾ф暟鎹� handleData(data, parent) { for (let i = 0; i < data.length; i++) { @@ -630,8 +987,8 @@ id: item.mainId, name: mainPerson.NAME[0].content1, itemStyle: { - color: "#244a7b" - } + color: "#244a7b", + }, }); } else { switch (parent.thisType) { @@ -646,11 +1003,9 @@ ); if (p) { this.nodeDatas.push({ + category: 0, id: item.mainId, name: p.NAME[0].content1, - itemStyle: { - color: "#5470c6" - } }); } } @@ -666,8 +1021,8 @@ padding: [3, 8], borderRadius: 30, position: "middle", // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず - distance: -10 // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 - } + distance: -10, // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + }, }); break; case 2: @@ -677,16 +1032,14 @@ -1 ) { this.nodeDatas.push({ + category: 2, id: item.mainId, name: item.literatureName, - itemStyle: { - color: "#fac858" - } }); } this.links.push({ source: item.mainId, - target: parent.mainId + target: parent.mainId, }); break; case 3: @@ -696,16 +1049,14 @@ -1 ) { this.nodeDatas.push({ + category: 4, id: item.mainId, name: item.ancientName, - itemStyle: { - color: "#ea7ccc" - } }); } this.links.push({ source: item.mainId, - target: parent.mainId + target: parent.mainId, }); break; case 4: @@ -717,22 +1068,17 @@ const s = this.infoOfSchools.find( (sItem) => sItem.schoolId == item.schoolId ); - console.log(this.infoOfSchools); - console.log(item.schoolId); - console.log(s); if (s) { this.nodeDatas.push({ + category: 5, id: item.mainId, name: s.name[0], - itemStyle: { - color: "#9a60b4" - } }); } } this.links.push({ source: item.mainId, - target: parent.mainId + target: parent.mainId, }); break; case 5: @@ -746,11 +1092,9 @@ ); if (p) { this.nodeDatas.push({ + category: 3, id: item.mainId, name: p.NAME[0].content1, - itemStyle: { - color: "#ee6666" - } }); } } @@ -766,8 +1110,8 @@ padding: [3, 8], borderRadius: 30, position: "middle", // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず - distance: -10 // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 - } + distance: -10, // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + }, }); break; case 6: @@ -781,11 +1125,9 @@ ); if (p) { this.nodeDatas.push({ + category: 1, id: item.mainId, name: p.NAME[0].content1, - itemStyle: { - color: "#3dae7b" - } }); } } @@ -801,8 +1143,8 @@ padding: [3, 8], borderRadius: 30, position: "middle", // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず - distance: -10 // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 - } + distance: -10, // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + }, }); break; } @@ -853,7 +1195,7 @@ } return { ...item, - symbolSize: size > 80 ? 80 : size + symbolSize: size > 80 ? 80 : size, }; }); @@ -880,13 +1222,6 @@ } var option; option = { - // backgroundColor: { - // type: "image", - // image: "/static/image/characterRelationBg.png", - // size: "100% 100%", // 鑳屾櫙鍥剧墖鐨勫昂瀵革紝鍙互鏄櫨鍒嗘瘮鎴栬�呭儚绱� - // position: "center center", // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮 - // }, - // tooltip: {}, legend: [ { left: 20, @@ -894,8 +1229,8 @@ orient: "vertical", data: this.categories.map(function (a) { return a.name; - }) - } + }), + }, ], series: [ { @@ -905,35 +1240,41 @@ symbolSize: 15, data: this.nodeDatas, links: this.links, - categories: [{ - - }], + categories: this.categories, roam: true, label: { show: true, position: "right", - formatter: "{b}" + formatter: "{b}", }, scaleLimit: { min: 0.4, - max: 2 + max: 2, }, lineStyle: { color: "source", - curveness: 0.2 + curveness: 0.2, }, emphasis: { focus: "adjacency", lineStyle: { - width: 5 - } + width: 5, + }, }, force: { repulsion: 600, - edgeLength: 300 - } - } - ] + edgeLength: 300, + }, + }, + ], + color: [ + "#5470c6", + "#3dae7b", + "#fac858", + "#ee6666", + "#ea7ccc", + "#9a60b4", + ], }; // 璁剧疆鐐瑰嚮浜嬩欢鐩戝惉 myChart.off("click"); @@ -944,45 +1285,85 @@ }); myChart.setOption(option); }, + creatDom(params) { - const e = params.event; - const div = document.getElementById("customDialog"); - div.style.display = "block"; - div.style.left = e.offsetX + 50 + "px"; - div.style.top = e.offsetY - 50 + "px"; - const data = this.infoOfPersons?.find( - (i) => i.id == params.data.personId - ); - const obj = { - id: params.data.id, - name: - data?.NAME?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - alias: - data?.ALIAS?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - nativePlace: - data?.NATIVE_PLACE?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - medicalBranch: - data?.MEDICAL_BRANCH?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - biography: data?.BIOGRAPHY ?? "" - }; - this.detailData = obj; + const id = params.data.id.split("_")[0]; + const type = params.data.id.split("_")[1]; + if (type == "p") { + // 浜� + const e = params.event; + const div = document.getElementById("customDialog"); + div.style.display = "block"; + div.style.left = e.offsetX + 50 + "px"; + div.style.top = e.offsetY - 50 + "px"; + const data = this.infoOfPersons?.find((i) => i.id == id); + const obj = { + id: id, + name: + data?.NAME?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + alias: + data?.ALIAS?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + nativePlace: + data?.NATIVE_PLACE?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + medicalBranch: + data?.MEDICAL_BRANCH?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + biography: data?.BIOGRAPHY ?? "", + }; + this.detailData = obj; + } + if (type == "s") { + // 瀛︽淳 + const e = params.event; + const div = document.getElementById("schoolDialog"); + div.style.display = "block"; + div.style.left = e.offsetX + 50 + "px"; + div.style.top = e.offsetY - 50 + "px"; + const data = this.infoOfPersons?.find((i) => i.id == id); + const obj = { + id: params.data.id, + name: + data?.NAME?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + alias: + data?.ALIAS?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + nativePlace: + data?.NATIVE_PLACE?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + medicalBranch: + data?.MEDICAL_BRANCH?.map((e, i) => { + i += 1; + return e["content" + i]; + }).join("銆�") ?? "", + biography: data?.BIOGRAPHY ?? "", + }; + this.detailData = obj; + } }, + closeDom() { const div = document.getElementById("customDialog"); div.style.display = "none"; }, + // 鍩虹鎼滅储 onSearch(val, index) { console.log(val); @@ -999,12 +1380,13 @@ this.searchPerson(val.text); } }, + // 鏍规嵁鍏抽敭瀛楁绱汉鐗� searchPerson(key) { academicSearch({ keyword: key, page: this.personPageInfo.page, - pageSize: this.personPageInfo.limit + pageSize: this.personPageInfo.limit, }).then((res) => { this.personList = res.list.map((item) => { return { @@ -1025,19 +1407,21 @@ division: item.medicalBranchList && item.medicalBranchList.length ? item.medicalBranchList[0].content1 - : "-" + : "-", }; }); this.showPerson = true; }); }, + // 鍏崇郴鍥� 鐐瑰嚮閲岄潰鐨勫厓绱� spaceTimeArr(id) { // 鍏崇郴鍥剧殑鏁版嵁 uni.navigateTo({ - url: "/pages/character/detail?id=" + id + url: "/pages/character/detail?id=" + id, }); }, + // 鑾峰彇鏈濅唬echarts鐨勬暟鎹� echartsArr() { getDataStatistics().then((res) => { @@ -1051,6 +1435,7 @@ }); }); }, + // 鐑棬鎼滅储 hotSearch() { getHotSearch().then((res) => { @@ -1059,11 +1444,12 @@ this.hotKeyList = indexList.map((item) => { return { id: item, - name: res.object[item] + name: res.object[item], }; }); }); }, + isAvancedClick() { this.isAdvancedSearch = !this.isAdvancedSearch; // this.$nextTick(() => { @@ -1074,12 +1460,116 @@ // document.querySelector(".fbox1").style.height = box1Height + "px"; // } // }); - } - } + }, + }, }; </script> <style> +.fromTable { + width: 100%; + padding: 40px 0; + box-sizing: border-box; +} + +.fromTable >>> .el-table thead th.el-table__cell { + background-color: rgb(194 208 217) !important; + color: #333; + font-weight: normal; + font-size: 14px; +} + +.customDrawer >>> .el-drawer__header { + margin-bottom: 20px; + border-bottom: 1px solid #eee; + padding: 20px; + box-sizing: border-box; +} + +.headerClassBg { + background-color: rgb(95, 127, 168); +} + +.drawerTips { + margin-bottom: 20px; + color: #666; +} + +.drawerTable { + width: 100%; +} + +.drawerTable >>> .el-table thead th.el-table__cell { + background-color: rgb(231, 236, 239) !important; + color: #333; + font-weight: normal; +} + +.tableTabs { + width: 100%; + display: flex; + margin-bottom: 20px; +} + +.inputItem { + width: 80%; +} + +.drawerPage { + display: flex; + justify-content: flex-end; + padding: 20px 0; + box-sizing: border-box; +} + +.drawerPage + >>> .el-pagination.is-background + .el-pager + li:not(.disabled).active { +} + +.drawerBtn { + display: flex; + justify-content: flex-end; +} + +.drawerContent { + width: 100%; + height: 100%; + padding: 0 20px; + box-sizing: border-box; +} + +/* 鍒嗛〉 */ +.paging ::v-deep .btn-prev, +.paging ::v-deep .btn-next { + border: 0; + height: 30px; +} + +.paging ::v-deep .btn-prev span, +.paging ::v-deep .btn-next span { + font-size: 0.12rem; + height: 0.3rem; + line-height: 0.3rem; + background-color: #fff; + color: #9e9e9e; + text-align: center; + border: 1px solid #9e9e9e; + padding: 0 0.1rem; +} + +.paging ::v-deep .el-pager li { + font-size: 0.1rem; + width: 0.28rem; + height: 0.3rem; + line-height: 0.3rem; + background-color: #fff; + color: #9e9e9e; + text-align: center; + border: 1px solid #9e9e9e; +} + #relation { width: 100%; height: 100%; -- Gitblit v1.9.1