From ce9ff4af4cf7ccc87d3ef94a849942baf112b811 Mon Sep 17 00:00:00 2001
From: 杨磊 <505174330@qq.com>
Date: 星期一, 07 四月 2025 18:03:01 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/wyyDatabase
---
src/assets/images/achievements/sort-bottom.png | 0
src/views/achievements/index.vue | 637 +++++++++++++++++++++++++++++++++++++++++++++---
src/assets/images/directory/noListIcon.png | 0
src/assets/images/directory/bottomIcon.png | 0
src/assets/images/directory/noChartIcon.png | 0
src/components/form/form.vue | 83 ++++++
src/assets/images/achievements/sort-top.png | 0
src/router/index.js | 2
src/views/directory/index.vue | 25 -
9 files changed, 684 insertions(+), 63 deletions(-)
diff --git a/src/assets/images/achievements/sort-bottom.png b/src/assets/images/achievements/sort-bottom.png
new file mode 100644
index 0000000..241264c
--- /dev/null
+++ b/src/assets/images/achievements/sort-bottom.png
Binary files differ
diff --git a/src/assets/images/achievements/sort-top.png b/src/assets/images/achievements/sort-top.png
new file mode 100644
index 0000000..337e025
--- /dev/null
+++ b/src/assets/images/achievements/sort-top.png
Binary files differ
diff --git a/src/assets/images/directory/bottomIcon.png b/src/assets/images/directory/bottomIcon.png
new file mode 100644
index 0000000..426dab4
--- /dev/null
+++ b/src/assets/images/directory/bottomIcon.png
Binary files differ
diff --git a/src/assets/images/directory/noChartIcon.png b/src/assets/images/directory/noChartIcon.png
new file mode 100644
index 0000000..d5559ee
--- /dev/null
+++ b/src/assets/images/directory/noChartIcon.png
Binary files differ
diff --git a/src/assets/images/directory/noListIcon.png b/src/assets/images/directory/noListIcon.png
new file mode 100644
index 0000000..e4e138a
--- /dev/null
+++ b/src/assets/images/directory/noListIcon.png
Binary files differ
diff --git a/src/components/form/form.vue b/src/components/form/form.vue
new file mode 100644
index 0000000..06c86af
--- /dev/null
+++ b/src/components/form/form.vue
@@ -0,0 +1,83 @@
+<template >
+ <div>
+ <el-form
+ size="mini"
+ :inline="true"
+ style="padding: 0px 10px;
+ "
+ :model="from"
+ class="row demo-form-inline col-xs-12"
+ >
+ <el-row :gutter="10">
+ <el-form-item
+ style="width: 33%"
+ v-for="(item, i) in from.from"
+ :key="i"
+ :label="item.label"
+ >
+ <el-input
+ v-if="item.type === 'input'"
+ v-model="item.value"
+ :placeholder="item.label"
+ ></el-input>
+ </el-form-item>
+ <!-- 鍏朵粬琛ㄥ崟椤圭渷鐣� -->
+ <!-- <el-form-item style="display:block; "> -->
+ <div class="flex flex-center Formbtn">
+ <el-button
+
+ size="mini"
+ @click="handleSubmit"
+ >鎼滅储</el-button
+ >
+ <el-button size="mini" @click="handleReset"
+ >閲嶇疆</el-button
+ >
+ </div>
+ <!-- </el-form-item> -->
+ </el-row>
+ </el-form>
+ </div>
+</template>
+<script>
+export default {
+ props: ["from"],
+ mounted(){
+ },
+ methods: {
+ handleSubmit() {
+ this.$message({
+ message: "鏌ヨ鎴愬姛",
+ type: "success",
+ });
+ const result = this.from.from.reduce((obj, item) => {
+ obj[item.name] = item.value;
+ return obj;
+ }, {});
+ // 鎻愪氦閫昏緫
+ this.$emit("submit", result); // 鍙戦�� submit 浜嬩欢锛屽苟灏嗚〃鍗曟暟鎹綔涓哄弬鏁颁紶閫掔粰鐖剁粍浠�
+ },
+ handleReset() {
+ this.from.from.forEach((item) => {
+ item.value = "";
+ });
+ // 閲嶇疆閫昏緫
+ this.$emit('reset') // 鍙戦�� reset 浜嬩欢缁欑埗缁勪欢
+ },
+ },
+};
+</script>
+
+<style scoped>
+.el-form--inline .el-form-item {
+ margin-right: 0;
+}
+
+::v-deep .el-form-item__content {
+ width: 80%;
+}
+
+::v-deep .el-form-item__content div {
+ width: 100%;
+}
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index e5c95e0..ebb41ca 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -16,7 +16,7 @@
name: "HomeLayout",
component: HomeLayout,
redirect: {
- name: "honor",
+ name: "chronology",
},
children: [
// 鍦ㄤ富妗嗘灦鍐�
diff --git a/src/views/achievements/index.vue b/src/views/achievements/index.vue
index 2873bb1..a2c0031 100644
--- a/src/views/achievements/index.vue
+++ b/src/views/achievements/index.vue
@@ -3,42 +3,374 @@
<div class="page-header">
<p>鐜嬫案鐐庨櫌澹鏈垚鏋�</p>
</div>
- <!-- 鎼滅储妗� -->
- <ul class="page-input">
- <li class="input-main">
- <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="input3" class="input-with-select" suffix="鎼滅储">
- <el-select v-model="select" slot="prepend" placeholder="璇烽�夋嫨">
- <el-option label="椁愬巺鍚�" value="1"></el-option>
- <el-option label="璁㈠崟鍙�" value="2"></el-option>
- <el-option label="鐢ㄦ埛鐢佃瘽" value="3"></el-option>
- </el-select>
- <el-button slot="append" >鎼滅储</el-button>
- </el-input>
- </li>
- <li class="input-txt" @click="isDisplay = !isDisplay">
- 楂樼骇妫�绱�
- <img v-if="isDisplay" src="../../assets/images/achievements/top-Icon.png" alt="">
- <img v-else src="../../assets/images/achievements/bottom-Icon.png" alt="">
- </li>
- </ul>
- <!-- 楂樼骇鎼滅储 -->
- <div v-if="isDisplay">
- 123
- </div>
+ <div class="page-main">
+ <!-- 鎼滅储妗� -->
+ <ul class="page-input">
+ <li class="input-main">
+ <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="input3" class="input-with-select" suffix="鎼滅储">
+ <el-select v-model="select" slot="prepend" placeholder="璇烽�夋嫨">
+ <el-option v-for="(item, index) in optionlist" :key="index" :label="item.lable"
+ :value="item.lable"></el-option>
+ </el-select>
+ <el-button slot="append">鎼滅储</el-button>
+ </el-input>
+ </li>
+ <li class="input-txt" @click="isDisplay = !isDisplay">
+ 楂樼骇妫�绱�
+ <img :src="[isDisplay ? topIcon : bottomIcon]" alt="">
+ </li>
+ </ul>
+ <!-- 楂樼骇鎼滅储 -->
+ <div v-if="isDisplay" class="page-search">
+ <MyForm class="myfrom" @submit="
+ (data) => {
+ CurrentPage = 1;
+ onSubmit(data);
+ }
+ " @reset="resetForm" :from="from" />
+ </div>
+ <!-- 鎼滅储缁撴灉 -->
+ <div class="page-content">
+ <div class="content-left">
+ <!-- 绫诲瀷 -->
+ <ul>
+ <li class="left-title">
+ <span>{{ category.title }}</span>
+ <p @click="category.isDisplay = !category.isDisplay">
+ <img :src="[category.isDisplay ? topIcon : bottomIcon]" alt="">
+ </p>
+ </li>
+ <li class="left-main" v-if="category.isDisplay">
+ <div class="category-main" v-for="(item, index) in category.list" :key="index">
+ <el-checkbox class="el-checkbox" v-model="item.checked" :title="item.name">{{ item.name }}</el-checkbox>
+ <span class="">{{ item.num }}</span>
+ </div>
+ </li>
+ </ul>
+ <!-- 骞村害 -->
+ <ul>
+ <li class="left-title">
+ <div>
+ <span>{{ annual.title }}</span>
+ <span>
+ 鏃堕棿
+ <img class="sort-Icon" :src="[isDisplay ? sortTop : sortBottom]" alt="">
+ </span>
+ <span>鏂囩尞閲�
+ <img class="sort-Icon" :src="[isDisplay ? sortBottom : sortTop]" alt="">
+ </span>
+ </div>
+ <p @click="annual.isDisplay = !annual.isDisplay">
+ <img :src="[annual.isDisplay ? topIcon : bottomIcon]" alt="">
+ </p>
+ </li>
+ <li class="left-main" v-if="annual.isDisplay">
+ <div class="annual-main" v-for="(item, index) in annual.list" :key="index">
+ <el-checkbox class="el-checkbox" v-model="item.checked" :title="item.years">{{ item.years }}</el-checkbox>
+ <span class="">{{ item.num }}</span>
+ </div>
+ <p class="annual-footer" v-if="annual.list && annual.list.length > 5">灞曞紑</p>
+ </li>
+ </ul>
+ <!-- 鏂囩尞鏉ユ簮 -->
+ <ul>
+ <li class="left-title">
+ <div>
+ <span>{{ sources.title }}</span>
+ <span>
+ 鏂囩尞閲�
+ <img class="sort-Icon" :src="[isDisplay ? sortBottom : sortTop]" alt="">
+ </span>
+ </div>
+ <p @click="sources.isDisplay = !sources.isDisplay">
+ <img :src="[sources.isDisplay ? topIcon : bottomIcon]" alt="">
+ </p>
+ </li>
+ <li class="left-main" v-if="sources.isDisplay">
+ <div class="sources-main" v-for="(item, index) in sources.list" :key="index">
+ <el-checkbox class="el-checkbox" :title="item.name" v-model="item.checked">{{ item.name }}</el-checkbox>
+ <span class="">{{ item.num }}</span>
+ </div>
+ <p class="sources-footer" v-if="sources.list && sources.list.length > 5">灞曞紑</p>
+ </li>
+ </ul>
+ <!-- 瀛︾ -->
+ <ul>
+ <li class="left-title">
+ <span>{{ subject.title }}</span>
+ <p @click="subject.isDisplay = !subject.isDisplay">
+ <img :src="[subject.isDisplay ? topIcon : bottomIcon]" alt="">
+ </p>
+ </li>
+ <li class="left-main" v-if="subject.isDisplay">
+ <div class="category-main" v-for="(item, index) in subject.list" :key="index">
+ <el-checkbox class="el-checkbox" v-model="item.checked" :title="item.name">{{ item.name }}</el-checkbox>
+ <span class="">{{ item.num }}</span>
+ </div>
+ </li>
+ </ul>
+ </div>
+ <div class="content-right">
+
+ </div>
+ </div>
+ </div>
</div>
</template>
<script>
+import MyForm from '@/components/form/form.vue'
+/* eslint-disable vue/no-unused-components */
export default {
+ name: 'achievements',
+ components: {
+ MyForm
+ },
data() {
return {
+ topIcon: require("@/assets/images/achievements/top-Icon.png"),
+ bottomIcon: require("@/assets/images/achievements/bottom-Icon.png"),
+ sortTop: require("@/assets/images/achievements/sort-top.png"),
+ sortBottom: require("@/assets/images/achievements/sort-bottom.png"),
isDisplay: false,
input3: '',
+ select: '',
+ checked: [],
+ optionlist: [
+ {
+ lable: "鏍囬"
+ },
+ {
+ lable: "浣滆��"
+ },
+ {
+ lable: "骞翠唤"
+ },
+ {
+ lable: "鍏抽敭璇�"
+ },
+ {
+ lable: "鎽樿"
+ },
+ {
+ lable: "鏉ユ簮"
+ },
+ ],
+ // 褰撳墠椤�
+ CurrentPage: 1,
+ // 楂樼骇鎼滅储
+ from: {
+ from: [
+ {
+ type: "input",
+ label: "鏍囥��棰�",
+ name: "title",
+ value: ""
+ },
+ {
+ type: "input",
+ label: "浣溿��鑰�",
+ name: "author",
+ value: ""
+ },
+ {
+ type: "input",
+ label: "骞淬��浠�",
+ name: "year",
+ value: ""
+ },
+ {
+ type: "input",
+ label: "鍏抽敭璇�",
+ name: "keyword",
+ value: ""
+ },
+ {
+ type: "input",
+ label: "鎽樸��瑕�",
+ name: "abstract",
+ value: ""
+ },
+ {
+ type: "input",
+ label: "鏉ャ��婧�",
+ name: "source",
+ value: ""
+ },
+ ]
+ },
+ // 绫诲瀷
+ category: {
+ title: "绫诲瀷",
+ isDisplay: true,
+ id: "",
+ index: "",
+ list: [
+ {
+ name: "鏈熷垔",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍥句功",
+ num: 190,
+ check: false
+ },
+ {
+ name: "瑙嗛",
+ num: 190,
+ check: false
+ },
+ {
+ name: "闊抽",
+ num: 190,
+ check: false
+ },
+ ]
+ },
+ // 骞村害
+ annual: {
+ title: "骞村害",
+ isDisplay: true,
+ id: "",
+ index: "",
+ list: [
+ {
+ years: "2025",
+ num: 20,
+ check: false
+ },
+ {
+ years: "2025",
+ num: 20,
+ check: false
+ },
+ {
+ years: "2025",
+ num: 20,
+ check: false
+ },
+ {
+ years: "2025",
+ num: 20,
+ check: false
+ },
+ {
+ years: "2025",
+ num: 20,
+ check: false
+ },
+ {
+ years: "2025",
+ num: 20,
+ check: false
+ },
+ {
+ years: "2025",
+ num: 20,
+ check: false
+ },
+
+ ],
+
+ },
+ // 鏂囩尞鏉ユ簮
+ sources: {
+ title: "鏂囩尞鏉ユ簮",
+ isDisplay: true,
+ id: "",
+ index: "",
+ list: [
+ {
+ name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+ num: 190,
+ check: false
+ },
+ ]
+ },
+ // 瀛︾
+ subject: {
+ title: "瀛︾",
+ isDisplay: true,
+ id: "",
+ index: "",
+ list: [
+ {
+ name: "鍖诲",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖诲",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖诲",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖诲",
+ num: 190,
+ check: false
+ },
+ {
+ name: "鍖诲",
+ num: 190,
+ check: false
+ },
+ ]
+ },
+
+ // 鏌ヨ缁撴灉
+ resultList:[
+ {
+ name:"涓嵂闂告煖鐨勫巻鍙蹭紶鎵夸笌鏂版椂浠ｅ彂灞曟�濊��",
+ sources:"鍖椾含涓尰鑽ぇ瀛﹀鎶�",
+ time:"2025-02-24 09:21",
+ title:"鎽樿: 涓嵂闂告煖鏄紶缁熶腑鑽皟鍓傜殑楂樼骇绠＄悊浜哄憳锛屽湪'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐ｄ换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠ｇぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃��",
+ keyword:""
+
+ }
+ ]
}
},
- methods: {
+ methods: {
+ async onSubmit(val) {
+
+ },
+ //閲嶇疆鎼滅储缁撴灉
+ resetForm() {
+ // this.onSearch("");
+ },
}
}
</script>
@@ -68,45 +400,252 @@
}
}
-.page-input {
+.page-main {
width: 1330px;
margin: 0 auto;
- display: flex;
- background-color: #fff;
}
-.input-main {
- padding: 15px 0;
- text-align: center;
- width: 90%;
- border-right: 2px solid #E4DACE;
- .input-with-select{
- width: 50%;
+.page-input {
+ width: 100%;
+ display: flex;
+ background-color: #fefbf5;
+ border: 1px solid #E4DACE;
+
+ .input-main {
+ padding: 15px 0;
+ text-align: center;
+ width: 90%;
+ border-right: 2px solid #E4DACE;
+
+ .input-with-select {
+ width: 50%;
+ }
+ }
+
+ .input-txt {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 10%;
+ padding: 15px 0;
+ font-family: Source Han Sans;
+ font-size: 14px;
+ font-weight: bold;
+ color: #6F5A3A;
+ cursor: pointer;
+
+ img {
+ width: 10px;
+ height: auto;
+ margin-left: 5px;
+ }
}
}
-
-.input-txt {
+.page-search {
+ width: 100%;
+ background-color: #fefbf5;
+ border-bottom: 1px solid #E4DACE;
+ border-left: 1px solid #E4DACE;
+ border-right: 1px solid #E4DACE;
+ padding: 13px 0px;
display: flex;
- align-items: center;
justify-content: center;
- width: 10%;
- padding: 15px 0;
- font-family: Source Han Sans;
- font-size: 14px;
- font-weight: bold;
- color: #6F5A3A;
- cursor: pointer;
- img {
- width: 10px;
- height: auto;
- margin-left: 5px;
+ .myfrom {
+ width: 80%;
+
+ ::v-deep .flex-center {
+ height: 80% !important;
+ }
+
+ ::v-deep .Formbtn {
+ width: 100% !important;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .el-button {
+ width: 68px !important;
+ height: 32px !important;
+ font-size: 14px;
+ background-color: transparent;
+ color: #937950;
+ border: 1px solid #6F5A3A;
+
+ &:hover {
+ background-color: #6F5A3A;
+ color: #FFFDF8;
+ }
+ }
+ }
}
+
+
+
}
+
+
+.page-content {
+ width: 100%;
+ margin-top: 20px;
+ background-color: #fefbf5;
+ border: 1px solid #E4DACE;
+ display: flex;
+
+
+ .content-left {
+ width: 19.5%;
+ border-right: 1px solid #E4DACE;
+ border-bottom: 1px solid #E4DACE;
+ }
+
+ .left-title {
+ padding: 7px 7px 9px 10px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ border-bottom: 1px solid #E4DACE;
+
+ span {
+ margin-right: 20px;
+ font-family: Source Han Sans;
+ font-size: 14px;
+ font-weight: bold;
+ }
+
+ .sort-Icon {
+ cursor: pointer;
+ height: 12px;
+ width: auto;
+ }
+
+ img {
+ cursor: pointer;
+ height: 4px;
+ width: auto;
+ }
+ }
+
+ .left-main {
+ border-bottom: 1px solid #E4DACE;
+ padding: 10px;
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+ }
+
+ .category-main {
+ width: 50%;
+ margin-bottom: 10px;
+
+ span {
+ font-family: Source Han Sans;
+ font-size: 12px;
+ color: #8F7A5A;
+ }
+ }
+
+ .annual-main {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 10px;
+
+ span {
+ font-family: Source Han Sans;
+ font-size: 12px;
+ color: #8F7A5A;
+ }
+ }
+
+ .annual-footer {
+ cursor: pointer;
+ width: 100%;
+ text-align: center;
+ font-family: Source Han Sans;
+ font-size: 12px;
+ font-weight: 350;
+ color: #937950;
+ }
+
+ .sources-main {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 10px;
+
+ span {
+ font-family: Source Han Sans;
+ font-size: 12px;
+ color: #8F7A5A;
+ }
+ }
+
+ .el-checkbox {
+ width: 70%;
+ }
+
+ /* 璁剧疆榧犳爣缁忚繃瀵瑰嬀妗嗭紝瀵瑰嬀妗嗚竟妗嗙殑棰滆壊 */
+ ::v-deep .el-checkbox .el-checkbox__inner:hover {
+ border-color: #D1D1D1;
+ }
+
+ /* 璁剧疆checkbox鑾峰緱鐒︾偣鍚庯紝瀵瑰嬀妗嗙殑杈规棰滆壊 */
+ ::v-deep .el-checkbox .el-checkbox__input.is-focus .el-checkbox__inner {
+ border-color: #D1D1D1;
+ }
+
+ ::v-deep .el-checkbox .el-checkbox__input.is-checked+.el-checkbox__label {
+ color: #2C2C2C;
+ }
+
+ ::v-deep .el-checkbox .el-checkbox__input.is-checked .el-checkbox__inner,
+ ::v-deep .el-checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+ border-color: #8F7A5A;
+ background-color: #8F7A5A;
+ }
+
+
+ ::v-deep .el-checkbox__label {
+ color: #2C2C2C;
+ width: 100%;
+ font-family: Source Han Sans;
+ font-size: 12px;
+ font-weight: bold;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ /* 瓒呭嚭閮ㄥ垎鏄剧ず鐪佺暐鍙� */
+ vertical-align: middle;
+ }
+
+ .sources-footer {
+ cursor: pointer;
+ width: 100%;
+ text-align: center;
+ font-family: Source Han Sans;
+ font-size: 12px;
+ font-weight: 350;
+ color: #937950;
+ }
+
+
+ .content-right{
+ width: 80.5%;
+ padding: 14px 20px 20px 14px;
+ }
+
+}
+
+
+
+
el-input__suffix {
-right: 22px;
-color: #999;
+ right: 22px;
+ color: #999;
}
</style>
\ No newline at end of file
diff --git a/src/views/directory/index.vue b/src/views/directory/index.vue
index 3c548c3..3cf48be 100644
--- a/src/views/directory/index.vue
+++ b/src/views/directory/index.vue
@@ -4,18 +4,12 @@
<p>鐜嬫案鐐庨櫌澹鐢熺洰褰�</p>
</div>
<div class="page-main-title">
- <p
- @click="changeTab('chart')"
- :class="[activeTabs == 'chart' ? 'active-tab' : '']"
- >
- <img src="../../assets/images/directory/chartIcon.png" alt="" />
+ <p @click="changeTab('chart')" :class="[activeTabs == 'chart' ? 'active-tab' : '']">
+ <img :src="[activeTabs == 'chart' ? chartIcon : noChartIcon]" alt="">
<span>鍥捐〃鏄剧ず</span>
</p>
- <p
- @click="changeTab('list')"
- :class="[activeTabs == 'list' ? 'active-tab' : '']"
- >
- <img src="../../assets/images/directory/listIcon.png" alt="" />
+ <p @click="changeTab('list')" :class="[activeTabs == 'list' ? 'active-tab' : '']">
+ <img :src="[activeTabs == 'list' ? listIcon : noListIcon]" alt="">
<span>鍒楄〃鏄剧ず</span>
</p>
</div>
@@ -37,9 +31,8 @@
<p class="table-title-degree">{{ item.degree }}</p>
<p class="table-title-number">{{ item.studentList.length }}浜�</p>
</div>
- <div class="table-title-right" @click="item.isShow = !item.isShow">
- <img src="../../assets/images/directory/topIcon.png" alt="" />
- </div>
+ <div class="table-title-right" @click="item.isShow = !item.isShow"><img
+ :src="[item.isShow ? topIcon : bottomIcon]" alt=""></div>
</div>
<table
cellpadding="100"
@@ -77,6 +70,12 @@
export default {
data() {
return {
+ chartIcon: require("@/assets/images/directory/chartIcon.png"),
+ noChartIcon: require("@/assets/images/directory/noChartIcon.png"),
+ listIcon: require("@/assets/images/directory/listIcon.png"),
+ noListIcon: require("@/assets/images/directory/noListIcon.png"),
+ topIcon: require("@/assets/images/directory/topIcon.png"),
+ bottomIcon: require("@/assets/images/directory/bottomIcon.png"),
activeTabs: "chart",
universityList: [
{
--
Gitblit v1.9.1