From 8b3880c31ceb67416a6eee67ed059d3c17f3d9ec Mon Sep 17 00:00:00 2001 From: 杨磊 <505174330@qq.com> Date: 星期一, 28 四月 2025 10:50:42 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/wyyDatabase --- src/views/directory/index.vue | 156 ++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 116 insertions(+), 40 deletions(-) diff --git a/src/views/directory/index.vue b/src/views/directory/index.vue index 7142ecf..2d7af1d 100644 --- a/src/views/directory/index.vue +++ b/src/views/directory/index.vue @@ -26,7 +26,14 @@ </p> </div> <!-- 鍥捐〃鏄剧ず --> - <div class="charts-main" v-if="activeTabs == 'chart'"> + <div + class="charts-main" + v-show="activeTabs == 'chart'" + v-loading="loading" + element-loading-text="鍥捐〃鍔犺浇涓�" + element-loading-spinner="el-icon-loading" + element-loading-background="rgba(0, 0, 0, 0)" + > <div class="radial-tree-container" v-show="!loading"> <div ref="chart" style="width: 100%; height: 70vh"></div> </div> @@ -66,7 +73,11 @@ > <img class="autoImg" - src="@/assets/images/directory/touxiang.png" + :src=" + currentNodeInfo.icon + ? currentNodeInfo.icon + : '@/assets/images/directory/touxiang.png' + " alt="" /> </div> @@ -83,8 +94,19 @@ {{ currentNodeInfo.name }} </div> <div style="margin-top: 20px"> - <span> 鐢� </span> <span> 纭曞+ </span> - <span> 鍖椾含涓尰鑽ぇ瀛� </span> + <span> + {{ + currentNodeInfo.gender == "male" ? "鐢�" : "濂�" || "-" + }} + </span> + <span> {{ currentNodeInfo.academicName || "-" }} </span> + <span> + {{ + legendList.find( + (item) => item.value == currentNodeInfo.unit + )?.name || "-" + }} + </span> </div> </div> </div> @@ -98,19 +120,32 @@ margin-top: 10px; " > - <p style="margin-bottom: 15px">瀛︿範鏃堕棿锛�1985.09 -1988.07</p> <p style="margin-bottom: 15px"> - 鐜板伐浣滃崟浣嶏細鍖椾含涓尰鑽ぇ瀛︿笢鏂瑰尰闄� + 瀛︿範鏃堕棿锛歿{ currentNodeInfo.studyTime || "-" }} </p> - <p style="margin-bottom: 15px">鑱屽姟锛氬師闄㈤暱</p> - <p style="margin-bottom: 15px">鑱岀О锛氫富浠诲尰甯堛�佹暀鎺�</p> - </div> - <div style="text-align: left; line-height: 22px"> - <p> - 澶у鸡鍢堝槇濡傛�ラ洦锛屽皬寮﹀垏鍒囧绉佽銆傚槇鍢堝垏鍒囬敊鏉傚脊锛屽ぇ鐝犲皬鐝犺惤鐜夌洏銆傞棿鍏宠幒璇姳搴曟粦锛屽菇鍜芥硥娴佸啺涓嬮毦銆傚啺娉夊喎娑╁鸡鍑濈粷锛屽嚌缁濅笉閫氬0鏆傛瓏銆傚埆鏈夊菇鎰佹殫鎭ㄧ敓锛屾鏃舵棤澹拌儨鏈夊0銆傞摱鐡朵箥鐮存按娴嗚扛锛岄搧楠戠獊鍑哄垁鏋福銆傛洸缁堟敹鎷ㄥ綋蹇冪敾锛屽洓寮︿竴澹板瑁傚笡銆備笢鑸硅タ鑸倓鏃犺█锛屽敮瑙佹睙蹇冪鏈堢櫧銆� + <p style="margin-bottom: 15px"> + 鐜板伐浣滃崟浣嶏細 + {{ currentNodeInfo.currentEmployer_secondary || "-" }} + </p> + <p style="margin-bottom: 15px"> + 鑱屽姟锛歿{ currentNodeInfo.jobTitle || "-" }} + </p> + <p style="margin-bottom: 15px"> + 鑱岀О锛歿{ currentNodeInfo.professionalTitle || "-" }} </p> </div> <div + style=" + text-align: left; + line-height: 22px; + max-height: 200px; + overflow-y: auto; + padding: 10px; + " + > + <div v-html="currentNodeInfo.studentProfile"></div> + </div> + <!-- <div style=" display: flex; justify-content: space-between; @@ -125,20 +160,24 @@ <div> <img src="@/assets/images/directory/test.png" alt="" /> </div> - </div> + </div> --> </div> </div> </transition> </div> <!-- 鍒楄〃鏄剧ず --> - <div class="page-main" v-if="activeTabs == 'list'"> - <div v-loading="loading" style="min-height: 550px;" element-loading-background="rgba(0, 0, 0, 0)" element-loading-text="瀛︾敓鍒楄〃鍔犺浇涓�" - element-loading-spinner="el-icon-loading"> + <div class="page-main" v-show="activeTabs == 'list'"> + <div + v-loading="loading" + style="min-height: 550px" + element-loading-background="rgba(0, 0, 0, 0)" + element-loading-text="瀛︾敓鍒楄〃鍔犺浇涓�" + element-loading-spinner="el-icon-loading" + > <div v-for="(item, index) in universityList" :key="index"> <div class="table-title" - v-if="item.studentList && item.studentList.length > 0" - > + v-if="item.studentList && item.studentList.length > 0"> <div class="table-title-left"> <p class="table-title-name">{{ item.unitName }}</p> <p class="table-title-degree">{{ item.academicDegreeName }}</p> @@ -148,8 +187,7 @@ </div> <div class="table-title-right" - @click="item.isShow = !item.isShow" - > + @click="item.isShow = !item.isShow"> <img :src="[item.isShow ? topIcon : bottomIcon]" alt="" /> </div> </div> @@ -196,6 +234,7 @@ </table> </div> </div> + <!-- <el-empty v-if="!resultList.length"></el-empty> --> </div> </div> </div> @@ -275,6 +314,9 @@ changeTab(key) { this.activeTabs = key; console.log(this.activeTabs, "activeTabs"); + if (key == "chart") { + this.initChart(); + } }, initChart() { this.chart = echarts.init(this.$refs.chart); @@ -286,7 +328,7 @@ formatter: (params) => { const data = params.data; this.currentNodeInfo = data; - + console.log(data, "data"); if (data.cmsItemType == "student") { return ` <div style=" @@ -298,17 +340,34 @@ text-align: center; "> <div style="width: 80px;height: 80px;position: relative; margin: 0 auto; margin-bottom: 10px;background: #D8D8D8;"> - <img class="autoImg" src="${require("@/assets/images/directory/touxiang.png")}" alt=""> + <img class="autoImg" src="${ + data.icon + ? data.icon + : require("@/assets/images/directory/touxiang.png") + }" alt=""> </div> <div style="font-size: 16px; font-weight: bold; margin-bottom: 5px;">${ - data.name|| '-' + data.name || "-" }</div> - <div> <span> ${data.gender == "male" ? "鐢�" : "濂�" || '-'} </span> <span> ${data.academicName || '-'} </span> <span> ${ this.legendList.find((item) => item.value == data.unit)?.name || '-'} </span></div> + <div> <span> ${ + data.gender == "male" ? "鐢�" : "濂�" || "-" + } </span> <span> ${data.academicName || "-"} </span> <span> ${ + this.legendList.find((item) => item.value == data.unit)?.name || + "-" + } </span></div> <div style="font-size: 16px; font-weight: bold; margin-bottom: 5px;text-align: left;margin-top: 10px;overflow: hidden;"> - <p style="margin-bottom: 5px;">瀛︿範鏃堕棿锛�${data.studyTime || '-'}</p> - <p style="margin-bottom: 5px; white-space: pre-wrap" >鐜板伐浣滃崟浣嶏細${data.currentEmployer_secondary || '-'}</p> - <p style="margin-bottom: 5px;">鑱屽姟锛�${data.jobTitle || '-'}</p> - <p style="margin-bottom: 5px;">鑱岀О锛�${data.professionalTitle || '-'}</p> + <p style="margin-bottom: 5px;">瀛︿範鏃堕棿锛�${ + data.studyTime || "-" + }</p> + <p style="margin-bottom: 5px; white-space: pre-wrap" >鐜板伐浣滃崟浣嶏細${ + data.currentEmployer_secondary || "-" + }</p> + <p style="margin-bottom: 5px;">鑱屽姟锛�${ + data.jobTitle || "-" + }</p> + <p style="margin-bottom: 5px;">鑱岀О锛�${ + data.professionalTitle || "-" + }</p> </div> </div> @@ -329,14 +388,8 @@ <div style="font-size: 16px; font-weight: bold; margin-bottom: 5px;">${ data.name }</div> - <div> <span> 娴嬭瘯 </span> <span> 纭曞+ </span> <span> 鍖椾含涓尰鑽ぇ瀛� </span></div> - <div style="font-size: 16px; font-weight: bold; margin-bottom: 5px;text-align: left;margin-top: 10px;"> - <p style="margin-bottom: 5px;">瀛︿範鏃堕棿锛�1985.09 -1988.07</p> - <p style="margin-bottom: 5px;">鐜板伐浣滃崟浣嶏細鍖椾含涓尰鑽ぇ瀛︿笢鏂瑰尰闄�</p> - <p style="margin-bottom: 5px;">鑱屽姟锛氬師闄㈤暱</p> - <p style="margin-bottom: 5px;">鑱岀О锛氫富浠诲尰甯堛�佹暀鎺�</p> - </div> - + <div> <span> ${data.academicDegreeName || "-"} </span></div> + </div> `; } @@ -501,7 +554,9 @@ item.unit == citem.unitValue && item.academicDegree == citem.academicDegreeValue ) { - item.academicName = this.academicDegreeList.find(f => f.value == item.academicDegree)?.name + item.academicName = this.academicDegreeList.find( + (f) => f.value == item.academicDegree + )?.name; citem.studentList.push(item); citem.children.push(item); } @@ -512,15 +567,13 @@ this.universityList = arrList; // this.chartData.children = arrList; const temp_chartData = { - name: "", + name: "鐜嬫案鐐�", children: arrList, }; this.chartData = temp_chartData; console.log(this.chartData, "this.chartData"); this.initChart(); - - } }) .catch((error) => { @@ -569,6 +622,7 @@ flex: 1; width: 100%; height: 100%; + min-width: 1200px; overflow: auto; padding-top: 2%; padding-bottom: 2%; @@ -657,6 +711,8 @@ .charts-main { // background-color: #000; position: relative; + margin: 0 auto; + min-height: 600px; } .table-title { @@ -739,4 +795,24 @@ .tagText { margin-left: 30px; } +::v-deep .el-loading-spinner { + color: #937950 !important; +} + +::v-deep .el-loading-spinner .el-loading-text { + font-size: 14px; + color: #937950; +} + +::v-deep .el-loading-spinner { + .el-loading-text { + font-size: 14px; + color: #937950; + } + + .el-icon-loading { + font-size: 14px; + color: #937950; + } +} </style> -- Gitblit v1.9.1