From 3af382c2b9ddf2a8210b6477bb46b0945ce26a64 Mon Sep 17 00:00:00 2001 From: YM <479443481@qq.com> Date: 星期五, 26 四月 2024 22:22:56 +0800 Subject: [PATCH] 调整 --- src/pages.json | 33 src/utils/request/req1.js | 3 src/pages/academicGenres/index.vue | 308 ++------ src/uni_modules/csr-tab/components/csr-tab/csr-tab.vue | 306 ++++---- src/utils/Crypto.js | 10 /dev/null | 303 -------- src/pages/academicGenres/chart.vue | 555 ++++++++++++++++ src/api/index.js | 12 src/pages/repository/repository.vue | 2 src/pages/zhongyi/zhongyi.vue | 5 src/static/initialize.css | 8 src/components/headNav/headNav.vue | 2 src/pages/academicGenres/detail.vue | 436 ++++++++++++ 13 files changed, 1,310 insertions(+), 673 deletions(-) diff --git a/src/api/index.js b/src/api/index.js index 5b46518..1d46bbf 100644 --- a/src/api/index.js +++ b/src/api/index.js @@ -1,6 +1,6 @@ import req from "@/utils/request/req1.js"; -import req1 from "@/utils/request/req1.js"; import qs from "querystring"; +import req1, { baseUrl } from "@/utils/request/req1"; // 娉ㄥ唽鐧诲綍 export const getaddLogin = (Obj) => { return req1({ @@ -241,6 +241,12 @@ }); }; +export const getIntroduction = (id) => { + return req1({ + url: "/school/introduction?id=" + id, + method: "post" + }); +}; // 鍖讳簨鍒跺害 // 鏁版嵁缁熻 @@ -286,3 +292,7 @@ }); }; // ---------------- + +export const getImg = (path) => { + return baseUrl + "/picture/getImageByFilePath?filePath=" + path; +}; diff --git a/src/components/headNav/headNav.vue b/src/components/headNav/headNav.vue index 7a8a35d..4ecbf60 100644 --- a/src/components/headNav/headNav.vue +++ b/src/components/headNav/headNav.vue @@ -163,7 +163,7 @@ bg1: { type: String, default() { - return "@/static/image/line.png"; + return "/static/image/line.png"; } }, idIndex: { diff --git a/src/pages.json b/src/pages.json index f919482..97f0ca2 100644 --- a/src/pages.json +++ b/src/pages.json @@ -30,22 +30,7 @@ "navigationStyle": "custom" } }, - { - "path": "pages/AcademicHistory/AcademicHistory", - "style": { - "navigationBarTitleText": "", - "enablePullDownRefresh": false, - "navigationStyle": "custom" - } - }, - { - "path": "pages/interchannel/interchannel", - "style": { - "navigationBarTitleText": "", - "enablePullDownRefresh": false, - "navigationStyle": "custom" - } - }, + // 鍖诲娴佹淳 { "path": "pages/academicGenres/index", "style": { @@ -55,6 +40,22 @@ } }, { + "path": "pages/academicGenres/detail", + "style": { + "navigationBarTitleText": "", + "enablePullDownRefresh": false, + "navigationStyle": "custom" + } + }, + { + "path": "pages/academicGenres/chart", + "style": { + "navigationBarTitleText": "", + "enablePullDownRefresh": false, + "navigationStyle": "custom" + } + }, + { "path": "pages/TcmSystem/TcmSystem", "style": { "navigationBarTitleText": "", diff --git a/src/pages/AcademicHistory/AcademicHistory.vue b/src/pages/AcademicHistory/AcademicHistory.vue deleted file mode 100644 index 27865e4..0000000 --- a/src/pages/AcademicHistory/AcademicHistory.vue +++ /dev/null @@ -1,433 +0,0 @@ -<template> - <view> - <!-- 椤堕儴瀵艰埅 --> - <headNav :idIndex="idIndex" text="鍘嗕唬瀛︽湳娴佹淳"/> - <view class="Midde flex"> - <!-- <view class="MiddeBack">杩斿洖</view> --> - <el-button class="MiddeBack flex flex-center" @click="goBack">杩斿洖</el-button> - <view class="flex flex-center flex-column"> - <view class="" style="font-weight: 900;margin-bottom:.2rem ;font-size: .26rem;line-height: 1;">娌抽棿鍥捐氨 - </view> - <ul class="flex Lists"> - <li @click="ListClick" style="background-color: #fff;color: #597AA5;"> - 鎾掑湴鏂� - </li> - <!-- /pages/AcademicHistory/AcademicHistory --> - <li style="background-color: #597AA5;color: #fff;"> - 鎾掑湴鏂� - </li> - </ul> - </view> - <view class=""></view> - </view> - <view class="flex flex-center" style="width: 100%; margin: .2rem 0;"> - <ul class="flex"> - <li style="" class="school1" v-for="(item,index) in dynasty" :key="item.id"> - <view class="flex flex-center font-family school" - style="font-weight: 500; border-radius: .3rem; padding: .06rem .15rem; color: #2C2C2C; font-size: .12rem; margin-top: .03rem;margin-right: .1rem;background-color: #fff;"> - <view class="" :style="{background:item.color}" - style="margin-right: .07rem; width: .12rem;height: .12rem;border-radius: 50%;"></view> - <view class="" style="color: #2C2C2C;font-size: .12rem;">{{item.name}}</view> - </view> - </li> - </ul> - </view> - <view class="Bottom"> - <view id="main" style="width: 100vw; height: 5rem;"></view> - </view> - </view> -</template> - -<script> - import * as echarts from 'echarts'; - export default { - data() { - return { - // 鏍囬椤堕儴鏍忛渶瑕佺殑涓滆タ - idIndex:0, - dynasty: [{ - name: '浠h〃浜虹墿', - color: '#597AA5', - id: 1 - }, { - name: '閲嶈鍖诲', - color: '#DA7A2B', - id: 2 - }, { - name: '鍏崇郴鏂囩尞', - color: '#9E9E9E', - id: 3 - }] - } - }, - onLoad(options) { - this.idIndex = options.id - console.log('optionsoptionsoptions',options.id); - }, - methods: { - goBack() { - // uuni.redirectTo(); - uni.redirectTo({ - url: '/pages/index/index' - }) - }, - ListClick() { - uni.navigateTo({ - url: '/pages/interchannel/interchannel?id='+this.idIndex - }) - }, - innt() { - this.$nextTick(() => { - // var chartDom = document.getElementById('main'); // 鑾峰彇HTML涓殑鍏冪礌锛屾澶勫亣璁炬湁涓�涓猧d涓�'main'鐨勫厓绱犱綔涓哄浘琛ㄥ鍣� - // var myChart = echarts.init(chartDom); // 鍒濆鍖杄charts瀹炰緥锛屽苟灏嗗叾涓庡浘琛ㄥ鍣ㄧ粦瀹� - // var option; // 瀹氫箟鍙橀噺option鏉ュ瓨鍌ㄥ浘琛ㄧ殑閰嶇疆椤� - - // option = { - // // title: { - // // text: 'Basic Graph' // 鍥捐〃鏍囬涓�'Basic Graph' - // // }, - // tooltip: {}, // 榧犳爣鎮仠鏃舵樉绀虹殑鎻愮ず妗� - // animationDurationUpdate: 1500, // 鏁版嵁鏇存柊鏃剁殑鍔ㄧ敾鏃堕暱 - // animationEasingUpdate: 'quinticInOut', // 鏁版嵁鏇存柊鏃剁殑鍔ㄧ敾鏁堟灉 - // series: [{ - // type: 'graph', // 鍥捐〃绫诲瀷涓�'graph' - // layout: 'none', // 鍥捐〃甯冨眬鏂瑰紡涓�'none'锛屽嵆鑺傜偣浣嶇疆鐢眡鍜寉鍧愭爣鎸囧畾 - // symbolSize: 150, // 鑺傜偣鐨勫ぇ灏� - // roam: false, // 鏄惁寮�鍚极娓革紝鍗冲彲浠ユ嫋鍔ㄥ拰缂╂斁鍥捐〃 - // label: { - // show: true, // 鏄惁鏄剧ず鑺傜偣涓婄殑鏍囩 - // textStyle: { - // fontSize: 32, // 璁剧疆瀛椾綋澶у皬涓�12 - // } - // }, - // edgeSymbol: ['circle', 'arrow'], // 杈圭殑璧峰鍜岀粨鏉熺澶存牱寮� - // edgeSymbolSize: [10, 10], // 杈圭殑璧峰鍜岀粨鏉熺澶村ぇ灏� - // edgeLabel: { - // fontSize: 40, // 杈圭殑鏍囩瀛椾綋澶у皬 - - // }, - // data: [{ - // name: '閲戝厓鍥涘ぇ瀹�', // 鑺傜偣1鐨勫悕绉� - // x: 1230, // 鑺傜偣1鐨剎鍧愭爣 - // y: 250, // 鑺傜偣1鐨剏鍧愭爣 - // itemStyle: { - // color: 'red', // 鑺傜偣1鐨勮儗鏅鑹� - // }, - // label: { - // color: 'black' // 鑺傜偣1鐨勫瓧浣撻鑹� - // } - // }, - // { - // name: '鍒樺畬绱�', // 鑺傜偣2鐨勫悕绉� - // x: 800, // 鑺傜偣2鐨剎鍧愭爣 - // y: 300 // 鑺傜偣2鐨剏鍧愭爣 - // }, - // { - // name: '鍌峰瘨鐩存牸', // 鑺傜偣3鐨勫悕绉� - // x: 550, // 鑺傜偣3鐨剎鍧愭爣 - // y: 360 // 鑺傜偣3鐨剏鍧愭爣 - // }, - // { - // name: '寮犱徊鏅�', // 鑺傜偣4鐨勫悕绉� - // x: 700, // 鑺傜偣4鐨剎鍧愭爣 - // y: 200 // 鑺傜偣4鐨剏鍧愭爣 - // }, - // { - // name: '涓夋秷璜�', // 鑺傜偣4鐨勫悕绉� - // x: 750, // 鑺傜偣4鐨剎鍧愭爣 - // y: 500 // 鑺傜偣4鐨剏鍧愭爣 - // }, - // ], - // links: [ // 杈圭殑杩炴帴鍏崇郴 - // { - // source: '閲戝厓鍥涘ぇ瀹�', // 杈圭殑璧峰鑺傜偣绱㈠紩涓�0锛屽嵆鑺傜偣1 - // target: '鍒樺畬绱�', // 杈圭殑缁撴潫鑺傜偣绱㈠紩涓�1锛屽嵆鑺傜偣2 - // symbolSize: [5, 20], // 杈圭殑璧峰鍜岀粨鏉熺澶村ぇ灏� - // label: { - // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 - // formatter: '鍖呭惈', - // }, - // lineStyle: { - // width: 5, // 杈圭殑瀹藉害 - // curveness: 0.2 // 杈圭殑鏇插害 - - // } - // }, - // { - // source: '鍒樺畬绱�', // 杈圭殑璧峰鑺傜偣涓�'Node 2' - // target: '鍌峰瘨鐩存牸', // 杈圭殑缁撴潫鑺傜偣涓�'Node 1' - // label: { - // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 - // formatter: '鍑虹増鐗�' - // }, - // lineStyle: { - // curveness: 0.2, // 杈圭殑鏇插害 - - // } - // }, - // { - // source: '鍒樺畬绱�', // 杈圭殑璧峰鑺傜偣涓�'Node 1' - // target: '寮犱徊鏅�', // 杈圭殑缁撴潫鑺傜偣涓�'Node 3' - // label: { - // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 - // formatter: '璇勮' - // }, - // lineStyle: { - // curveness: 0.2 // 杈圭殑鏇插害 - // } - // }, - // { - // source: '鍒樺畬绱�', // 杈圭殑璧峰鑺傜偣涓�'Node 2' - // target: '涓夋秷璜�', // 杈圭殑缁撴潫鑺傜偣涓�'Node 3' - // label: { - // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 - // formatter: '鍑虹増鐗�' - // }, - // lineStyle: { - // curveness: 0.2 // 杈圭殑鏇插害 - // } - // } - // ], - // lineStyle: { - // opacity: 0.9, // 杈圭殑閫忔槑搴� - // width: 2, // 杈圭殑瀹藉害 - // curveness: 0 // 杈圭殑鏇插害 - // }, - // textStyle: { - // fontSize: 14 // 璁剧疆鍏ㄥ眬鏂囧瓧鐨勫瓧浣撳ぇ灏� - // }, - // }] - // }; - - // option && myChart.setOption(option); // 灏嗛厤缃」搴旂敤浜庡浘琛ㄥ疄渚� - // console.log(myChart); - - var chartDom = document.getElementById('main'); - var myChart = echarts.init(chartDom); - // 鍋囪鎮ㄦ湁鑺傜偣鍚嶇О鍜屽畠浠箣闂寸殑鍏崇郴鏁版嵁 - var nodes = ['鍒樺畬绱�', '寮犱徊鏅�', '閲戝厓鍥涘ぇ瀹�', '涓夋秷璁�', '浼ゅ瘨鐩存牸']; - var relationships = [{ - source: '閲戝厓鍥涘ぇ瀹�', - target: '鍒樺畬绱�', - relation: '濮讳翰' - }, { - source: '鍒樺畬绱�', - target: '寮犱徊鏅�', - relation: '' - }, - { - source: '鍒樺畬绱�', - target: '浼ゅ瘨鐩存牸', - relation: '' - }, - { - source: '鍒樺畬绱�', - target: '涓夋秷璁�', - relation: '' - }, - // 鍏朵粬鍏崇郴... - ]; - - let FontSize = 12; // 瀛椾綋澶у皬 - let BorderWidth = 2; // 杈规澶у皬 - let SymbolSize = 80; // 灏哄璺濈 - let Distance = 10 - // 涓嶅悓灏哄涓嬩慨鏀筫charts鐨勫瓧浣� - if (window.innerWidth > 2560 && window.innerWidth <= 3840) { - FontSize = 28 - BorderWidth = 5 - SymbolSize = 100 - Distance = 33 - } else if (window.innerWidth > 1920 && window.innerWidth <= 2560) { - FontSize = 28 - BorderWidth = 4 - SymbolSize = 90 - Distance = 22 - } else if (window.innerWidth >= 1366 && window.innerWidth <= 1920) { - FontSize = 18 - BorderWidth = 4 - SymbolSize = 70 - Distance = 22 - } - // 鏍规嵁鍏崇郴鏁版嵁鐢熸垚杩炴帴绾� - var links = []; - relationships.forEach(function(relationship) { - // console.log(relationship,'relationship'); - var sourceIndex = nodes.indexOf(relationship.source); - var targetIndex = nodes.indexOf(relationship.target); - var linkObject = { - source: sourceIndex, - target: targetIndex - }; - if (relationship.relation !== '') { - linkObject.label = { - show: true, - formatter: function(params) { - return relationship.relation; - }, - color: '#2C2C2C', - fontSize: FontSize - 2, - backgroundColor: 'rgba(255, 255, 255, 1)', - padding: [11, 20], - borderRadius:300, - position: 'middle', - z: 10, - distance: -(Distance + 1), - } - } - links.push(linkObject); - // if (sourceIndex !== -1 && targetIndex !== -1) { - // links.push({ - // source: sourceIndex, - // target: targetIndex, - // label: { - // show: true, - // formatter: function(params) { // 浣跨敤鍑芥暟鍔ㄦ�佺敓鎴愭爣绛惧唴瀹� - // // console.log(params.data, 'aaaaaaaaaaaa'); - // return relationships.find(rel => rel.source === nodes[ - // params.data - // .source] && rel.target === nodes[params - // .data.target]) - // .relation; - // }, // 璁剧疆鍏崇郴鏍囩鍐呭涓�"Child-Parent" - // color: '#2C2C2C', - // fontSize: FontSize - 2, - // backgroundColor: 'rgba(255, 255, 255, 1)', - // padding: [11, 20], - // position: 'middle', // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず - // // bottom: -(FontSize+10), - // z: 10, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 - // // offset: [0, 15] ,// 寰�涓嬬Щ鍔� 10 鍍忕礌 - // distance: -(Distance + 1), // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 - // } - // }); - // } - }); - // 鏍规嵁nodes鍔ㄦ�佺敓鎴愯妭鐐规暟鎹� - var nodeData = nodes.map(function(node, index) { - return { - name: node, - x: Math.random() * 1000, // 璁剧疆闅忔満x鍧愭爣浣嶇疆 - y: Math.random() * 600, // 璁剧疆闅忔満y鍧愭爣浣嶇疆 - itemStyle: { - color: getColorByIndex(index), // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� - borderWidth: BorderWidth + 3, - borderColor: getColorByIndex(index + 1), - borderRadius: 30, - }, - symbolSize: SymbolSize + 50 - }; - }); - // 璁剧疆棰滆壊 - function getColorByIndex(index) { - var colors = ['#ecf4ff', '#dd9795', '#f1edbe', '#ecf4ff', '#c5dbd8']; // 鍙互鏍规嵁瀹為檯鎯呭喌璁剧疆棰滆壊鏁扮粍 - return colors[index % colors.length]; - } - var option; - option = { - backgroundColor: { - type: 'image', - image: '/static/image/characterRelationBg.png', - repeat: 'repeat-x', // 鏄惁骞抽摵锛屽彲浠ユ槸 'repeat-x', 'repeat-y', 'no-repeat' - size: '100% 100%', // 鑳屾櫙鍥剧墖鐨勫昂瀵革紝鍙互鏄櫨鍒嗘瘮鎴栬�呭儚绱� - position: 'center center' // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮 - }, - tooltip: {}, - animationDurationUpdate: 1500, - animationEasingUpdate: 'quinticInOut', - series: [{ - type: 'graph', - layout: 'none', - symbolSize: SymbolSize, // 璋冩暣鑺傜偣澶у皬 - label: { - show: true, - color: 'black', // 璁剧疆鑺傜偣鏂囧瓧棰滆壊涓洪粦鑹� - fontSize: FontSize, // 璁剧疆鏂囧瓧澶у皬 - }, - // edgeSymbol: ['circle'], - // edgeSymbolSize: [4, 10], - edgeSymbol: ['circle', 'arrow'], // 杈圭殑璧峰鍜岀粨鏉熺澶存牱寮� - edgeSymbolSize: [20, 20], // 杈圭殑璧峰鍜岀粨鏉熺澶村ぇ灏� - data: nodeData, - links: links, - lineStyle: { - opacity: 0.9, - width: 2, - curveness: 0.3 - } - }] - }; - - // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓� - option.series[0].links = links; - option && myChart.setOption(option); - }) - } - }, - mounted() { - this.innt() - } - } -</script> - -<style scoped> - view { - color: #fff; - } - - .NavTop { - background-color: #0c274c; - padding: 25rpx; - - img { - width: 30rpx; - height: 30rpx; - vertical-align: middle; - } - - .NavTopr { - img { - margin-right: 10rpx; - } - } - } - - - .Midde { - /* background-color: #d1d6dc; */ - background-image: url(@/static/image/瀛︽淳Bg.png); - background-size: 100% 100%; - color: #000; - padding: .18rem .23rem 0; - align-items: flex-start; - height: 1.43rem; - - view { - - color: #000; - } - - .MiddeBack { - width: 0.6rem; - height: 0.24rem; - font-size: .12rem; - padding: 0; - - } - - .Lists { - li { - width: 0.96rem; - height: .3rem; - border: 1px solid #597AA5; - line-height: .3rem; - text-align: center; - font-size: .14rem; - } - } - } - - .school1 { - margin: 0 .2rem; - } -</style> \ No newline at end of file diff --git a/src/pages/academicGenres/chart.vue b/src/pages/academicGenres/chart.vue new file mode 100644 index 0000000..c11e650 --- /dev/null +++ b/src/pages/academicGenres/chart.vue @@ -0,0 +1,555 @@ +<template> + <view> + <!-- 椤堕儴瀵艰埅 --> + <headNav :idIndex="3" text="鍘嗕唬瀛︽湳娴佹淳" /> + <view class="Midde flex"> + <!-- <view class="MiddeBack">杩斿洖</view> --> + <el-button class="MiddeBack flex flex-center" @click="goBack" + >杩斿洖</el-button + > + <view class="flex flex-center flex-column"> + <view + class="" + style=" + font-weight: 900; + margin-bottom: 0.2rem; + font-size: 0.26rem; + line-height: 1; + " + >{{ detailData.name }} + </view> + <ul class="flex Lists"> + <li + @click="ListClick" + style="background-color: #fff; color: #597aa5; cursor: pointer" + > + 瀛︽淳浠嬬粛 + </li> + <li style="background-color: #597aa5; color: #fff; cursor: pointer"> + 瀛︽淳鍥捐氨 + </li> + </ul> + </view> + </view> + <view class="flex flex-center" style="width: 100%; margin: 0.2rem 0"> + <ul class="flex"> + <li + class="school1" + v-for="(item, index) in dynasty" + :key="item.id" + > + <view + class="flex flex-center font-family school" + style=" + font-weight: 500; + border-radius: 0.3rem; + padding: 0.06rem 0.15rem; + color: #2c2c2c; + font-size: 0.12rem; + margin-top: 0.03rem; + margin-right: 0.1rem; + background-color: #fff; + " + > + <view + class="" + :style="{ background: item.color }" + style=" + margin-right: 0.07rem; + width: 0.12rem; + height: 0.12rem; + border-radius: 50%; + " + ></view> + <view class="" style="color: #2c2c2c; font-size: 0.12rem">{{ + item.name + }}</view> + </view> + </li> + </ul> + </view> + <view class="Bottom"> + <view id="main" style="width: 100vw; height: 5rem"></view> + </view> + </view> +</template> + +<script> +import { getIntroduction } from "@/api/index.js"; +import * as echarts from "echarts"; +export default { + data() { + return { + // 鏍囬椤堕儴鏍忛渶瑕佺殑涓滆タ + idIndex: 0, + dynasty: [ + { + name: "浠h〃浜虹墿", + color: "#597AA5", + id: 1 + }, + { + name: "閲嶈鍖诲", + color: "#DA7A2B", + id: 2 + }, + { + name: "鍏崇郴鏂囩尞", + color: "#9E9E9E", + id: 3 + } + ] + }; + }, + onLoad(options) { + this.idIndex = options.id; + this.getData(); + }, + methods: { + getData() { + getIntroduction(Number(this.idIndex)).then((res) => { + this.detailData = { + name: res.object.school_NAME[0].content, + icon: + res.object.pictureList && res.object.pictureList.length > 0 + ? getImg(res.object.pictureList[0].filePath) + : "", + character: res.object.important_PEOPLE + ? res.object.important_PEOPLE + .map((item) => item.content2) + .join("銆�") + : "", + skilledDoctor: res.object.important_PHYSICIAN + ? res.object.important_PHYSICIAN + .map((item) => item.content2) + .join("銆�") + : "", + works: res.object.important_WORK + ? res.object.important_WORK.map((item) => item.content).join("銆�") + : "", + thought: res.object.school_THOUGHT + ? res.object.school_THOUGHT.map((item) => item.content).join("銆�") + : "", + source: res.object.bookList + ? res.object.bookList.map((item) => item.name).join("銆�") + : "", + brief: res.object.school_INTRODUCTION + ? res.object.school_INTRODUCTION.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [], + develop: res.object.school_DEVELOPMENT + ? res.object.school_DEVELOPMENT.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [], + achievement: res.object.achievement_INFLUENCE + ? res.object.achievement_INFLUENCE.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [], + literature: res.object.related_LITERATURE + ? res.object.related_LITERATURE.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [] + }; + console.log(this.detailData); + }); + }, + goBack() { + this.$router.go(-1); + }, + ListClick() { + uni.navigateTo({ + url: "/pages/academicGenres/detail?id=" + this.idIndex + }); + }, + innt() { + this.$nextTick(() => { + // var chartDom = document.getElementById('main'); // 鑾峰彇HTML涓殑鍏冪礌锛屾澶勫亣璁炬湁涓�涓猧d涓�'main'鐨勫厓绱犱綔涓哄浘琛ㄥ鍣� + // var myChart = echarts.init(chartDom); // 鍒濆鍖杄charts瀹炰緥锛屽苟灏嗗叾涓庡浘琛ㄥ鍣ㄧ粦瀹� + // var option; // 瀹氫箟鍙橀噺option鏉ュ瓨鍌ㄥ浘琛ㄧ殑閰嶇疆椤� + + // option = { + // // title: { + // // text: 'Basic Graph' // 鍥捐〃鏍囬涓�'Basic Graph' + // // }, + // tooltip: {}, // 榧犳爣鎮仠鏃舵樉绀虹殑鎻愮ず妗� + // animationDurationUpdate: 1500, // 鏁版嵁鏇存柊鏃剁殑鍔ㄧ敾鏃堕暱 + // animationEasingUpdate: 'quinticInOut', // 鏁版嵁鏇存柊鏃剁殑鍔ㄧ敾鏁堟灉 + // series: [{ + // type: 'graph', // 鍥捐〃绫诲瀷涓�'graph' + // layout: 'none', // 鍥捐〃甯冨眬鏂瑰紡涓�'none'锛屽嵆鑺傜偣浣嶇疆鐢眡鍜寉鍧愭爣鎸囧畾 + // symbolSize: 150, // 鑺傜偣鐨勫ぇ灏� + // roam: false, // 鏄惁寮�鍚极娓革紝鍗冲彲浠ユ嫋鍔ㄥ拰缂╂斁鍥捐〃 + // label: { + // show: true, // 鏄惁鏄剧ず鑺傜偣涓婄殑鏍囩 + // textStyle: { + // fontSize: 32, // 璁剧疆瀛椾綋澶у皬涓�12 + // } + // }, + // edgeSymbol: ['circle', 'arrow'], // 杈圭殑璧峰鍜岀粨鏉熺澶存牱寮� + // edgeSymbolSize: [10, 10], // 杈圭殑璧峰鍜岀粨鏉熺澶村ぇ灏� + // edgeLabel: { + // fontSize: 40, // 杈圭殑鏍囩瀛椾綋澶у皬 + + // }, + // data: [{ + // name: '閲戝厓鍥涘ぇ瀹�', // 鑺傜偣1鐨勫悕绉� + // x: 1230, // 鑺傜偣1鐨剎鍧愭爣 + // y: 250, // 鑺傜偣1鐨剏鍧愭爣 + // itemStyle: { + // color: 'red', // 鑺傜偣1鐨勮儗鏅鑹� + // }, + // label: { + // color: 'black' // 鑺傜偣1鐨勫瓧浣撻鑹� + // } + // }, + // { + // name: '鍒樺畬绱�', // 鑺傜偣2鐨勫悕绉� + // x: 800, // 鑺傜偣2鐨剎鍧愭爣 + // y: 300 // 鑺傜偣2鐨剏鍧愭爣 + // }, + // { + // name: '鍌峰瘨鐩存牸', // 鑺傜偣3鐨勫悕绉� + // x: 550, // 鑺傜偣3鐨剎鍧愭爣 + // y: 360 // 鑺傜偣3鐨剏鍧愭爣 + // }, + // { + // name: '寮犱徊鏅�', // 鑺傜偣4鐨勫悕绉� + // x: 700, // 鑺傜偣4鐨剎鍧愭爣 + // y: 200 // 鑺傜偣4鐨剏鍧愭爣 + // }, + // { + // name: '涓夋秷璜�', // 鑺傜偣4鐨勫悕绉� + // x: 750, // 鑺傜偣4鐨剎鍧愭爣 + // y: 500 // 鑺傜偣4鐨剏鍧愭爣 + // }, + // ], + // links: [ // 杈圭殑杩炴帴鍏崇郴 + // { + // source: '閲戝厓鍥涘ぇ瀹�', // 杈圭殑璧峰鑺傜偣绱㈠紩涓�0锛屽嵆鑺傜偣1 + // target: '鍒樺畬绱�', // 杈圭殑缁撴潫鑺傜偣绱㈠紩涓�1锛屽嵆鑺傜偣2 + // symbolSize: [5, 20], // 杈圭殑璧峰鍜岀粨鏉熺澶村ぇ灏� + // label: { + // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 + // formatter: '鍖呭惈', + // }, + // lineStyle: { + // width: 5, // 杈圭殑瀹藉害 + // curveness: 0.2 // 杈圭殑鏇插害 + + // } + // }, + // { + // source: '鍒樺畬绱�', // 杈圭殑璧峰鑺傜偣涓�'Node 2' + // target: '鍌峰瘨鐩存牸', // 杈圭殑缁撴潫鑺傜偣涓�'Node 1' + // label: { + // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 + // formatter: '鍑虹増鐗�' + // }, + // lineStyle: { + // curveness: 0.2, // 杈圭殑鏇插害 + + // } + // }, + // { + // source: '鍒樺畬绱�', // 杈圭殑璧峰鑺傜偣涓�'Node 1' + // target: '寮犱徊鏅�', // 杈圭殑缁撴潫鑺傜偣涓�'Node 3' + // label: { + // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 + // formatter: '璇勮' + // }, + // lineStyle: { + // curveness: 0.2 // 杈圭殑鏇插害 + // } + // }, + // { + // source: '鍒樺畬绱�', // 杈圭殑璧峰鑺傜偣涓�'Node 2' + // target: '涓夋秷璜�', // 杈圭殑缁撴潫鑺傜偣涓�'Node 3' + // label: { + // show: true, // 鏄惁鏄剧ず杈圭殑鏍囩 + // formatter: '鍑虹増鐗�' + // }, + // lineStyle: { + // curveness: 0.2 // 杈圭殑鏇插害 + // } + // } + // ], + // lineStyle: { + // opacity: 0.9, // 杈圭殑閫忔槑搴� + // width: 2, // 杈圭殑瀹藉害 + // curveness: 0 // 杈圭殑鏇插害 + // }, + // textStyle: { + // fontSize: 14 // 璁剧疆鍏ㄥ眬鏂囧瓧鐨勫瓧浣撳ぇ灏� + // }, + // }] + // }; + + // option && myChart.setOption(option); // 灏嗛厤缃」搴旂敤浜庡浘琛ㄥ疄渚� + // console.log(myChart); + + var chartDom = document.getElementById("main"); + var myChart = echarts.init(chartDom); + // 鍋囪鎮ㄦ湁鑺傜偣鍚嶇О鍜屽畠浠箣闂寸殑鍏崇郴鏁版嵁 + var nodes = ["鍒樺畬绱�", "寮犱徊鏅�", "閲戝厓鍥涘ぇ瀹�", "涓夋秷璁�", "浼ゅ瘨鐩存牸"]; + var relationships = [ + { + source: "閲戝厓鍥涘ぇ瀹�", + target: "鍒樺畬绱�", + relation: "濮讳翰" + }, + { + source: "鍒樺畬绱�", + target: "寮犱徊鏅�", + relation: "" + }, + { + source: "鍒樺畬绱�", + target: "浼ゅ瘨鐩存牸", + relation: "" + }, + { + source: "鍒樺畬绱�", + target: "涓夋秷璁�", + relation: "" + } + // 鍏朵粬鍏崇郴... + ]; + + let FontSize = 12; // 瀛椾綋澶у皬 + let BorderWidth = 2; // 杈规澶у皬 + let SymbolSize = 80; // 灏哄璺濈 + let Distance = 10; + // 涓嶅悓灏哄涓嬩慨鏀筫charts鐨勫瓧浣� + if (window.innerWidth > 2560 && window.innerWidth <= 3840) { + FontSize = 28; + BorderWidth = 5; + SymbolSize = 100; + Distance = 33; + } else if (window.innerWidth > 1920 && window.innerWidth <= 2560) { + FontSize = 28; + BorderWidth = 4; + SymbolSize = 90; + Distance = 22; + } else if (window.innerWidth >= 1366 && window.innerWidth <= 1920) { + FontSize = 18; + BorderWidth = 4; + SymbolSize = 70; + Distance = 22; + } + // 鏍规嵁鍏崇郴鏁版嵁鐢熸垚杩炴帴绾� + var links = []; + relationships.forEach(function (relationship) { + // console.log(relationship,'relationship'); + var sourceIndex = nodes.indexOf(relationship.source); + var targetIndex = nodes.indexOf(relationship.target); + var linkObject = { + source: sourceIndex, + target: targetIndex + }; + if (relationship.relation !== "") { + linkObject.label = { + show: true, + formatter: function (params) { + return relationship.relation; + }, + color: "#2C2C2C", + fontSize: FontSize - 2, + backgroundColor: "rgba(255, 255, 255, 1)", + padding: [11, 20], + borderRadius: 300, + position: "middle", + z: 10, + distance: -(Distance + 1) + }; + } + links.push(linkObject); + // if (sourceIndex !== -1 && targetIndex !== -1) { + // links.push({ + // source: sourceIndex, + // target: targetIndex, + // label: { + // show: true, + // formatter: function(params) { // 浣跨敤鍑芥暟鍔ㄦ�佺敓鎴愭爣绛惧唴瀹� + // // console.log(params.data, 'aaaaaaaaaaaa'); + // return relationships.find(rel => rel.source === nodes[ + // params.data + // .source] && rel.target === nodes[params + // .data.target]) + // .relation; + // }, // 璁剧疆鍏崇郴鏍囩鍐呭涓�"Child-Parent" + // color: '#2C2C2C', + // fontSize: FontSize - 2, + // backgroundColor: 'rgba(255, 255, 255, 1)', + // padding: [11, 20], + // position: 'middle', // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず + // // bottom: -(FontSize+10), + // z: 10, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 + // // offset: [0, 15] ,// 寰�涓嬬Щ鍔� 10 鍍忕礌 + // distance: -(Distance + 1), // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + // } + // }); + // } + }); + // 鏍规嵁nodes鍔ㄦ�佺敓鎴愯妭鐐规暟鎹� + var nodeData = nodes.map(function (node, index) { + return { + name: node, + x: Math.random() * 1000, // 璁剧疆闅忔満x鍧愭爣浣嶇疆 + y: Math.random() * 600, // 璁剧疆闅忔満y鍧愭爣浣嶇疆 + itemStyle: { + color: getColorByIndex(index), // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� + borderWidth: BorderWidth + 3, + borderColor: getColorByIndex(index + 1), + borderRadius: 30 + }, + symbolSize: SymbolSize + 50 + }; + }); + // 璁剧疆棰滆壊 + function getColorByIndex(index) { + var colors = ["#ecf4ff", "#dd9795", "#f1edbe", "#ecf4ff", "#c5dbd8"]; // 鍙互鏍规嵁瀹為檯鎯呭喌璁剧疆棰滆壊鏁扮粍 + return colors[index % colors.length]; + } + var option; + option = { + backgroundColor: { + type: "image", + image: "/static/image/characterRelationBg.png", + repeat: "repeat-x", // 鏄惁骞抽摵锛屽彲浠ユ槸 'repeat-x', 'repeat-y', 'no-repeat' + size: "100% 100%", // 鑳屾櫙鍥剧墖鐨勫昂瀵革紝鍙互鏄櫨鍒嗘瘮鎴栬�呭儚绱� + position: "center center" // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮 + }, + tooltip: {}, + animationDurationUpdate: 1500, + animationEasingUpdate: "quinticInOut", + series: [ + { + type: "graph", + layout: "none", + symbolSize: SymbolSize, // 璋冩暣鑺傜偣澶у皬 + label: { + show: true, + color: "black", // 璁剧疆鑺傜偣鏂囧瓧棰滆壊涓洪粦鑹� + fontSize: FontSize // 璁剧疆鏂囧瓧澶у皬 + }, + // edgeSymbol: ['circle'], + // edgeSymbolSize: [4, 10], + edgeSymbol: ["circle", "arrow"], // 杈圭殑璧峰鍜岀粨鏉熺澶存牱寮� + edgeSymbolSize: [20, 20], // 杈圭殑璧峰鍜岀粨鏉熺澶村ぇ灏� + data: nodeData, + links: links, + lineStyle: { + opacity: 0.9, + width: 2, + curveness: 0.3 + } + } + ] + }; + + // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓� + option.series[0].links = links; + option && myChart.setOption(option); + }); + } + }, + mounted() { + this.innt(); + } +}; +</script> + +<style scoped> +view { + color: #fff; +} + +.NavTop { + background-color: #0c274c; + padding: 25rpx; + + img { + width: 30rpx; + height: 30rpx; + vertical-align: middle; + } + + .NavTopr { + img { + margin-right: 10rpx; + } + } +} + +.Midde { + /* background-color: #d1d6dc; */ + background-image: url(@/static/image/瀛︽淳Bg.png); + background-size: 100% 100%; + color: #000; + padding: 0.18rem 0.23rem 0; + align-items: flex-start; + height: 1.43rem; + + view { + color: #000; + } + + .MiddeBack { + width: 0.6rem; + height: 0.24rem; + font-size: 0.12rem; + padding: 0; + } + + .Lists { + li { + width: 0.96rem; + height: 0.3rem; + border: 1px solid #597aa5; + line-height: 0.3rem; + text-align: center; + font-size: 0.14rem; + } + } +} + +.school1 { + margin: 0 0.2rem; +} +</style> diff --git a/src/pages/academicGenres/detail.vue b/src/pages/academicGenres/detail.vue new file mode 100644 index 0000000..16e896e --- /dev/null +++ b/src/pages/academicGenres/detail.vue @@ -0,0 +1,436 @@ +<template> + <view class="bag"> + <!-- 椤堕儴瀵艰埅 --> + <headNav idIndex="3" text="鍘嗕唬瀛︽湳娴佹淳" /> + <view class="Midde flex"> + <!-- <view class="MiddeBack">杩斿洖</view> --> + <el-button class="MiddeBack flex flex-center" @click="goBack" + >杩斿洖</el-button + > + <view class="flex flex-center flex-column"> + <view + class="" + style=" + font-weight: 900; + margin-bottom: 0.2rem; + font-size: 0.26rem; + line-height: 1; + " + >{{ detailData.name }} + </view> + <ul class="flex Lists"> + <li style="background-color: #597aa5; color: #fff;cursor: pointer;">瀛︽淳浠嬬粛</li> + <li @click="ListClick" style="background-color: #fff; color: #597aa5;cursor: pointer;"> + 瀛︽淳鍥捐氨 + </li> + </ul> + </view> + <view class=""></view> + </view> + <view class="Bottom"> + <view class="Bottom_top flex"> + <view class="BBimage"> + <view class="imgBox"> + <img :src="detailData.icon" /> + </view> + </view> + <view class="author"> + <ul> + <li>浠h〃鎬т汉鐗╋細 {{ detailData.character || "-" }}</li> + <li>閲嶈鍖诲锛� {{ detailData.skilledDoctor || "-" }}</li> + <li>浠h〃鎬ц憲浣滐細 {{ detailData.works || "-" }}</li> + <li>瀛︽淳鎬濇兂锛� {{ detailData.thought || "-" }}</li> + <li>鏉ユ簮锛� {{ detailData.source || "-" }}</li> + </ul> + </view> + </view> + <view class="Bottom_Bot" style="color: #d1d1d1"> + <view class="flex flex-center csrTab1"> + <csr-tab + class="csrTab" + :value.sync="swiperIndex" + :tabList="tabSwiperList" + ></csr-tab> + </view> + <view + v-if="swiperIndex == 0" + class="swiperList" + style="background-color: #ffffff; text-align: left; color: #000" + > + <view + v-for="(briefItem, briefIndex) in detailData.brief" + :key="briefIndex" + style="margin-bottom: 0.4rem" + > + <view style="color: #333">{{ briefItem.content }}</view> + <view + style="text-align: right; color: #9c9c9c; margin-top: 0.1rem" + >{{ briefItem.source }}</view + > + </view> + </view> + <view + v-if="swiperIndex == 1" + class="swiperList" + style="background-color: #ffffff; text-align: left; color: #000" + > + <view + v-for="(briefItem, briefIndex) in detailData.develop" + :key="briefIndex" + style="margin-bottom: 0.4rem" + > + <view style="color: #333">{{ briefItem.content }}</view> + <view + style="text-align: right; color: #9c9c9c; margin-top: 0.1rem" + >{{ briefItem.source }}</view + > + </view> + </view> + <view + v-if="swiperIndex == 2" + class="swiperList" + style="background-color: #ffffff; text-align: left; color: #000" + > + <view + v-for="(briefItem, briefIndex) in detailData.achievement" + :key="briefIndex" + style="margin-bottom: 0.4rem" + > + <view style="color: #333">{{ briefItem.content }}</view> + <view + style="text-align: right; color: #9c9c9c; margin-top: 0.1rem" + >{{ briefItem.source }}</view + > + </view> + </view> + <view + v-if="swiperIndex == 3" + class="swiperList" + style="background-color: #ffffff; text-align: left; color: #000" + > + <view + v-for="(briefItem, briefIndex) in detailData.literature" + :key="briefIndex" + style="margin-bottom: 0.4rem" + > + <view style="color: #333">{{ briefItem.content }}</view> + <view + style="text-align: right; color: #9c9c9c; margin-top: 0.1rem" + >{{ briefItem.source }}</view + > + </view> + </view> + </view> + </view> + </view> +</template> + +<script> +import { getIntroduction, getImg } from "@/api/index.js"; +export default { + data() { + return { + // 鏍囬椤堕儴鏍忛渶瑕佺殑涓滆タ + idIndex: 0, + swiperIndex: 0, + detailData: {}, + tabSwiperList: [ + { + TabControl: `瀛︽淳姒傝` + }, + { + TabControl: `瀛︽淳鍙戝睍` + }, + { + TabControl: `鎴愬氨褰卞搷` + }, + { + TabControl: `鐩稿叧鏂囩尞` + } + ], + secretary: [ + { + id: 1, + name: "骞呭害钀ㄨ姮", + istrue: false + }, + { + id: 2, + name: "骞呭害s钀ㄨ姮", + istrue: false + } + ] + }; + }, + onLoad(options) { + this.idIndex = options.id; + this.getData(); + }, + methods: { + getData() { + getIntroduction(Number(this.idIndex)).then((res) => { + this.detailData = { + name: res.object.school_NAME[0].content, + icon: + res.object.pictureList && res.object.pictureList.length > 0 + ? getImg(res.object.pictureList[0].filePath) + : "", + character: res.object.important_PEOPLE + ? res.object.important_PEOPLE + .map((item) => item.content2) + .join("銆�") + : "", + skilledDoctor: res.object.important_PHYSICIAN + ? res.object.important_PHYSICIAN + .map((item) => item.content2) + .join("銆�") + : "", + works: res.object.important_WORK + ? res.object.important_WORK.map((item) => item.content).join("銆�") + : "", + thought: res.object.school_THOUGHT + ? res.object.school_THOUGHT.map((item) => item.content).join("銆�") + : "", + source: res.object.bookList + ? res.object.bookList.map((item) => item.name).join("銆�") + : "", + brief: res.object.school_INTRODUCTION + ? res.object.school_INTRODUCTION.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [], + develop: res.object.school_DEVELOPMENT + ? res.object.school_DEVELOPMENT.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [], + achievement: res.object.achievement_INFLUENCE + ? res.object.achievement_INFLUENCE.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [], + literature: res.object.related_LITERATURE + ? res.object.related_LITERATURE.map((item) => { + return { + content: item.content, + source: + "鍑哄锛氥��" + + res.object.bookList.find((citem) => citem.id == item.bookId) + .name + + "銆� P" + + item.pageNo + }; + }) + : [] + }; + console.log(this.detailData); + }); + }, + goBack() { + this.$router.go(-1); + }, + ListClick(event) { + uni.navigateTo({ + url: "/pages/academicGenres/chart?id=" + this.idIndex + }); + this.secretary.forEach((item) => { + if (item.id === event) { + item.istrue = true; + } else { + item.istrue = false; + } + }); + } + }, + mounted() {} +}; +</script> + +<style scoped> +* { + box-sizing: border-box; +} + +view { + color: #fff; +} + +.bag { + width: 100%; + height: 100%; + background-color: #fff; +} + +.NavTop { + background-color: #0c274c; + padding: 25rpx; + + img { + width: 30rpx; + height: 30rpx; + vertical-align: middle; + } + + .NavTopr { + img { + margin-right: 10rpx; + } + } +} + +.Midde { + background-image: url("../../static/image/瀛︽淳Bg.png"); + background-size: 100% 100%; + color: #000; + padding: 0.18rem 0.23rem 0; + align-items: flex-start; + height: 1.43rem; + + view { + color: #000; + } + + .MiddeBack { + width: 0.6rem; + height: 0.24rem; + font-size: 0.12rem; + padding: 0; + } + + .Lists { + li { + width: 0.96rem; + height: 0.3rem; + border: 1px solid #597aa5; + line-height: 0.3rem; + text-align: center; + font-size: 0.14rem; + } + } +} + +.Bottom { + overflow: hidden; + padding: 0.39rem 1.21rem !important; + + .Bottom_top { + justify-content: flex-start; + align-items: flex-start; + padding: 0 1.59rem; + + .BBimage { + width: 4rem; + height: 2rem; + margin-right: 0.49rem; + } + + .author { + flex: 1; + overflow: hidden; + color: #000; + + li { + line-height: 0.22rem; + font-size: 0.14rem; + margin-top: 0.18rem; + color: #2c2c2c; + } + } + } + + .BBimage { + width: 50%; + height: 350rpx; + } +} + +.Bottom_Bot { + margin-top: 0.39rem; +} + +.csrTab1 { + border-bottom: 2px solid #9e9e9e; + margin-bottom: 0.3rem; +} + +.csrTab { + width: 40%; + height: 0.4rem; + font-size: 0.14rem; + display: flex; +} + +.Swiper { + flex: 1; +} + +.csrTab ::v-deep .uni-tab-bar { + border: 0 !important; + height: 0.02rem; + background-color: #597aa5; +} + +.csrTab ::v-deep .uni-tab-item { + color: #9e9e9e !important; + font-weight: 700; + height: 0.4rem; +} + +.csrTab ::v-deep .uni-tab-active { + color: #597aa5 !important; +} + +.swiperList { + line-height: 0.28rem; + font-size: 0.14rem; + color: #2c2c2c; + padding: 0.4rem; + width: 100%; + height: 100%; + box-sizing: border-box; + overflow: auto; +} + +.imgBox { + width: 100%; + height: 100%; + position: relative; +} + +.imgBox img { + width: auto; + height: auto; + max-width: 100%; + max-height: 100%; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + margin: auto; +} +</style> diff --git a/src/pages/academicGenres/index.vue b/src/pages/academicGenres/index.vue index d2e93ea..bced621 100644 --- a/src/pages/academicGenres/index.vue +++ b/src/pages/academicGenres/index.vue @@ -1,48 +1,8 @@ <template> - <view> + <view style="width: 100%;height: 100%;display: flex;flex-direction: column;"> <!-- 椤堕儴瀵艰埅 --> <headNav :idIndex="idIndex" text="鍘嗕唬瀛︽湳娴佹淳" /> - <!-- 瀛︽淳 --> - <view class="flex flex-center" style="width: 100%; margin: 0.2rem 0"> - <ul class="flex"> - <li style="" v-for="(item, index) in dynasty" :key="item.id"> - <view - @click="SchoolClick(item.id)" - class="flex flex-center font-family school" - :style="{ - marginRight: index === dynasty.length - 1 ? '0' : '0.03rem' - }" - style=" - font-weight: 500; - border-radius: 0.3rem; - padding: 0.06rem 0.15rem; - color: #2c2c2c; - font-size: 0.12rem; - margin-top: 0.03rem; - margin-right: 0.1rem; - background-color: #fff; - " - > - <view - class="" - :style="{ background: item.color }" - style=" - margin-right: 0.07rem; - width: 0.12rem; - height: 0.12rem; - border-radius: 50%; - " - ></view> - <view class="" style="color: #2c2c2c; font-size: 0.12rem">{{ - item.name - }}</view> - </view> - </li> - </ul> - </view> - <view class="" style="background-color: #fff"> - <view id="line-chart" style="width: 100vw"></view> - </view> + <view id="line-chart" style="flex: 1;overflow: hidden;padding: 50px;"></view> </view> </template> @@ -53,62 +13,10 @@ export default { data() { return { - // 鏍囬椤堕儴鏍忛渶瑕佺殑涓滆タ idIndex: 0, - // 鏈濅唬 - dynasty: [ - { - name: "鍖荤粡瀛︽淳", - color: "#90BBD8", - id: 1 - }, - { - name: "缁忔柟瀛︽淳", - color: "#EDD28B", - id: 2 - }, - { - name: "浼ゅ瘨瀛︽淳", - color: "#CF746D", - id: 3 - }, - { - name: "娌抽棿瀛︽淳", - color: "#9CC27A", - id: 4 - }, - { - name: "鏀婚偑瀛︽淳", - color: "#5B6CB9", - id: 5 - }, - { - name: "婊嬮槾瀛︽淳", - color: "#8860A8", - id: 6 - }, - { - name: "鏄撴按瀛︽淳", - color: "#DE8E66", - id: 7 - }, - { - name: "娓╄ˉ瀛︽淳", - color: "#7FAC8C", - id: 8 - } - ], - chartData: [ - { - name: "缁忔柟瀛︽淳", - values: [30, 10, 100, 400, 30, 70] - }, - { - name: "浼ゅ瘨瀛︽淳", - values: [23, 30, 140, 200, 230, 470, 230, 470] - } - ], - xAxisData: [] + dynastyData: [], + xAxisData: [], + schoolList: [] }; }, onLoad(options) { @@ -120,155 +28,141 @@ getDynastyData() { getDynasty().then((res) => { res.list.sort((a, b) => a.end - b.end); - this.xAxisData = res.list.map((item) => item.dynasty); - console.log(this.xAxisData); + this.dynastyData = res.list; + this.xAxisData = res.list.map((item) => item.dynastyChs); this.getData(); }); }, getData() { getDynastyStatistics().then((res) => { - console.log(res); + this.schoolList = []; + const schoolMap = {}; + for (let i = 0; i < res.list.length; i++) { + const item = res.list[i]; + // 鏁版嵁鍚堝苟 + if (schoolMap[item.schoolId]) { + schoolMap[item.schoolId].data.push({ + dynastyCode: item.dynastyCode, + personNumber: item.personNumber + }); + } else { + schoolMap[item.schoolId] = { + name: item.schoolName, + data: [ + { + dynastyCode: item.dynastyCode, + personNumber: item.personNumber + } + ] + }; + } + } + + for (const key in schoolMap) { + // 澶勭悊鏁伴噺 + const personNumbers = []; + for (let z = 0; z < this.dynastyData.length; z++) { + const dynastyItem = this.dynastyData[z]; + const returnData = schoolMap[key].data.find( + (item) => item.dynastyCode == dynastyItem.id + ); + if (returnData) { + personNumbers.push(returnData.personNumber); + } else { + personNumbers.push(0); + } + } + // 澶勭悊瀛︽淳 + this.schoolList.push({ + id: key, + name: schoolMap[key].name, + type: "line", + data: personNumbers, + smooth: 0.5, + // 璁剧疆绾挎潯鐨勯鑹� + itemStyle: { + normal: { + lineStyle: { + width: 2 + } + } + }, + // 璁剧疆绾挎潯鍙充晶鐨勫瓧浣撻鑹茬瓑 + label: { + show: true, // 鏄剧ず鏍囩 + position: "right", // 鏍囩浣嶇疆锛氬彸渚� + fontSize: 18, + color: "inherit", + formatter: (param) => { + if (param.dataIndex == this.dynastyData.length - 1) { + const data = this.schoolList.find( + (item) => item.name == param.seriesName + ).data; + return param.seriesName + " 锛�" + eval(data.join("+")) + "锛�"; + } else { + return ""; + } + } + } + }); + } + + this.renderChart(); }); - }, - SchoolClick(id) { - uni.navigateTo({ - url: "/pages/interchannel/interchannel?id=" + this.idIndex - }); - }, - // 闅忔満鑹� - getRandomColor() { - var letters = "0123456789ABCDEF"; - var color = "#"; - for (var i = 0; i < 6; i++) { - color += letters[Math.floor(Math.random() * 16)]; - } - return color; }, renderChart() { const chart = echarts.init(document.getElementById("line-chart")); - // 鏆傚瓨涓�涓� - let chartData1 = this.chartData; - let color = []; - - const series = this.chartData.map((item, i) => { - color.push(this.getRandomColor()); - return { - name: item.name, - type: "line", - data: item.values, - smooth: 0.5, - // 璁剧疆绾挎潯鐨勯鑹� - itemStyle: { - normal: { - color: "lineColor", // 鏀瑰彉鎶樼嚎鐐圭殑棰滆壊 - lineStyle: { - color: color[i], // 鏀瑰彉鎶樼嚎棰滆壊 - width: 3 - } - } - }, - // 璁剧疆绾挎潯鍙充晶鐨勫瓧浣撻鑹茬瓑 - label: { - show: true, // 鏄剧ず鏍囩 - position: "right", // 鏍囩浣嶇疆锛氬彸渚� - formatter: function (param) { - if (chartData1[i].values.length - 1 === param.dataIndex) { - return param.seriesName + " " + param.value; - } else { - return ""; - } - }, - color: color[i] - } - }; - }); - - console.log(series, "series"); - const option = { - // legend: { - // data: this.chartData.map(item => item.name), - // }, - zoom: 8, // 杩欓噷鍙互鏍规嵁闇�瑕佽皟鏁寸缉鏀剧骇鍒� - + tooltip: { + trigger: "axis" + }, + legend: { + data: this.schoolList.map((item) => item.name) + }, xAxis: { type: "category", + boundaryGap: false, data: this.xAxisData, axisLabel: { - fontSize: 32 // 璁剧疆 x 杞翠笂鏂囧瓧鐨勫瓧浣撳ぇ灏忎负 12 鍍忕礌 + fontSize: 16 // 璁剧疆 x 杞翠笂鏂囧瓧鐨勫瓧浣撳ぇ灏忎负 12 鍍忕礌 }, axisLine: { lineStyle: { - width: 4 // 璁剧疆x杞寸嚎鏉″搴︿负2鍍忕礌 + width: 2 // 璁剧疆x杞寸嚎鏉″搴︿负2鍍忕礌 } } }, yAxis: { type: "value", axisLabel: { - fontSize: 32 // 璁剧疆 x 杞翠笂鏂囧瓧鐨勫瓧浣撳ぇ灏忎负 12 鍍忕礌 + fontSize: 16 // 璁剧疆 x 杞翠笂鏂囧瓧鐨勫瓧浣撳ぇ灏忎负 12 鍍忕礌 }, axisLine: { lineStyle: { - width: 10 // 璁剧疆x杞寸嚎鏉″搴︿负2鍍忕礌 + width: 2 // 璁剧疆x杞寸嚎鏉″搴︿负2鍍忕礌 } } }, - series: series, - // 鍏朵粬閰嶇疆椤�... + series: this.schoolList, textStyle: { - fontSize: 30 // 璁剧疆鍏ㄥ眬鏂囧瓧鐨勫瓧浣撳ぇ灏� + fontSize: 16 // 璁剧疆鍏ㄥ眬鏂囧瓧鐨勫瓧浣撳ぇ灏� } }; - chart.setOption(option); + chart.on("click", (params) => { + const data = this.schoolList.find( + (item) => item.name == params.seriesName + ); + uni.navigateTo({ + url: "/pages/academicGenres/detail?id=" + data.id + }); + }); } - }, - mounted() { - this.renderChart(); } }; </script> <style> -view { - color: #fff; -} - -.school { -} - -.bag { - height: 100vh; - background-color: #fff; -} - -.NavTop { - background-color: #0c274c; - padding: 25rpx; - - img { - width: 30rpx; - height: 30rpx; - vertical-align: middle; - } - - .NavTopr { - img { - margin-right: 10rpx; - } - } -} - -.mImage { - width: 100%; - height: 40rpx; - - img { - vertical-align: top; - } -} - #line-chart { height: 6rem; } diff --git a/src/pages/interchannel/interchannel.vue b/src/pages/interchannel/interchannel.vue deleted file mode 100644 index bc7f3fb..0000000 --- a/src/pages/interchannel/interchannel.vue +++ /dev/null @@ -1,303 +0,0 @@ -<template> - <view class="bag "> - <!-- 椤堕儴瀵艰埅 --> - <headNav :idIndex="idIndex" text="鍘嗕唬瀛︽湳娴佹淳"/> - <view class="Midde flex"> - <!-- <view class="MiddeBack">杩斿洖</view> --> - <el-button class="MiddeBack flex flex-center" @click="goBack">杩斿洖</el-button> - <view class="flex flex-center flex-column"> - <view class="" style="font-weight: 900;margin-bottom:.2rem ;font-size: .26rem;line-height: 1;">娌抽棿瀛︽淳 - </view> - <ul class="flex Lists"> - <li style="background-color: #597AA5;color: #fff;">瀛︽淳浠嬬粛</li> - <!-- /pages/AcademicHistory/AcademicHistory --> - <li @click="ListClick" style="background-color: #fff;color: #597AA5;" >瀛︽淳鍥捐氨</li> - </ul> - </view> - <view class=""></view> - </view> - <view class="Bottom"> - <view class="Bottom_top flex"> - <view class="BBimage"> - <img src="https://img0.baidu.com/it/u=256816879,771155532&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1710435600&t=274348dc113725fdfa87c1023e4526aa" - alt="" srcset="" /> - </view> - <view class="author"> - <ul> - <li>浠h〃鎬т汉鐗�:鍒樺畬绱�</li> - <li>閲嶈鍖诲:椹畻绱狅紝缃楃煡锛屾湵闇囧畞</li> - <li>浠h〃鎬ц嫤浣�:-</li> - <li>瀛︽湳鐗圭偣:-</li> - <li>鏉ユ簮:浠诲簲绉嬶紝涓尰鍚勫瀛﹁|M).涓婃捣:涓婃捣绉戝鎶�鏈嚭鐗堢ぞ锛�1986</li> - </ul> - </view> - </view> - <view class="Bottom_Bot" style="color: #d1d1d1 ;"> - <view class=""> - <!-- <csr-tab :tabList="tabList" :value="0"></csr-tab> --> - <view class="flex flex-center csrTab1"> - <csr-tab class="csrTab" :value.sync="swiperIndex" :tabList="tabSwiperList"></csr-tab> - </view> - <swiper :current="swiperIndex" duration="300" :circular="true" indicator-color="rgba(255,255,255,0)" - indicator-active-color="rgba(255,255,255,0)" class="Swiper"> - <!-- @change="swiperChange" --> - <swiper-item v-for="(swiper,index) in tabSwiperList" :key="index"> - <view class="swiperList" style="background-color: #FFFFFF;text-align: left;color: #000;"> - {{swiper.content}} - </view> - </swiper-item> - </swiper> - </view> - - </view> - </view> - </view> -</template> - -<script> - import * as echarts from 'echarts'; - export default { - data() { - return { - // 鏍囬椤堕儴鏍忛渶瑕佺殑涓滆タ - idIndex:0, - swiperIndex: 0, - tabSwiperList: [{ - TabControl: `瀛︽淳姒傝`, - content: `娌抽棿瀛︽淳鏄互瀹嬮噾鏃舵湡娌冲寳娌抽棿钁楀悕鍖诲鍒樺畬绱犱负浠h〃鐨勫尰瀛︽祦娲俱�備互銆婂唴缁忋�嬬悊璁轰负鎸囧锛屼互闂歌堪鐏儹鐥呮満锛屽杽娌荤伀鐑梾璇佽�岃憲绉颁簬涓栥�備絸鈥滃叚姘旂殕鑳藉寲鐏�濊锛屾不鐥呭杽鐢ㄥ瘨鍑夛紝鍖诲鏁欒偛缃戞悳闆嗘暣鐞嗕笘浜轰害绉颁箣涓哄瘨鍑夋淳銆傛渤闂村娲惧湪鍙戝睍杩囩▼涓赴瀵屽拰鍙戝睍浜嗕腑鍖诲鐏儹鐥呯殑璁よ瘑锛屼績杩涗簡鐥呮満瀛﹁鐨勫彂灞曘�備负鏀婚偑瀛︽淳銆佷腹婧娲剧殑褰㈡垚濂犲畾浜嗙悊璁哄熀纭�锛屼害鏄槑娓呮椂鏈熸俯鐥呭娲惧舰鎴愮殑鍏堝銆� - 娌抽棿瀛︽淳鏈夊叾鐙壒鐨勭悊璁轰綋绯诲拰甯堟壙鎶曞彈鍏崇郴锛岃嚜鍒樺瓧鑰佸垱姘寸儹璁轰箣鍚庯紝鎵胯鍏舵湳鑰呬笉涔忓叾浜恒�傛嵁涓埗璁拌浇锛屼翰鐐欏叾瀛﹁�咃紝鏈夌ǔ澶ч粍銆佺ǔ瀛愭湇銆侀粍绯汇�侀┈瀹楄�呫�佽崋灞辨诞灞曠瓑銆傜﹩澶ч粍銆� - 鍚嶅瓧閲岀睄鍙婅憲浣滀勘鏃犱粠鑰冦�傜﹩瀛愭槶涓庡叾鐖剁﹩澶ч粍鍚屽浜庡垬瀹岀礌銆傝懀绯讳害涓轰紶娌抽棿杈涘噳涔嬫硶鑰呫�傚垬娌抽棿锛岄噾钁楀悕鍖诲锛岃憲鏈夈�婄礌闂巹鏈哄師鐥呭紡銆嬨�婂尰鏂圭簿瑕佸疁鏄庤銆嬨�婁笁娑堣銆嬬瓑銆備粬鐨勭伀鐑悊璁猴紝婧愪簬銆婄礌闂�傜儹璁恒�嬪拰銆婅嚦鐪熻澶ц銆嬬梾鏈哄崄涔濇潯锛屽叾涓昏鍐呭涓衡�滃叚姘旂殕鑳藉寲鐏�濓紝涓村簥鍒嗚〃閲岃瘉杈ㄦ不涔嬶紝鐏儹鍦ㄨ〃锛屾不浠ヨ緵鍑夌敇瀵�;鐏儹鍦ㄩ噷锛岀敤鎵挎皵璇告柟;琛ㄩ噷淇辩儹锛岀敤闃查閫氳嚦銆佸噳闅斾互涓よВ涔嬨�傝嚜瀹岀礌浠ュ悗锛岃璁虹伀鐑瘉鐨勭悊璁烘柟鑽究鑷垚浣撶郴銆傞┈瀹楃礌锛屻�婂畫浠ュ墠鍖荤睄鑰冦�嬩簯:鈥滃畻绱犱害閲戜汉锛屽綋寰椾翰鐐欎簬瀹堢湡涔嬮棬鑰呪�濄�傚叾钁椼�婁激瀵掑尰閴淬�嬩竴涔︼紝浠庝激瀵掔梾鐨勮搴︽潵瀹滄壃鍒樺畬绱犵殑鐏儹璁猴紝澶у紶鍒樻皬鈥滀汉涔嬩激瀵掑垯涓虹儹鐥咃紝鍙や粖銆傚悓锛岄�氳皟涔嬩激瀵掆��(銆婁激瀵掑尰閴淬�傝鍏粡浼犲彉銆�)鍙娾�滃叚缁忎紶鍙樼殕鏄儹璇佲��(銆婁激瀵掑尰閴淬�傝姹椾笅銆�)涔嬭銆� - 鑽嗗北娴睜锛屻�婃槑鍙层�傛柟鎶�銆傛埓鎬濇伃浼犮�嬩簯:鈥滈渿浜�︹�﹀鍖讳簬瀹嬪唴渚嶉挶濉樼綏鐭ヤ郡锛岀煡淇ゅ緱涔嬭崋灞辨诞灞狅紝娴眳鍒欐渤闂村垬瀹堢湡闂ㄤ汉涔熲�濄�傚彲鐭ュ叾瀛︿竴浼犱簬缃楃煡淇わ紝鍐嶄紶浜庢湵闇囦韩锛屼娇娌抽棿涔嬭鐢卞寳鏂归潰浼犲埌鍗楁柟銆俙, - }, { - TabControl: `瀛︽淳鍙戝睍`, - content: '瀛︽淳鍙戝睍', - }, { - TabControl: `鎴愬氨褰卞搷`, - content: '鎴愬氨褰卞搷', - }, { - TabControl: `鐩稿叧鏂囩尞`, - content: '鐩稿叧鏂囩尞', - }], - secretary: [{ - id: 1, - name: '骞呭害钀ㄨ姮', - istrue: false - }, { - id: 2, - name: '骞呭害s钀ㄨ姮', - istrue: false - }], - tabList: [{ - name: '澹ぇ澶�', - id: 1 - }, { - name: '澹�2澶уか', - id: 2 - }, ] - } - }, - onLoad(options) { - this.idIndex = options.id - console.log('optionsoptionsoptions',options.id); - }, - methods: { // 杩斿洖涓婁竴椤� - goBack() { - // uuni.redirectTo(); - uni.redirectTo({ - url: '/pages/index/index' - }) - }, - ListClick(event) { - console.log(event); - uni.navigateTo({ - url: '/pages/AcademicHistory/AcademicHistory?id='+this.idIndex - }) - this.secretary.forEach(item => { - if (item.id === event) { - item.istrue = true; - } else { - item.istrue = false; - } - }); - console.log(this.secretary); - } - }, - mounted() { - - } - } -</script> - -<style scoped> - * { - box-sizing: border-box; - } - - view { - color: #fff; - } - - .bag { - height: 100vh; - background-color: #fff; - } - - .NavTop { - background-color: #0c274c; - padding: 25rpx; - - img { - width: 30rpx; - height: 30rpx; - vertical-align: middle; - } - - .NavTopr { - img { - margin-right: 10rpx; - } - } - } - - .Midde { - /* background-color: #d1d6dc; */ - background-image: url(@/static/image/瀛︽淳Bg.png); - background-size: 100% 100%; - color: #000; - padding: .18rem .23rem 0; - align-items: flex-start; - height: 1.43rem; - - view { - - color: #000; - } - - .MiddeBack { - width: 0.6rem; - height: 0.24rem; - font-size: .12rem; - padding: 0; - - } - - .Lists { - li { - /* background-color: #e4ebf3; - border: 1rpx solid #5778a2; - padding: 5rpx 10rpx; - font-size: 18rpx; */ - width: 0.96rem; - height: .3rem; - border: 1px solid #597AA5; - line-height: .3rem; - text-align: center; - font-size: .14rem; - } - } - } - - .Bottom { - padding: .39rem 1.21rem !important; - - .Bottom_top { - justify-content: flex-start; - /* align-items: flex-end; */ - align-items: flex-start; - padding: 0 1.59rem; - - .BBimage { - width: 4.05rem; - height: 1.93rem; - margin-right: .49rem; - } - - .author { - color: #000; - /* padding-left: 100rpx; */ - - li { - /* padding: 5rpx 0; - */ - line-height: .22rem; - font-size: .14rem; - margin-top: .05rem; - color: #2C2C2C; - } - } - } - - .BBimage { - width: 50%; - height: 350rpx; - - img { - width: 100%; - height: 100%; - vertical-align: top; - } - } - - - } - - .Bottom_Bot { - margin-top: .39rem; - } - - .csrTab1 { - border-bottom: 2px solid #9E9E9E; - margin-bottom: .3rem; - } - - .csrTab { - width: 40%; - height: .4rem; - /* line-height: .3rem; */ - font-size: .14rem; - display: flex; - - } - - .Swiper { - padding: 0 1.25rem; - height: 2rem; - - } - - .csrTab ::v-deep .uni-tab-bar { - border: 0 !important; - height: .02rem; - background-color:#597AA5; - } - - .csrTab ::v-deep .uni-tab-item { - color: #9E9E9E !important; - font-weight: 700; - height: .4rem; - } - - .csrTab ::v-deep .uni-tab-active { - color: #597AA5 !important; - } - - .swiperList { - line-height: .28rem; - font-size: .14rem; - color: #2C2C2C; - } -@media screen and (min-width:2560px)and (max-width:3840px){ - /* .csrTab ::v-deep .uni-tab-bar { - border: 0.015rem solid #597AA5 !important; - } */ -} - - @media screen and (min-width:1366px) and (max-width:1920px){ - /* .csrTab ::v-deep .uni-tab-bar { - border: 0 !important; - height: .02rem; - background-color:#597AA5; - - } */ - } -</style> \ No newline at end of file diff --git a/src/pages/repository/repository.vue b/src/pages/repository/repository.vue index e889f83..7bac2d9 100644 --- a/src/pages/repository/repository.vue +++ b/src/pages/repository/repository.vue @@ -301,7 +301,7 @@ }, // 杩斿洖涓婁竴椤� goBack() { - uni.navigateBack(); + this.$router.go(-1); }, // 杩斿洖椤堕儴 scrollToTop() { diff --git a/src/pages/zhongyi/zhongyi.vue b/src/pages/zhongyi/zhongyi.vue index 35aacc5..4b1add8 100644 --- a/src/pages/zhongyi/zhongyi.vue +++ b/src/pages/zhongyi/zhongyi.vue @@ -609,10 +609,7 @@ }, // 杩斿洖鎸夐挳 goBack() { - // uuni.redirectTo(); - uni.redirectTo({ - url: '/pages/index/index' - }) + this.$router.go(-1); }, } } diff --git a/src/static/initialize.css b/src/static/initialize.css index 7e999de..febb8bb 100644 --- a/src/static/initialize.css +++ b/src/static/initialize.css @@ -114,3 +114,11 @@ width: 100%; height: 100%; } + +uni-page-wrapper { + width: 100%; +} +uni-page-body { + width: 100%; + height: 100%; +} diff --git a/src/uni_modules/csr-tab/components/csr-tab/csr-tab.vue b/src/uni_modules/csr-tab/components/csr-tab/csr-tab.vue index b3a6d09..f2c2ed8 100644 --- a/src/uni_modules/csr-tab/components/csr-tab/csr-tab.vue +++ b/src/uni_modules/csr-tab/components/csr-tab/csr-tab.vue @@ -1,153 +1,181 @@ <template> - <view :class="{'uni-scroll-tab': scroll === true }" class="uni-tab "> - - <view v-for="(tab,index) in tabList" :key="index" - :class="{ 'uni-tab-active': index === value, 'uni-tab-scroll-item': scroll === true, ' uni-tab-scroll-active': index === value && scroll === true }" - :style="[{color:index === value ? activeColor : defaultColor,backgroundColor: bgColor}]" - @tap="itemClick(index,tab)" class="uni-tab-item"> - <span v-if="tab.icon != undefined" class="iconfont mr5" :class="tab.icon"></span> + <view :class="{ 'uni-scroll-tab': scroll === true }" class="uni-tab"> + <view + v-for="(tab, index) in tabList" + :key="index" + :class="{ + 'uni-tab-active': index === value, + 'uni-tab-scroll-item': scroll === true, + ' uni-tab-scroll-active': index === value && scroll === true + }" + :style="[ + { + color: index === value ? activeColor : defaultColor, + backgroundColor: bgColor + } + ]" + style="cursor: pointer;" + @tap="itemClick(index, tab)" + class="uni-tab-item" + > + <span + v-if="tab.icon != undefined" + class="iconfont mr5" + :class="tab.icon" + ></span> - <text>{{rangeKey == '' ? tab.TabControl : tab[rangeKey]}}</text> - </view> - <view v-if="!scroll" :style="[{ right: barRight + '%', left : barLeft + '%', borderColor: activeColor }]" - class="uni-tab-bar" :class="back ? 'uni-tab-bar-backward' : 'uni-tab-bar-forward'"></view> - </view> + <text>{{ rangeKey == "" ? tab.TabControl : tab[rangeKey] }}</text> + </view> + <view + v-if="!scroll" + :style="[ + { right: barRight + '%', left: barLeft + '%', borderColor: activeColor } + ]" + class="uni-tab-bar" + :class="back ? 'uni-tab-bar-backward' : 'uni-tab-bar-forward'" + ></view> + </view> </template> <script> - export default { - name: 'uni-tab', - data() { - return { - average: 0, - back: false - }; - }, - props: { - value: { - type: Number, //褰撳墠閫変腑涓嬫爣 - default () { - return 0; - } - }, - tabList: { - type: Array, - default () { - return []; - } - }, - bgColor: { //鑳屾櫙棰滆壊 - type: String, - default () { - return '#FFFFFF'; - } - }, - defaultColor: { //榛樿鏈�変腑鏂囧瓧棰滆壊 - type: String, - default () { - return '#636363'; - } - }, - activeColor: { //閫変腑鏃舵枃瀛楅鑹� 绾挎潯棰滆壊 - type: String, - default () { - return '#000000'; - } - }, - rangeKey: { // 褰搕abList涓哄璞℃椂 鏄剧ず鎸囧畾涓嬫爣鍊� - type: String, - default () { - return ''; - } - }, - scroll: { //妯悜婊戝姩 - type: Boolean, - default () { - return false; - } - }, - }, - computed: { - barLeft() { - return this.value * this.average; - }, - barRight() { - let index = this.tabList.length - this.value - 1; - console.log(this.tabList.length,index * this.average); - return index * this.average; - }, - }, - created() { - this.average = 100 / this.tabList.length; - }, - methods: { - itemClick(index, tab) { - if (this.value == index) return false; - if (this.value > index) { - this.back = true; - } else { - this.back = false; - } - // this.value = index; - this.$emit('update:value', index); - this.$emit('change', { - tab: tab - }); - } - } - }; +export default { + name: "uni-tab", + data() { + return { + average: 0, + back: false + }; + }, + props: { + value: { + type: Number, //褰撳墠閫変腑涓嬫爣 + default() { + return 0; + } + }, + tabList: { + type: Array, + default() { + return []; + } + }, + bgColor: { + //鑳屾櫙棰滆壊 + type: String, + default() { + return "#FFFFFF"; + } + }, + defaultColor: { + //榛樿鏈�変腑鏂囧瓧棰滆壊 + type: String, + default() { + return "#636363"; + } + }, + activeColor: { + //閫変腑鏃舵枃瀛楅鑹� 绾挎潯棰滆壊 + type: String, + default() { + return "#000000"; + } + }, + rangeKey: { + // 褰搕abList涓哄璞℃椂 鏄剧ず鎸囧畾涓嬫爣鍊� + type: String, + default() { + return ""; + } + }, + scroll: { + //妯悜婊戝姩 + type: Boolean, + default() { + return false; + } + } + }, + computed: { + barLeft() { + return this.value * this.average; + }, + barRight() { + let index = this.tabList.length - this.value - 1; + return index * this.average; + } + }, + created() { + this.average = 100 / this.tabList.length; + }, + methods: { + itemClick(index, tab) { + if (this.value == index) return false; + if (this.value > index) { + this.back = true; + } else { + this.back = false; + } + // this.value = index; + this.$emit("update:value", index); + this.$emit("change", { + tab: tab + }); + } + } +}; </script> <style lang="scss" scoped> - @import "../../static/iconfont.css"; +@import "../../static/iconfont.css"; - .uni-tab { - position: relative; - display: flex; - font-size: 14px; - height: 44px; - line-height: 44px; - // sdsd - // justify-content: center; - .uni-tab-item { - flex: 1; - // width: 20% !important; - height: 100%; - text-align: center; - box-sizing: border-box; - overflow: hidden; - } +.uni-tab { + position: relative; + display: flex; + font-size: 14px; + height: 44px; + line-height: 44px; + // sdsd + // justify-content: center; + .uni-tab-item { + flex: 1; + // width: 20% !important; + height: 100%; + text-align: center; + box-sizing: border-box; + overflow: hidden; + } - .uni-tab-scroll-item { - flex: none; - padding: 0px 12px; - } + .uni-tab-scroll-item { + flex: none; + padding: 0px 12px; + } - .uni-tab-active { - - color: #1e9fff; - } + .uni-tab-active { + color: #1e9fff; + } - .uni-tab-scroll-active { - border-bottom: 3px solid #1e9fff; - } + .uni-tab-scroll-active { + border-bottom: 3px solid #1e9fff; + } - .uni-tab-bar { - display: block; - height: 3px; - position: absolute; - bottom: 0; - border-bottom: 3px solid #1e9fff; - } + .uni-tab-bar { + display: block; + height: 3px; + position: absolute; + bottom: 0; + border-bottom: 3px solid #1e9fff; + } - .uni-tab-bar-forward { - transition: right 0.3s cubic-bezier(0.35, 0, 0.25, 1), left 0.3s cubic-bezier(0.35, 0, 0.25, 1) 0.09s; - } + .uni-tab-bar-forward { + transition: right 0.3s cubic-bezier(0.35, 0, 0.25, 1), + left 0.3s cubic-bezier(0.35, 0, 0.25, 1) 0.09s; + } - .uni-tab-bar-backward { - transition: right 0.3s cubic-bezier(0.35, 0, 0.25, 1) 0.09s, left 0.3s cubic-bezier(0.35, 0, 0.25, 1); - } - } + .uni-tab-bar-backward { + transition: right 0.3s cubic-bezier(0.35, 0, 0.25, 1) 0.09s, + left 0.3s cubic-bezier(0.35, 0, 0.25, 1); + } +} - .uni-scroll-tab { - overflow-x: scroll; - } -</style> \ No newline at end of file +.uni-scroll-tab { + overflow-x: scroll; +} +</style> diff --git a/src/utils/Crypto.js b/src/utils/Crypto.js index 785cb56..ccdba75 100644 --- a/src/utils/Crypto.js +++ b/src/utils/Crypto.js @@ -41,4 +41,14 @@ var decryptedData = CryptoJS.AES.decrypt(vals, key, options); var decryptedStr = CryptoJS.enc.Utf8.stringify(decryptedData); return decryptedStr; +} + +// 闅忔満鑹� +const getRandomColor = () => { + var letters = "0123456789ABCDEF"; + var color = "#"; + for (var i = 0; i < 6; i++) { + color += letters[Math.floor(Math.random() * 16)]; + } + return color; } \ No newline at end of file diff --git a/src/utils/request/req1.js b/src/utils/request/req1.js index 1148bdb..ba1b63d 100644 --- a/src/utils/request/req1.js +++ b/src/utils/request/req1.js @@ -1,11 +1,12 @@ // 灏佽缃戠粶璇锋眰 import axios from "axios"; import { Message } from "element-ui"; +export const baseUrl = "http://icmm.test.xyinde.com/api"; // 鍒涘缓璇锋眰瀹炰緥 const req = axios.create({ // baseURL: '/api' // baseURL: '/account/verification' - baseURL: "http://icmm.test.xyinde.com/api", + baseURL: baseUrl, timeout: 10000 }); -- Gitblit v1.9.1