From 5e73d562bae941a7658c3c13fdb585461f1a24e4 Mon Sep 17 00:00:00 2001
From: zhongshujie <2862698242@qq.com>
Date: 星期一, 28 四月 2025 21:21:07 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/wyyDatabase
---
src/views/chronology/index.vue | 1064 ++++++++++++++++------------------------------------------
1 files changed, 296 insertions(+), 768 deletions(-)
diff --git a/src/views/chronology/index.vue b/src/views/chronology/index.vue
index 1161cbc..9e8b18a 100644
--- a/src/views/chronology/index.vue
+++ b/src/views/chronology/index.vue
@@ -30,7 +30,13 @@
<div>鍏朵粬</div>
</div>
</div>
- <div class="contentBox">
+ <div
+ class="contentBox"
+ element-loading-text="骞磋氨鍔犺浇涓�"
+ element-loading-spinner="el-icon-loading"
+ element-loading-background="rgba(0, 0, 0, 0)"
+ v-loading="!showList"
+ >
<div class="chartsBox">
<div
class="chartsItemBox"
@@ -43,793 +49,254 @@
class="gradchild"
v-for="(citem, cindex) in item.list"
:style="{ background: citem.color }"
- @mouseover="showDetail(index, cindex, 1)"
+ @click.self="showDetail(index, cindex, 1, $event)"
:key="cindex"
>
- <div class="detailDialog" v-if="citem.showDetail">
- <!-- <div class="dialogContent" @click="gotoDetail(citem)"> -->
+ <div
+ class="detailDialog"
+ :style="popupStyle"
+ v-if="citem.showChildDetail"
+ >
+ <div
+ class="closeBtn"
+ @click.stop="closeDetail(index, cindex, 0)"
+ >
+ <i class="el-icon-close"></i>
+ </div>
<floatingWindow :info="citem" />
- <!-- </div> -->
</div>
</div>
</div>
- <div class="item-circle"></div>
+ <div class="item-circle" @click="showYearWindow(index, 1)"></div>
<div class="item-text">
<div class="">
- {{ item.year }}
+ {{ item.name.split("锛�")[0] }}
</div>
<div style="margin-top: 10px">
- {{ item.name }}
+ {{ item.age }}
</div>
+ </div>
+ <div class="yaerWindow" v-if="item.showDetail">
+ <div class="closeBtn" @click="closeYearWindow(index, 0)">
+ <i class="el-icon-close"></i>
+ </div>
+ <yearWindow :info="item" />
</div>
</div>
</div>
</div>
+ <div></div>
</div>
</div>
</div>
</template>
<script>
-import echarts from "@/assets/js/echarts.min.js";
+import moment from "moment";
import floatingWindow from "./floatingWindow.vue";
+import yearWindow from "./yearWindow.vue";
+import { nextTick } from "vue";
+import fileApi from "@/assets/js/middleGround/api/file";
+import { requestCtx, appRefCode } from "@/assets/js/config";
+
export default {
components: {
floatingWindow,
+ yearWindow,
},
data() {
return {
- contentList: [
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1938",
- type: "journal",
- id: "1",
- },
- ],
- name: "鍑虹敓",
- year: "1938",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- type: "image",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- type: "book",
- id: "2",
- },
- ],
- name: "涓�宀�",
- year: "1939",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "2",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- type: "video",
- id: "3",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- type: "audio",
- id: "4",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- id: "5",
- },
- ],
- name: "3宀�",
- year: "1941",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#6F8F5A",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "2",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- id: "3",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- id: "4",
- },
- {
- color: "#B9A587",
- showDetail: false,
- name: "鐜嬫案鐐�",
- id: "5",
- },
- ],
- name: "4宀�",
- year: "1941",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- {
- list: [
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#87A7B9",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- {
- color: "#CB9D9D",
- showDetail: false,
- name: "鐜嬫案鐐�",
- year: "1937",
- id: "1",
- },
- ],
- name: "5宀�",
- year: "1942",
- },
- ],
+ contentList: [],
+ currentYear: null,
+ showList: false,
+ colorList: {
+ journal: "#87a7b9",
+ books: "#c48787",
+ video: "#6f8f5a",
+ audio: "#b9a587",
+ newspaper: "#8d77b3",
+ other: "#009f9f",
+ },
+ popupStyle: {
+ left: "0",
+ top: "0",
+ },
};
},
+ mounted() {
+ this.getListData();
+ },
+
methods: {
- gotoDetail(item) {},
- showDetail(index, cindex, type) {
+ showYearWindow(item, event) {
+ console.log(item, "item");
for (let i = 0; i < this.contentList.length; i++) {
const item = this.contentList[i];
- for (let j = 0; j < item.list.length; j++) {
- const citem = item.list[j];
- this.$set(citem, "showDetail", false);
+ this.$set(item, "showDetail", false);
+ }
+ this.contentList[item].showDetail = true;
+ },
+ closeYearWindow(item) {
+ for (let i = 0; i < this.contentList.length; i++) {
+ const item = this.contentList[i];
+ this.$set(item, "showDetail", false);
+ }
+ },
+ gotoDetail(item) {},
+ getListData() {
+ this.MG.resource
+ .getItem({
+ path: "WYY_chronology",
+ fields: {
+ year: [],
+ age: [],
+ eventOverview: [],
+ eventPictures: [],
+ },
+ paging: {
+ start: 0,
+ size: 999,
+ },
+ })
+ .then(async (res) => {
+ for (let i = 0; i < res.datas.length; i++) {
+ const item = res.datas[i];
+ this.$set(item, "showDetail", false);
+ const listData = await this.getYearResource(item);
+ if (listData.length > 0) {
+ this.$set(item, "list", listData);
+ for (let j = 0; j < listData.length; j++) {
+ const element = listData[j];
+ this.$set(element, "showChildDetail", false);
+ }
+ }
+ }
+ this.contentList = res.datas;
+ this.showList = true;
+ });
+ },
+
+ async getYearResource(item) {
+ const endDate = item.year.split("/")[0] + "/12/31 23:59:59";
+ const startDate = item.year.split("/")[0] + "/01/01 00:00:00";
+ const yearDataList = await this.MG.resource.getItem({
+ path: "*",
+ queryType: "*",
+ fields: {
+ "year>=": startDate,
+ "year<=": endDate,
+ source: [],
+ IssueNumber: [],
+ author: [],
+ authorsUnits: [],
+ abstract: [],
+ keyWords: [],
+ subjectAffiliation: [],
+ file: [],
+ },
+ SysType: "CmsItem",
+ paging: {
+ start: 0,
+ size: 999,
+ },
+ });
+ const filterList = yearDataList.datas.filter((item) => {
+ return item.cmsItemType != "chronology" && item.cmsItemType != "AWARD";
+ });
+
+ if (filterList && filterList.length > 0) {
+ for (let i = 0; i < filterList.length; i++) {
+ const item = filterList[i];
+ if (item.file) {
+ const requestCtx = await this.getResourcePath(item.file);
+ this.$set(item, "fileLink", requestCtx);
+ }
+ this.$set(item, "showDetail", false);
+ this.$set(item, "color", this.colorList[item.cmsItemType]);
}
}
- if (type == 1) {
- this.contentList[index].list[cindex].showDetail = true;
- } else {
- this.contentList[index].list[cindex].showDetail = false;
+
+ if (filterList.length > 0) {
+ console.log(filterList, "filterList");
}
+ return filterList;
+ },
+
+ // 鑾峰彇闃块噷浜戝姞閫熷湴鍧� (瑙嗛锛岄煶棰�)
+ async getResourcePath(md5) {
+ try {
+ // 濡傛灉杩斿洖鐨勬暟鎹负绌烘垨鏈畾涔夛紝鍒欐嫾鎺ラ粯璁や笅杞借矾寰�
+ return requestCtx + "/file/api/ApiDownload?md5=" + md5;
+ } catch (error) {
+ // 鎹曡幏寮傚父骞舵墦鍗伴敊璇棩蹇�
+ console.error("鑾峰彇璧勬簮璺緞澶辫触:", error);
+ // 杩斿洖涓�涓粯璁ゅ�兼垨鎶涘嚭閿欒锛堟牴鎹笟鍔￠渶姹傦級
+ return requestCtx + "/file/api/ApiDownload?md5=" + md5;
+ }
+ },
+
+ closeDetail(index, cindex, type) {
+ for (let i = 0; i < this.contentList.length; i++) {
+ const item = this.contentList[i];
+ if (item && item.list?.length > 0) {
+ for (let j = 0; j < item.list.length; j++) {
+ const citem = item.list[j];
+ this.$set(citem, "showChildDetail", false);
+ }
+ }
+ }
+ this.contentList[index].list[cindex].showDetail = false;
+ },
+ showDetail(index, cindex, type, event) {
+ const rect = event.target.getBoundingClientRect();
+ const screenWidth = window.innerWidth;
+ const popupWidth = 542; // 鍋囪寮规瀹藉害涓�200px
+ // 鍒ゆ柇瑙﹀彂鍏冪礌浣嶇疆
+ if (rect.left + rect.width / 2 < screenWidth / 2) {
+ // 宸︿晶鏄剧ず寮规鍦ㄥ彸渚�
+ this.popupStyle = {
+ left: `${rect.right}px`,
+ top: `${rect.bottom - 150}px`,
+ };
+ } else {
+ // 鍙充晶鏄剧ず寮规鍦ㄥ乏渚�
+ this.popupStyle = {
+ left: `${rect.left - popupWidth}px`,
+ top: `${rect.bottom - 150}px`,
+ };
+ }
+ console.log(this.popupStyle.top, "this.top");
+ console.log(this.popupStyle.left, "this.left");
+ // if (rect.left - popupWidth < 0) {
+ // // 宸︿晶绌洪棿涓嶈冻鏃跺己鍒跺彸渚ф樉绀�
+ // this.popupStyle.left = `${rect.right}px`;
+ // } else if (rect.right + popupWidth > screenWidth) {
+ // // 鍙充晶绌洪棿涓嶈冻鏃跺己鍒跺乏渚ф樉绀�
+ // this.popupStyle.left = `${rect.left - popupWidth}px`;
+ // }
+
+ console.log(event, "event");
+ for (let i = 0; i < this.contentList.length; i++) {
+ const item = this.contentList[i];
+ if (item && item.list?.length > 0) {
+ for (let j = 0; j < item.list.length; j++) {
+ const citem = item.list[j];
+ if (citem.showChildDetail) {
+ this.contentList[i].list[j].showDetail = false;
+ citem.showChildDetail = false;
+ }
+ }
+ }
+ }
+
+ if (this.contentList[index].list[cindex].type) {
+ this.contentList[index].list[cindex].showChildDetail = true;
+ }
+ console.log(
+ this.contentList[index].list,
+ "this.contentList[index].list[cindex]"
+ );
},
},
};
@@ -844,6 +311,7 @@
display: flex;
flex-direction: column;
overflow: auto;
+ font-family: Source Han Sans;
}
.pageBox {
@@ -873,6 +341,12 @@
display: flex;
align-items: end;
overflow: auto;
+
+ ::v-deep .el-loading-spinner .el-loading-text {
+ font-size: 14px;
+ color: #937950;
+ }
+
.chartsBox {
white-space: nowrap;
padding: 0 80px;
@@ -885,7 +359,7 @@
// }
/* 瀵逛簬WebKit娴忚鍣ㄥ拰Blink寮曟搸锛堝Chrome, Opera锛� */
::-webkit-scrollbar {
- width: 16px; /* 婊氬姩鏉＄殑瀹藉害 */
+ width: 4px; /* 婊氬姩鏉＄殑瀹藉害 */
height: 16px; /* 婊氬姩鏉＄殑楂樺害 */
}
@@ -895,7 +369,8 @@
::-webkit-scrollbar-thumb {
background: #b9a587; /* 婊氬姩鏉℃粦鍧楃殑棰滆壊 */
- border-radius: 16px; /* 婊氬姩鏉℃粦鍧楃殑鍦嗚 */
+ border-radius: 2px; /* 婊氬姩鏉℃粦鍧楃殑鍦嗚 */
+ width: 4px;
}
::-webkit-scrollbar-thumb:hover {
@@ -904,14 +379,14 @@
}
}
.page-header {
- height: 102px;
+ height: 9.4%;
width: 100%;
text-align: left;
margin-bottom: 8px;
border-bottom: 2px solid #937950;
p {
- padding: 35px 0 34px 0;
+ padding: 1.6% 0 1.55% 0;
font-family: Alimama DongFangDaKai;
font-size: 30px;
text-indent: 1em;
@@ -929,6 +404,7 @@
.chartsItem {
width: 100%;
height: 100%;
+ position: relative;
}
.item-grad {
@@ -945,6 +421,19 @@
cursor: pointer;
position: relative;
}
+.gradchild:hover {
+ // transform: scale(1.1);
+ width: 23px;
+ height: 23px;
+ cursor: pointer;
+ position: relative;
+}
+
+/* 閲嶇疆瀛愬厓绱犵殑鏍峰紡 */
+// .gradchild:hover .detailDialog {
+// transform: scale(1);
+// z-index: 999;
+// }
.item-circle {
width: 100%;
@@ -976,6 +465,11 @@
margin-left: -9px;
z-index: 99;
background: #fff;
+ cursor: pointer;
+}
+.item-circle:hover:before {
+ background-color: #b9a587;
+ border: 1px solid #8f7a5a;
}
.item-text {
@@ -987,11 +481,8 @@
align-items: center;
}
.detailDialog {
- position: absolute;
- // left: -54px;
- // bottom: 50px;
- top: -550%;
- width: 400px;
+ position: fixed;
+ width: 524px;
z-index: 9999;
cursor: pointer;
background: #fff;
@@ -999,13 +490,50 @@
box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.5);
}
-.detailDialog .dialogContent {
- width: 100%;
- height: 100%;
- background-color: #fff;
- position: relative;
- padding: 15px;
- z-index: 20;
- box-sizing: border-box;
+video {
+ border-radius: 10px;
+ border: 1px solid #dcdcdc;
+ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+}
+
+.yaerWindow {
+ position: absolute;
+ left: -54px;
+ bottom: 50px;
+ width: 700px;
+ z-index: 9999;
+ cursor: pointer;
+ background: #fff;
+ border: 2px solid #cbbeaa;
+ box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.5);
+}
+// .detailDialog .dialogContent {
+// width: 100%;
+// height: 100%;
+// background-color: #fff;
+// position: relative;
+// padding: 5px;
+// z-index: 20;
+// box-sizing: border-box;
+// }
+.closeBtn {
+ position: absolute;
+ width: 20px;
+ height: 20px;
+ top: 10px;
+ right: 5px;
+ z-index: 999;
+}
+
+::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