|
|
|
|
@ -7,7 +7,7 @@
|
|
|
|
|
<titleCard>硒产业标准体系统计</titleCard>
|
|
|
|
|
<div class="top-item">
|
|
|
|
|
<div class="item" v-for="item in topList" :key="item.id"
|
|
|
|
|
@click="ckickItem(item.id, item.schemeName)">
|
|
|
|
|
@click="ckickItem(item.parentId, item.schemeName)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ item.schemeName }}
|
|
|
|
|
</div>
|
|
|
|
|
@ -18,7 +18,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bottom-item">
|
|
|
|
|
<div class="item" v-for="item in bottomList" :key="item.id"
|
|
|
|
|
@click="ckickItem(item.id, item.schemeName)">
|
|
|
|
|
@click="ckickItem(item.parentId, item.schemeName)">
|
|
|
|
|
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ item.schemeName }}
|
|
|
|
|
@ -32,140 +32,237 @@
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 标准统计 -->
|
|
|
|
|
<div class="bztj">
|
|
|
|
|
<div class="bztj" v-if="sgowBox">
|
|
|
|
|
<titleCard>标准统计</titleCard>
|
|
|
|
|
<div class="bztj-card">
|
|
|
|
|
<div class="gj">
|
|
|
|
|
<div class="gj" @click="clickBztj(hyList.value)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ gjLIst.name }}
|
|
|
|
|
{{ countryList.key }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">{{ gjLIst.num }}</div>
|
|
|
|
|
<div class="num">{{ countryList.value }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="hy">
|
|
|
|
|
<div class="hy" @click="clickBztj(hyList.value)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ hyList.name }}
|
|
|
|
|
{{ hyList.key }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">{{ hyList.num }}</div>
|
|
|
|
|
<div class="num">{{ hyList.value }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="sj">
|
|
|
|
|
<div class="sj" @click="clickBztj(hyList.value)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ sjList.name }}
|
|
|
|
|
{{ sjList.key }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">{{ sjList.num }}</div>
|
|
|
|
|
<div class="num">{{ sjList.value }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="dbz">
|
|
|
|
|
<div class="dbz" @click="clickBztj(hyList.value)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ dbzList.name }}
|
|
|
|
|
{{ dbzList.key }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">{{ dbzList.num }}</div>
|
|
|
|
|
<div class="num">{{ dbzList.value }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="all" @click="clickBztj(hyList.value)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ allList.key }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">{{ allList.value }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 本地标准 -->
|
|
|
|
|
<div class="bd">
|
|
|
|
|
<titleCard>本地标准</titleCard>
|
|
|
|
|
<div class="item">
|
|
|
|
|
<div class="item" @click="clickBztj(hyList.value)">
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ bdList.name }}
|
|
|
|
|
{{ bdList.key }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">
|
|
|
|
|
{{ bdList.num }}
|
|
|
|
|
{{ bdList.value }}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="rightWrap">
|
|
|
|
|
<div class="search-wrap">
|
|
|
|
|
<div class="search-wrap" :class="{ flexs: showChart }">
|
|
|
|
|
<img src="../../../public/images/go-back.png" alt="" class="imgs" v-show="!showChart"
|
|
|
|
|
@click="showChart = !showChart">
|
|
|
|
|
<div>
|
|
|
|
|
<el-input v-model="searchContent" placeholder="请输入搜索内容"></el-input>
|
|
|
|
|
<el-input v-model="searchContent" placeholder="请输入搜索内容" @keyup.enter.native="enterKeyup"></el-input>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<div id="bztx" class="charts"></div>
|
|
|
|
|
<div id="bztx" class="charts" v-show="showChart"></div>
|
|
|
|
|
<div v-show="!showChart" class="contents">
|
|
|
|
|
<template v-if="fileList.length">
|
|
|
|
|
<div class="item" v-for="(item, index) in fileList" :key="index" @click="clickFile(item)">
|
|
|
|
|
<div class="imgWrap">
|
|
|
|
|
<img src="../../../public/images/pdf.png" alt="" style="width:100% ;height: 100%;">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="title">
|
|
|
|
|
{{ item.fileName }}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<div class="nodata">
|
|
|
|
|
<span>
|
|
|
|
|
暂无数据!
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<el-dialog :title="fileTitle" :visible.sync="showNewsDialog" :append-to-body="false">
|
|
|
|
|
<embed :src="fileSrc" type="application/pdf" width="100%" height="740px"
|
|
|
|
|
style="position: relative;z-index: 1008;" />
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import { standardSystemStatistics, standardSystem, getSchemeTree } from '../../api/bztx/index'
|
|
|
|
|
import { standardSystemStatistics, standardSystem, getSchemeTree, standardSystemQuery } from '../../api/bztx/index'
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
topList: [],
|
|
|
|
|
bottomList: [],
|
|
|
|
|
gjLIst: {
|
|
|
|
|
},
|
|
|
|
|
sgowBox: false,
|
|
|
|
|
names: '',
|
|
|
|
|
countryList: {}, //疑问 该变量定义为gjLIst没办法显示数据
|
|
|
|
|
hyList: {},
|
|
|
|
|
sjList: {},
|
|
|
|
|
dbzList: {},
|
|
|
|
|
allList:{},
|
|
|
|
|
bdList: {},
|
|
|
|
|
option: {
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
|
|
|
|
tooltip: { // 提示框浮层设置
|
|
|
|
|
trigger: 'item',
|
|
|
|
|
triggerOn: 'mousemove',
|
|
|
|
|
backgroundColor: "#fff"
|
|
|
|
|
triggerOn: 'mousemove', // 提示框触发条件
|
|
|
|
|
enterable: true, // 鼠标是否可进入提示框浮层中，默认false
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
type: 'tree',
|
|
|
|
|
id: 0,
|
|
|
|
|
name: 'tree1',
|
|
|
|
|
data: [],
|
|
|
|
|
top: '10%',
|
|
|
|
|
left: '10%',
|
|
|
|
|
bottom: '10%',
|
|
|
|
|
right: '10%',
|
|
|
|
|
symbolSize: 7,
|
|
|
|
|
edgeShape: 'polyline',
|
|
|
|
|
edgeForkPosition: '63%',
|
|
|
|
|
initialTreeDepth: 3,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
width: 2
|
|
|
|
|
name: '树图',
|
|
|
|
|
top: '5%', // 组件离容器上侧的距离，像素值20，或相对容器的百分比20%
|
|
|
|
|
left: '5%', // 组件离容器左侧的距离
|
|
|
|
|
bottom: '5%', // 组件离容器下侧的距离
|
|
|
|
|
right: '10%', // 组件离容器右侧的距离
|
|
|
|
|
layout: 'orthogonal', // 树图的布局，正交orthogonal和径向radial两种
|
|
|
|
|
orient: 'LR', // 树图中正交布局的方向，'LR','RL','TB','BT'，只有布局是正交时才生效
|
|
|
|
|
edgeShape: 'polyline', // 树图边的形状，有曲线curve和折线polyline两种，只有正交布局下生效
|
|
|
|
|
roam: false, // 是否开启鼠标缩放或平移，默认false
|
|
|
|
|
// initialTreeDepth: 0, // 树图初始的展开层级（深度），根节点是0，不设置时全部展开
|
|
|
|
|
// symbol: 'arrow', // 标记的图形，默认是emptyCircle;circle,rect,roundRect,triangle,diamond,pin,arrow,none
|
|
|
|
|
// symbolRotate: 270, // 配合arrow图形使用效果较好
|
|
|
|
|
symbolSize: 5, // 大于0时是圆圈，等于0时不展示，标记的大小
|
|
|
|
|
itemStyle: { // 树图中每个节点的样式
|
|
|
|
|
color: '#1890FF', // 节点未展开时的填充色
|
|
|
|
|
borderColor: 'rgba(255, 144, 0, 1)', // 图形的描边颜色
|
|
|
|
|
borderWidth: 1, // 描边线宽，为0时无描边
|
|
|
|
|
borderType: 'dotted', // 描边类型
|
|
|
|
|
borderCap: 'square', // 指定线段末端的绘制方式butt方形结束，round圆形结束，square
|
|
|
|
|
shadowColor: 'rgba(0,121,221,0.3)', // 阴影颜色
|
|
|
|
|
shadowBlur: 16, // 图形阴影的模糊大小
|
|
|
|
|
opacity: 1 // 图形透明度
|
|
|
|
|
},
|
|
|
|
|
itemStyle: {
|
|
|
|
|
color: 'none', // 设置节点的背景颜色为红色
|
|
|
|
|
borderColorSaturation: 0.6, // 调整边界线条的饱和度
|
|
|
|
|
borderWidth: 0, // 设置边界线条的宽度
|
|
|
|
|
emphasis: {
|
|
|
|
|
shadowBlur: 5, // 设置高亮时的模糊效果
|
|
|
|
|
shadowOffsetX: 0,
|
|
|
|
|
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
|
|
}
|
|
|
|
|
label: { // 每个节点对应的文本标签样式
|
|
|
|
|
show: true, // 是否显示标签
|
|
|
|
|
distance: 8, // 文本距离图形元素的距离
|
|
|
|
|
position: 'left', // 标签位置
|
|
|
|
|
verticalAlign: 'middle', // 文字垂直对齐方式，默认自动，top，middle，bottom
|
|
|
|
|
align: 'center', // 文字水平对齐方式，默认自动，left，right，center
|
|
|
|
|
fontSize: 12, // 字体大小
|
|
|
|
|
color: '#fff', // 字体颜色
|
|
|
|
|
backgroundColor: '#042248', // 文字块的背景颜色
|
|
|
|
|
borderColor: '#1890FF', // 文字块边框颜色
|
|
|
|
|
borderWidth: 1, // 文字块边框宽度
|
|
|
|
|
borderType: 'solid', // 文字块边框描边类型 solid dashed dotted
|
|
|
|
|
borderRadius: 4, // 文字块的圆角
|
|
|
|
|
padding: [6, 6], // 文字块内边距
|
|
|
|
|
shadowColor: 'rgba(0,121,221,0.3)', // 文字块的背景阴影颜色
|
|
|
|
|
shadowBlur: 4, // 文字块的背景阴影长度
|
|
|
|
|
width: 80,
|
|
|
|
|
// 文字超出宽度是否截断或者换行；只有配置width时有效
|
|
|
|
|
overflow: 'truncate', // truncate截断，并在末尾显示ellipsis配置的文本，默认为...;break换行;breakAll换行，并强制单词内换行
|
|
|
|
|
ellipsis: '...'
|
|
|
|
|
},
|
|
|
|
|
label: {
|
|
|
|
|
position: 'left',
|
|
|
|
|
verticalAlign: 'middle',
|
|
|
|
|
align: 'right',
|
|
|
|
|
textStyle: {
|
|
|
|
|
fontSize: 12,
|
|
|
|
|
fontFamily: 'PingFangSC, PingFang SC',
|
|
|
|
|
fontWeight: 400,
|
|
|
|
|
color: '#fff',
|
|
|
|
|
padding: 10,
|
|
|
|
|
// backgroundColor: '#fff',
|
|
|
|
|
|
|
|
|
|
lineStyle: { // 树图边的样式
|
|
|
|
|
color: '#fff', // 树图边的颜色
|
|
|
|
|
width: 1, // 树图边的宽度
|
|
|
|
|
curveness: 0.5, // 树图边的曲度
|
|
|
|
|
shadowColor: 'rgba(0, 0, 0, 1)', // 阴影颜色
|
|
|
|
|
// shadowBlur: 10 // 图形阴影的模糊大小
|
|
|
|
|
},
|
|
|
|
|
emphasis: { // 树图中图形和标签高亮的样式
|
|
|
|
|
disabled: true, // 是否关闭高亮状态，默认false
|
|
|
|
|
// 在高亮图形时，是否淡出其它数据的图形已达到聚焦的效果
|
|
|
|
|
focus: 'self', // none不淡出其他图形（默认）；self只聚焦当前高亮的数据图形；series聚焦当前高亮的数据所在系列的所有图形；ancestor聚焦所有祖先节点；descendant聚焦所有子孙节点；relative聚焦所有子孙和祖先节点
|
|
|
|
|
blurScope: 'coordinateSystem', // 开启focus时，配置淡出的范围，coordinateSystem淡出范围为坐标系（默认）；series淡出范围为系列；global淡出范围为全局
|
|
|
|
|
itemStyle: { // 该节点的样式
|
|
|
|
|
color: '#1890FF', // 图形的颜色
|
|
|
|
|
// borderColor: 'rgba(255, 144, 0, 1)', // 图形的描边颜色
|
|
|
|
|
borderWidth: 1, // 描边线宽，为0时无描边
|
|
|
|
|
borderType: 'solid', // 描边类型 solid dashed dotted
|
|
|
|
|
borderCap: 'square', // 指定线段末端的绘制方式butt方形结束，round圆形结束，square
|
|
|
|
|
shadowColor: 'rgba(0,121,221,0.3)', // 阴影颜色
|
|
|
|
|
shadowBlur: 12, // 图形阴影的模糊大小
|
|
|
|
|
opacity: 1 // 图形透明度
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
lineStyle: { // 树图边的样式
|
|
|
|
|
color: 'rgba(0,0,0,.45)', // 树图边的颜色
|
|
|
|
|
width: 2, // 树图边的宽度
|
|
|
|
|
curveness: 0.5, // 树图边的曲度
|
|
|
|
|
shadowColor: 'rgba(0, 0, 0, 0.5)', // 阴影颜色
|
|
|
|
|
shadowBlur: 6 // 图形阴影的模糊大小
|
|
|
|
|
},
|
|
|
|
|
label: { // 高亮标签的文本样式
|
|
|
|
|
color: '#333',
|
|
|
|
|
fontWeight: 600
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
blur: { // 淡出状态的相关配置，开启emphasis.focus后有效
|
|
|
|
|
itemStyle: {}, // 节点的样式
|
|
|
|
|
lineStyle: {}, // 树图边的样式
|
|
|
|
|
label: {} // 淡出标签的文本样式
|
|
|
|
|
},
|
|
|
|
|
leaves: {
|
|
|
|
|
label: {
|
|
|
|
|
leaves: { // 叶子节点的特殊配置
|
|
|
|
|
label: { // 叶子节点的文本标签样式
|
|
|
|
|
// distance: 8,
|
|
|
|
|
// color: '#1890FF',
|
|
|
|
|
position: 'right',
|
|
|
|
|
verticalAlign: 'middle',
|
|
|
|
|
align: 'left'
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
emphasis: {
|
|
|
|
|
focus: 'descendant'
|
|
|
|
|
align: 'center'
|
|
|
|
|
},
|
|
|
|
|
itemStyle: {}, // 叶子节点的样式
|
|
|
|
|
emphasis: {}, // 叶子节点高亮状态的配置
|
|
|
|
|
blur: {}, // 叶子节点淡出状态的配置
|
|
|
|
|
select: {} // 叶子节点选中状态的配置
|
|
|
|
|
},
|
|
|
|
|
expandAndCollapse: false,//开启展开收起功能
|
|
|
|
|
animationDuration: 550,
|
|
|
|
|
animationDurationUpdate: 750 // 动画更新时间
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
},
|
|
|
|
|
searchContent: ''
|
|
|
|
|
animation: true, // 是否开启动画
|
|
|
|
|
expandAndCollapse: false, // 子树折叠和展开的交互，默认打开
|
|
|
|
|
animationDuration: 550, // 初始动画的时长
|
|
|
|
|
animationEasing: 'linear', // 初始动画的缓动效果
|
|
|
|
|
animationDelay: 0, // 初始动画的延迟
|
|
|
|
|
animationDurationUpdate: 750, // 数据更新动画的时长
|
|
|
|
|
animationEasingUpdate: 'cubicInOut', // 数据更新动画的缓动效果
|
|
|
|
|
animationDelayUpdate: 0 // 数据更新动画的延迟
|
|
|
|
|
}]
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
searchContent: '',
|
|
|
|
|
showChart: true,
|
|
|
|
|
fileList: [],
|
|
|
|
|
showNewsDialog: false,
|
|
|
|
|
fileSrc: '',
|
|
|
|
|
fileTitle: '',
|
|
|
|
|
schemeId: '', //硒产业文件搜索id
|
|
|
|
|
filetype: '', //点击标准统计 本地标准传参
|
|
|
|
|
myChart: null
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
@ -173,9 +270,11 @@ export default {
|
|
|
|
|
this.$store.commit('SET_ROUTERINFO', this.$route.meta)
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
|
|
|
|
|
this.standardSystemStatistics()
|
|
|
|
|
this.standardSystem()
|
|
|
|
|
window.addEventListener("resize", () => {
|
|
|
|
|
this.myChart.resize();
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
// 硒产业标准体系
|
|
|
|
|
@ -184,55 +283,52 @@ export default {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
this.topList = res.data.slice(0, 2)
|
|
|
|
|
this.bottomList = res.data.slice(2, 5)
|
|
|
|
|
// console.log(this.topList, this.bottomList)
|
|
|
|
|
|
|
|
|
|
Object.keys(res.data[0]).length && this.ckickItem(res.data[0].id, res.data[0].schemeName)
|
|
|
|
|
this.schemeId = res.data[0].parentId
|
|
|
|
|
Object.keys(res.data[0]).length && this.getSchemeTree(res.data[0].parentId, res.data[0].schemeName)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 标准统计
|
|
|
|
|
// 标准统计 本地标准
|
|
|
|
|
standardSystem() {
|
|
|
|
|
standardSystem().then(res => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
for (const key in res.data) {
|
|
|
|
|
if (key == '国家标准') {
|
|
|
|
|
this.gjList = {
|
|
|
|
|
name: key,
|
|
|
|
|
num: res.data[key]
|
|
|
|
|
}
|
|
|
|
|
this.countryList = res.data.国家标准
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
if (key == '行业标准') {
|
|
|
|
|
this.hyList = {
|
|
|
|
|
name: key,
|
|
|
|
|
num: res.data[key]
|
|
|
|
|
}
|
|
|
|
|
this.hyList = res.data.行业标准
|
|
|
|
|
}
|
|
|
|
|
if (key == '省级地方标准') {
|
|
|
|
|
this.sjList = {
|
|
|
|
|
name: key,
|
|
|
|
|
num: res.data[key]
|
|
|
|
|
}
|
|
|
|
|
this.sjList = res.data.省级地方标准
|
|
|
|
|
}
|
|
|
|
|
if (key == '待编制标准') {
|
|
|
|
|
this.dbzList = {
|
|
|
|
|
name: key,
|
|
|
|
|
num: res.data[key]
|
|
|
|
|
this.dbzList = res.data.待编制标准
|
|
|
|
|
}
|
|
|
|
|
if(key == '总数'){
|
|
|
|
|
this.allList = {
|
|
|
|
|
key:key,
|
|
|
|
|
value:res.data[key]
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (key == '本地标准') {
|
|
|
|
|
this.bdList = {
|
|
|
|
|
name: key,
|
|
|
|
|
num: res.data[key]
|
|
|
|
|
}
|
|
|
|
|
this.bdList = res.data.本地标准
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.sgowBox = true
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
console.log(this.gjList)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 点击硒产业统计标准
|
|
|
|
|
ckickItem(id, fatherData) {
|
|
|
|
|
this.schemeId = id
|
|
|
|
|
this.filetype = ""
|
|
|
|
|
this.showChart = true
|
|
|
|
|
this.getSchemeTree(id, fatherData)
|
|
|
|
|
},
|
|
|
|
|
// 树数据
|
|
|
|
|
getSchemeTree(id, fatherData) {
|
|
|
|
|
console.log(fatherData)
|
|
|
|
|
let params = {
|
|
|
|
|
parentId: id
|
|
|
|
|
@ -241,146 +337,85 @@ export default {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
let nweDate = [], echartsData = []
|
|
|
|
|
if (res.data.length) {
|
|
|
|
|
nweDate = res.data.map(item => {
|
|
|
|
|
return {
|
|
|
|
|
name: item.schemeName
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
echartsData = [{ name: fatherData, children: [...nweDate] }]
|
|
|
|
|
nweDate = this.dealData(res.data)
|
|
|
|
|
echartsData = [{ name: '硒产业标准体系统计', schemeId: id, children: [...nweDate] }]
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
console.log('树状图数据', echartsData)
|
|
|
|
|
this.initEcharts(echartsData)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
dealData(data) {
|
|
|
|
|
console.log(4444, data)
|
|
|
|
|
var treeData = []
|
|
|
|
|
data.forEach(item => {
|
|
|
|
|
item.name = item.schemeName
|
|
|
|
|
item.schemeId = item.parentId
|
|
|
|
|
treeData.push({ ...item })
|
|
|
|
|
if (item.children) {
|
|
|
|
|
console.log([item.children])
|
|
|
|
|
this.dealData(item.children)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
return treeData
|
|
|
|
|
},
|
|
|
|
|
initEcharts(echartsData) {
|
|
|
|
|
var chartDom = document.getElementById('bztx');
|
|
|
|
|
var myChart = this.$echarts.init(chartDom);
|
|
|
|
|
|
|
|
|
|
// const data = {
|
|
|
|
|
// name: 'flare',
|
|
|
|
|
// children: [
|
|
|
|
|
// {
|
|
|
|
|
// name: 'data',
|
|
|
|
|
// children: [
|
|
|
|
|
// {
|
|
|
|
|
// name: 'converters',
|
|
|
|
|
// children: [
|
|
|
|
|
// { name: 'Converters', value: 721 },
|
|
|
|
|
// { name: 'DelimitedTextConverter', value: 4294 }
|
|
|
|
|
// ]
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// name: 'DataUtil',
|
|
|
|
|
// value: 3322
|
|
|
|
|
// }
|
|
|
|
|
// ]
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// name: 'display',
|
|
|
|
|
// children: [
|
|
|
|
|
// { name: 'DirtySprite', value: 8833 },
|
|
|
|
|
// { name: 'LineSprite', value: 1732 },
|
|
|
|
|
// { name: 'RectSprite', value: 3623 }
|
|
|
|
|
// ]
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// name: 'flex',
|
|
|
|
|
// children: [{ name: 'FlareVis', value: 4116 }]
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// name: 'query',
|
|
|
|
|
// children: [
|
|
|
|
|
// { name: 'AggregateExpression', value: 1616 },
|
|
|
|
|
// { name: 'And', value: 1027 },
|
|
|
|
|
// { name: 'Arithmetic', value: 3891 },
|
|
|
|
|
// { name: 'Average', value: 891 },
|
|
|
|
|
// { name: 'BinaryExpression', value: 2893 },
|
|
|
|
|
// { name: 'Comparison', value: 5103 },
|
|
|
|
|
// { name: 'CompositeExpression', value: 3677 },
|
|
|
|
|
// { name: 'Count', value: 781 },
|
|
|
|
|
// { name: 'DateUtil', value: 4141 },
|
|
|
|
|
// { name: 'Distinct', value: 933 },
|
|
|
|
|
// { name: 'Expression', value: 5130 },
|
|
|
|
|
// { name: 'ExpressionIterator', value: 3617 },
|
|
|
|
|
// { name: 'Fn', value: 3240 },
|
|
|
|
|
// { name: 'If', value: 2732 },
|
|
|
|
|
// { name: 'IsA', value: 2039 },
|
|
|
|
|
// { name: 'Literal', value: 1214 },
|
|
|
|
|
// { name: 'Match', value: 3748 },
|
|
|
|
|
// { name: 'Maximum', value: 843 },
|
|
|
|
|
// {
|
|
|
|
|
// name: 'methods',
|
|
|
|
|
// children: [
|
|
|
|
|
// { name: 'add', value: 593 },
|
|
|
|
|
// { name: 'and', value: 330 },
|
|
|
|
|
// { name: 'average', value: 287 },
|
|
|
|
|
// { name: 'count', value: 277 },
|
|
|
|
|
// { name: 'distinct', value: 292 },
|
|
|
|
|
// { name: 'div', value: 595 },
|
|
|
|
|
// { name: 'eq', value: 594 },
|
|
|
|
|
// { name: 'fn', value: 460 },
|
|
|
|
|
// { name: 'gt', value: 603 },
|
|
|
|
|
// { name: 'gte', value: 625 },
|
|
|
|
|
// { name: 'iff', value: 748 },
|
|
|
|
|
// { name: 'isa', value: 461 },
|
|
|
|
|
// { name: 'lt', value: 597 },
|
|
|
|
|
// { name: 'lte', value: 619 },
|
|
|
|
|
// { name: 'max', value: 283 },
|
|
|
|
|
// { name: 'min', value: 283 },
|
|
|
|
|
// { name: 'mod', value: 591 },
|
|
|
|
|
// { name: 'mul', value: 603 },
|
|
|
|
|
// { name: 'neq', value: 599 },
|
|
|
|
|
// { name: 'not', value: 386 },
|
|
|
|
|
// { name: 'or', value: 323 },
|
|
|
|
|
// { name: 'orderby', value: 307 },
|
|
|
|
|
// { name: 'range', value: 772 },
|
|
|
|
|
// { name: 'select', value: 296 },
|
|
|
|
|
// { name: 'stddev', value: 363 },
|
|
|
|
|
// { name: 'sub', value: 600 },
|
|
|
|
|
// { name: 'sum', value: 280 },
|
|
|
|
|
// { name: 'update', value: 307 },
|
|
|
|
|
// { name: 'variance', value: 335 },
|
|
|
|
|
// { name: 'where', value: 299 },
|
|
|
|
|
// { name: 'xor', value: 354 },
|
|
|
|
|
// { name: 'x_x', value: 264 }
|
|
|
|
|
// ]
|
|
|
|
|
// },
|
|
|
|
|
// { name: 'Minimum', value: 843 },
|
|
|
|
|
// { name: 'Not', value: 1554 },
|
|
|
|
|
// { name: 'Or', value: 970 },
|
|
|
|
|
// { name: 'Query', value: 13896 },
|
|
|
|
|
// { name: 'Range', value: 1594 },
|
|
|
|
|
// { name: 'StringUtil', value: 4130 },
|
|
|
|
|
// { name: 'Sum', value: 791 },
|
|
|
|
|
// { name: 'Variable', value: 1124 },
|
|
|
|
|
// { name: 'Variance', value: 1876 },
|
|
|
|
|
// { name: 'Xor', value: 1101 }
|
|
|
|
|
// ]
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// name: 'scale',
|
|
|
|
|
// children: [
|
|
|
|
|
// { name: 'IScaleMap', value: 2105 },
|
|
|
|
|
// { name: 'LinearScale', value: 1316 },
|
|
|
|
|
// { name: 'LogScale', value: 3151 },
|
|
|
|
|
// { name: 'OrdinalScale', value: 3770 },
|
|
|
|
|
// { name: 'QuantileScale', value: 2435 },
|
|
|
|
|
// { name: 'QuantitativeScale', value: 4839 },
|
|
|
|
|
// { name: 'RootScale', value: 1756 },
|
|
|
|
|
// { name: 'Scale', value: 4268 },
|
|
|
|
|
// { name: 'ScaleType', value: 1821 },
|
|
|
|
|
// { name: 'TimeScale', value: 5833 }
|
|
|
|
|
// ]
|
|
|
|
|
// }
|
|
|
|
|
// ]
|
|
|
|
|
// };
|
|
|
|
|
|
|
|
|
|
this.myChart = this.$echarts.init(chartDom);
|
|
|
|
|
this.option.series[0].data = echartsData
|
|
|
|
|
console.log(9999, this.option.series[0].data)
|
|
|
|
|
this.option && myChart.setOption(this.option);
|
|
|
|
|
//树绑定事件
|
|
|
|
|
let that = this
|
|
|
|
|
this.myChart.on('click', function (params) {
|
|
|
|
|
console.log('查看文档', params)
|
|
|
|
|
// 查询文档
|
|
|
|
|
// params.data.name
|
|
|
|
|
that.getStandardSystemQuery('');
|
|
|
|
|
});
|
|
|
|
|
this.option && this.myChart.setOption(this.option);
|
|
|
|
|
},
|
|
|
|
|
// 搜索文件
|
|
|
|
|
getStandardSystemQuery(filename) {
|
|
|
|
|
console.log('搜索', filename)
|
|
|
|
|
let params = {
|
|
|
|
|
filename,
|
|
|
|
|
schemeId: this.schemeId,
|
|
|
|
|
filetype: this.filetype,
|
|
|
|
|
}
|
|
|
|
|
standardSystemQuery(params).then(res => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
this.fileList = res.data
|
|
|
|
|
this.showChart = false
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 点击文件
|
|
|
|
|
clickFile(item) {
|
|
|
|
|
this.showNewsDialog = true
|
|
|
|
|
this.fileTitle = item.fileName
|
|
|
|
|
this.fileSrc = process.env.VUE_APP_PATH_PRE + item.filePath
|
|
|
|
|
},
|
|
|
|
|
// 搜索文件
|
|
|
|
|
enterKeyup() {
|
|
|
|
|
this.showChart = false
|
|
|
|
|
this.getStandardSystemQuery(this.searchContent, '')
|
|
|
|
|
},
|
|
|
|
|
// 点击标准统计
|
|
|
|
|
clickBztj(value) {
|
|
|
|
|
this.filetype = value
|
|
|
|
|
// this.schemeId = ""
|
|
|
|
|
this.getStandardSystemQuery()
|
|
|
|
|
console.log(value)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
searchContent(value) {
|
|
|
|
|
if (value.length == 0) {
|
|
|
|
|
console.log('监听')
|
|
|
|
|
this.showChart = true
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
@ -398,7 +433,6 @@ export default {
|
|
|
|
|
position: relative;
|
|
|
|
|
top: 7.8vh;
|
|
|
|
|
height: calc(100% - 7.8vh);
|
|
|
|
|
// border: 1px solid red;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
padding: 0 10px;
|
|
|
|
|
display: flex;
|
|
|
|
|
@ -462,7 +496,7 @@ export default {
|
|
|
|
|
|
|
|
|
|
.bztj-card {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 240px;
|
|
|
|
|
height: 26.086vh;
|
|
|
|
|
background-image: url('../../../public/images/bztxcard.png');
|
|
|
|
|
background-size: 99% 100%;
|
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
|
@ -486,42 +520,65 @@ export default {
|
|
|
|
|
.gj,
|
|
|
|
|
.hy,
|
|
|
|
|
.sj,
|
|
|
|
|
.dbz {
|
|
|
|
|
.dbz,
|
|
|
|
|
.all {
|
|
|
|
|
width: 100px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
position: absolute;
|
|
|
|
|
// border: 1px solid red;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.gj {
|
|
|
|
|
left: 0;
|
|
|
|
|
top: -10px;
|
|
|
|
|
// border: 1px solid red;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.gj:hover {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hy {
|
|
|
|
|
right: 0;
|
|
|
|
|
top: -10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.hy:hover {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.sj {
|
|
|
|
|
left: 0;
|
|
|
|
|
bottom: 35px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.sj:hover {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dbz {
|
|
|
|
|
right: 0;
|
|
|
|
|
bottom: 35px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dbz:hover {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.all {
|
|
|
|
|
left: 150px;
|
|
|
|
|
top:5.978vh;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.all:hover {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.bd {
|
|
|
|
|
.item {
|
|
|
|
|
margin: auto;
|
|
|
|
|
height: 100px;
|
|
|
|
|
height: 10.87vh;
|
|
|
|
|
width: 40%;
|
|
|
|
|
// border: 1px solid red;
|
|
|
|
|
background-image: url('../../../public/images/xcybg.png');
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
background-position-y: 15px;
|
|
|
|
|
@ -562,13 +619,18 @@ export default {
|
|
|
|
|
|
|
|
|
|
.search-wrap {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
height: 50px;
|
|
|
|
|
height: 5.435vh;
|
|
|
|
|
width: 100%;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
padding-right: 20px;
|
|
|
|
|
|
|
|
|
|
.imgs {
|
|
|
|
|
width: 30px;
|
|
|
|
|
margin-left: 20px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.search {
|
|
|
|
|
width: 150px;
|
|
|
|
|
width: 100%;
|
|
|
|
|
@ -579,18 +641,97 @@ export default {
|
|
|
|
|
border: 1px solid;
|
|
|
|
|
border-image: linear-gradient(124deg, rgb(119, 194, 251), rgb(43, 101, 215), rgb(43, 101, 215)) 1 1;
|
|
|
|
|
background: none;
|
|
|
|
|
height: 30px;
|
|
|
|
|
height: 3.261vh;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.charts {
|
|
|
|
|
.flexs {
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.charts,
|
|
|
|
|
.contents {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: calc(100% - 50px);
|
|
|
|
|
height: calc(100% - 3.261vh);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.contents {
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
padding: 20px 0 0 20px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
|
|
|
|
.item {
|
|
|
|
|
width: 200px;
|
|
|
|
|
height: 21.74vh;
|
|
|
|
|
margin: 0 20px 2.174vh 0;
|
|
|
|
|
|
|
|
|
|
.imgWrap {
|
|
|
|
|
margin: 20px auto;
|
|
|
|
|
width: 100px;
|
|
|
|
|
height: 10.87vh;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item:hover {
|
|
|
|
|
background-image: url('../../../public/images/pdfbg.png');
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.nodata {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 650px;
|
|
|
|
|
line-height: 650px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-size: 20px;
|
|
|
|
|
opacity: 0.7;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/deep/ .el-dialog__title {
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/deep/ .el-dialog__body {
|
|
|
|
|
padding: 0 20px 20px;
|
|
|
|
|
height: 69.565vh;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/deep/.el-dialog__wrapper {
|
|
|
|
|
// position: absolute !important;
|
|
|
|
|
margin: auto;
|
|
|
|
|
height: 86.956vh;
|
|
|
|
|
width: 60%;
|
|
|
|
|
background-image: url('../../../public/images/vediobg.png');
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/deep/ .el-dialog {
|
|
|
|
|
|
|
|
|
|
background: none;
|
|
|
|
|
height: 100%;
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin: 0;
|
|
|
|
|
margin-top: 0 !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
</style>
|
zhy521521
12 months ago
