fanzhen 1209
This commit is contained in:
fanzhen123
34
package-lock.json
generated
34
package-lock.json
generated
@@ -3566,8 +3566,8 @@
|
||||
},
|
||||
"complex.js": {
|
||||
"version": "2.0.11",
|
||||
"resolved": "https://registry.npmjs.org/complex.js/-/complex.js-2.0.11.tgz",
|
||||
"integrity": "sha512-6IArJLApNtdg1P1dFtn3dnyzoZBEF0MwMnrfF1exSBRpZYoy4yieMkpZhQDC0uwctw48vii0CFVyHfpgZ/DfGw=="
|
||||
"resolved": "https://registry.npm.taobao.org/complex.js/download/complex.js-2.0.11.tgz",
|
||||
"integrity": "sha1-Cahz+/Ff/YwYycIgHM70JcMri/E="
|
||||
},
|
||||
"component-emitter": {
|
||||
"version": "1.3.0",
|
||||
@@ -4404,8 +4404,8 @@
|
||||
},
|
||||
"decimal.js": {
|
||||
"version": "10.2.0",
|
||||
"resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.2.0.tgz",
|
||||
"integrity": "sha512-vDPw+rDgn3bZe1+F/pyEwb1oMG2XTlRVgAa6B4KccTEpYgF8w6eQllVbQcfIJnZyvzFtFpxnpGtx8dd7DJp/Rw=="
|
||||
"resolved": "https://registry.npm.taobao.org/decimal.js/download/decimal.js-10.2.0.tgz",
|
||||
"integrity": "sha1-OUZhE6ngNhEdAvgkibX9awte0jE="
|
||||
},
|
||||
"decode-uri-component": {
|
||||
"version": "0.2.0",
|
||||
@@ -5081,8 +5081,8 @@
|
||||
},
|
||||
"escape-latex": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/escape-latex/-/escape-latex-1.2.0.tgz",
|
||||
"integrity": "sha512-nV5aVWW1K0wEiUIEdZ4erkGGH8mDxGyxSeqPzRNtWP7ataw+/olFObw7hujFWlVjNsaDFw5VZ5NzVSIqRgfTiw=="
|
||||
"resolved": "https://registry.npm.taobao.org/escape-latex/download/escape-latex-1.2.0.tgz",
|
||||
"integrity": "sha1-B8A4GM99rCUMzlF/T9obAB7yvKE="
|
||||
},
|
||||
"escape-string-regexp": {
|
||||
"version": "1.0.5",
|
||||
@@ -6400,8 +6400,8 @@
|
||||
},
|
||||
"fraction.js": {
|
||||
"version": "4.0.12",
|
||||
"resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.0.12.tgz",
|
||||
"integrity": "sha512-8Z1K0VTG4hzYY7kA/1sj4/r1/RWLBD3xwReT/RCrUCbzPszjNQCCsy3ktkU/eaEqX3MYa4pY37a52eiBlPMlhA=="
|
||||
"resolved": "https://registry.npm.taobao.org/fraction.js/download/fraction.js-4.0.12.tgz",
|
||||
"integrity": "sha1-BSbUfGWl+0hU33i8d/e+xwjXuMM="
|
||||
},
|
||||
"fragment-cache": {
|
||||
"version": "0.2.1",
|
||||
@@ -8473,7 +8473,7 @@
|
||||
},
|
||||
"javascript-natural-sort": {
|
||||
"version": "0.7.1",
|
||||
"resolved": "https://registry.npmjs.org/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/javascript-natural-sort/download/javascript-natural-sort-0.7.1.tgz",
|
||||
"integrity": "sha1-+eIwPUUH9tdDVac2ZNFED7Wg71k="
|
||||
},
|
||||
"javascript-stringify": {
|
||||
@@ -10058,9 +10058,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"mathjs": {
|
||||
"version": "6.2.3",
|
||||
"resolved": "https://registry.npmjs.org/mathjs/-/mathjs-6.2.3.tgz",
|
||||
"integrity": "sha512-IEYTyz8tu7nslF4j2TtDs7C+9Emi2/iJTYXjc5WLoIKTJOLLtjp3Aglys0ZbV9KSiaJhpfGPLXm8Z5d7vEGN3w==",
|
||||
"version": "6.2.5",
|
||||
"resolved": "https://registry.npm.taobao.org/mathjs/download/mathjs-6.2.5.tgz",
|
||||
"integrity": "sha1-jn9XF6QIMQD8/Mcgh4h6qU1LKd8=",
|
||||
"requires": {
|
||||
"complex.js": "2.0.11",
|
||||
"decimal.js": "10.2.0",
|
||||
@@ -13074,7 +13074,7 @@
|
||||
},
|
||||
"seed-random": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/seed-random/-/seed-random-2.2.0.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/seed-random/download/seed-random-2.2.0.tgz",
|
||||
"integrity": "sha1-KpsZ4lCoFwmSMaW5mk2vgLf77VQ="
|
||||
},
|
||||
"select-hose": {
|
||||
@@ -14349,8 +14349,8 @@
|
||||
},
|
||||
"tiny-emitter": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
|
||||
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
|
||||
"resolved": "https://registry.npm.taobao.org/tiny-emitter/download/tiny-emitter-2.1.0.tgz",
|
||||
"integrity": "sha1-HRpW7fxRxD6GPLtTgqcjMONVVCM="
|
||||
},
|
||||
"tmp": {
|
||||
"version": "0.0.33",
|
||||
@@ -14561,8 +14561,8 @@
|
||||
},
|
||||
"typed-function": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/typed-function/-/typed-function-1.1.1.tgz",
|
||||
"integrity": "sha512-RbN7MaTQBZLJYzDENHPA0nUmWT0Ex80KHItprrgbTPufYhIlTePvCXZxyQK7wgn19FW5bnuaBIKcBb5mRWjB1Q=="
|
||||
"resolved": "https://registry.npm.taobao.org/typed-function/download/typed-function-1.1.1.tgz",
|
||||
"integrity": "sha1-oTFhh+w2KMniGbkcqWkYZgoQE44="
|
||||
},
|
||||
"typedarray": {
|
||||
"version": "0.0.6",
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
"echarts": "^4.4.0",
|
||||
"element-resize-detector": "^1.1.15",
|
||||
"element-ui": "^2.12.0",
|
||||
"mathjs": "^6.2.3",
|
||||
"mathjs": "^6.2.5",
|
||||
"splitpanes": "^2.0.0",
|
||||
"vue": "^2.6.10",
|
||||
"vue-awesome-swiper": "^3.1.3",
|
||||
|
||||
@@ -122,6 +122,126 @@ class computedFunc {
|
||||
}
|
||||
console.log(this.transBeforeData)
|
||||
}
|
||||
// 初始化所有的数据
|
||||
initAllData () {
|
||||
// 处理好的数据需要返回的值 ===========all
|
||||
this.restur = {
|
||||
// 表头数据
|
||||
tableLine: [],
|
||||
// 总数据处理
|
||||
countData: [],
|
||||
// 计算次数
|
||||
computedNum: 0
|
||||
}
|
||||
// 处理好的转置数据
|
||||
this.transData = []
|
||||
// 处理好的图表数据======>折线、柱状图
|
||||
this.chartsDatazz = {
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
bottom: 0,
|
||||
data: ['蒸发量', '降水量']
|
||||
// zlevel: 1
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross'
|
||||
}
|
||||
},
|
||||
calculable: true,
|
||||
grid: {
|
||||
top: '7%',
|
||||
left: '1%',
|
||||
bottom: '9%',
|
||||
containLabel: true
|
||||
|
||||
},
|
||||
xAxis: [{
|
||||
type: 'category',
|
||||
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
|
||||
}],
|
||||
yAxis: [{
|
||||
type: 'value',
|
||||
splitNumber: 4
|
||||
}],
|
||||
series: [{
|
||||
name: '蒸发量',
|
||||
type: 'bar',
|
||||
data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
|
||||
},
|
||||
{
|
||||
name: '降水量',
|
||||
type: 'bar',
|
||||
data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
|
||||
}
|
||||
]
|
||||
}
|
||||
// 饼图数据
|
||||
this.chartsDatazzPie = {
|
||||
// title: {
|
||||
// text: '某站点用户访问来源',
|
||||
// subtext: '纯属虚构',
|
||||
// x: 'center'
|
||||
// },
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: '{a} <br/>{b} : {c} ({d}%)'
|
||||
},
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
bottom: '0',
|
||||
data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎', 'jhjgbh', '45445455445']
|
||||
},
|
||||
series: [{
|
||||
name: '访问来源',
|
||||
type: 'pie',
|
||||
radius: '55%',
|
||||
center: ['50%', '50%'],
|
||||
data: [{
|
||||
value: 335,
|
||||
name: '直接访问'
|
||||
},
|
||||
{
|
||||
value: 310,
|
||||
name: '邮件营销'
|
||||
},
|
||||
{
|
||||
value: 234,
|
||||
name: '联盟广告'
|
||||
},
|
||||
{
|
||||
value: 135,
|
||||
name: '视频广告'
|
||||
},
|
||||
{
|
||||
value: 1548,
|
||||
name: '搜索引擎'
|
||||
},
|
||||
{
|
||||
value: 15458,
|
||||
name: 'jhjgbh'
|
||||
},
|
||||
{
|
||||
value: 15458,
|
||||
name: '45445455445'
|
||||
}
|
||||
],
|
||||
itemStyle: {
|
||||
emphasis: {
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
}]
|
||||
}
|
||||
// 选中数据 ==========input
|
||||
this.selectData = {
|
||||
// 表头数据
|
||||
tableLine: [],
|
||||
// 总数据处理
|
||||
countData: []
|
||||
}
|
||||
}
|
||||
// 处理input选中数据
|
||||
inputSelectData (listArr, lineArr) { // listArr 列选中的数组 //line行选中的数组
|
||||
// 重定向数组
|
||||
@@ -963,5 +1083,49 @@ class computedFunc {
|
||||
console.log(this.chartsDatazzPie, 'this.chartsDatazzPie')
|
||||
return this.chartsDatazzPie
|
||||
}
|
||||
// 导出至EXcel tableData:表数据 tableLine：列数据 listInputVal:选中列下标 lineInputVal：选中行下标
|
||||
insertCollectS (tableData, tableLine, listInputVal, lineInputVal) {
|
||||
// 定义一个对象用来分发数据
|
||||
let objData = {
|
||||
header: null,
|
||||
tableData: null
|
||||
}
|
||||
let yuan = JSON.parse(JSON.stringify(listInputVal))
|
||||
yuan.unshift(0)
|
||||
// 除了第一行剩下的行的所有选中的数据
|
||||
let shHangData = []
|
||||
// 第一行所有选中的数据
|
||||
// let hangAllDatas=[]
|
||||
// let hangAllDatas = tableLine.filter((item, index) => {
|
||||
// return listInputVal.indexOf(index) !== -1
|
||||
// }).map((item, index) => {
|
||||
// return item.label
|
||||
// })
|
||||
// lastAllData.push(hangAllDatas)
|
||||
shHangData = tableData.map((item, index) => {
|
||||
// console.log(Object.values(item).filter((list, key) => { return yuan.indexOf(key) !== -1 }))
|
||||
// tableData.forEach((list, key) => {
|
||||
return Object.values(item).filter((list, key) => { return yuan.indexOf(key) !== -1 })
|
||||
// })
|
||||
}).filter((item, index) => {
|
||||
return lineInputVal.indexOf(index) !== -1
|
||||
})
|
||||
let hangAllDatas = yuan.map((item, index) => {
|
||||
return tableLine[item].label
|
||||
})
|
||||
// shHangData.unshift(hangAllDatas)
|
||||
objData.header = hangAllDatas.map((item, index) => {
|
||||
return [item, index]
|
||||
})
|
||||
objData.tableData = shHangData
|
||||
// 导出的数据
|
||||
// console.log(objData, '导出的数据')
|
||||
return objData
|
||||
}
|
||||
// 新增指标
|
||||
// 参数 labelState：hang/lie 行列状态 labelName新增指标名称 表达式expression 表达式中指标对应的下标labelDownB type：array
|
||||
insertLabelCom (labelState, labelName, expression, labelDownB) {
|
||||
|
||||
}
|
||||
}
|
||||
export default computedFunc
|
||||
|
||||
@@ -9,13 +9,15 @@
|
||||
<input type="text" placeholder="请输入名称" v-model="nameCollect" />
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div>保存</div>
|
||||
<div @click="baoCun()">保存</div>
|
||||
<div @click="$store.state.addCollectState=false">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入数据计算js用于机选渲染的数据
|
||||
import ComputedData from '../../assets/js/computeddata'
|
||||
export default {
|
||||
name: 'addCollect',
|
||||
data () {
|
||||
@@ -23,6 +25,41 @@ export default {
|
||||
imgUrl: require('../../../static/nav/deleteImg.png'),
|
||||
nameCollect: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
nameCollect (val) {
|
||||
this.$store.state.nameCollect = val
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
baoCun () {
|
||||
if (this.$store.state.nameCollect !== '') {
|
||||
let brt = new ComputedData()
|
||||
this.$axios({
|
||||
method: 'POST',
|
||||
url: 'member/index/add',
|
||||
data: {
|
||||
type: this.$route.query.type === 'area' ? 2 : 1,
|
||||
adv: this.$store.state.searchState,
|
||||
classify_id: this.$store.state.selectDataLeft.id,
|
||||
// 简单查询/高级查询
|
||||
data: this.$store.state.searchState === 1 ? [] : brt.insertCollectS(this.$store.state.tableData, this.$store.state.tableLine, this.$store.state.listInputVal, this.$store.state.lineInputVal),
|
||||
name: this.$store.state.nameCollect
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '高级查询数据展示')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
alert('添加成功')
|
||||
this.$store.state.addCollectState = false
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
} else {
|
||||
alert('您添加的收藏名称不能为空！请重新填写！')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -8,7 +8,6 @@
|
||||
<el-row class="tac" style="overflow: auto;height:44.875rem;">
|
||||
<el-col :span="24">
|
||||
<el-menu
|
||||
default-active="1-1-1"
|
||||
class="el-menu-vertical-demo"
|
||||
@open="handleOpen"
|
||||
@close="handleClose"
|
||||
@@ -54,10 +53,10 @@
|
||||
<pane min-size="48" size="47.5">
|
||||
<div class="centerNavs">
|
||||
<div class="title">
|
||||
<input type="text" placeholder="请输入你要查询的指标" />
|
||||
<div>查询</div>
|
||||
<input type="text" placeholder="请输入你要查询的指标" v-model="labelNameSDFD" />
|
||||
<div @click="searchArealy()">查询</div>
|
||||
<input type="checkbox" v-model="checkboxState" />
|
||||
<span>从结果中筛选 共3200条</span>
|
||||
<span>从结果中筛选 共{{searchDatas.length}}条</span>
|
||||
</div>
|
||||
<div class="titleContSelect">
|
||||
<span @click="clickStateOption('checkAll')">全选</span>
|
||||
@@ -73,7 +72,7 @@
|
||||
@change="clickStateOption('oneClick',index)"
|
||||
:ref="'input'+index"
|
||||
/>
|
||||
<img :src="zhibiaoImg" alt />
|
||||
<img :src="zhibiaoImg" alt @click="explainSd(item.desc)" />
|
||||
<span>{{item.nameText}}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -94,27 +93,33 @@
|
||||
@change="clickStateOption('oneClick',index)"
|
||||
:ref="'input'+index"
|
||||
/>
|
||||
<img :src="zhibiaoImg" alt />
|
||||
<img :src="zhibiaoImg" alt @click="explainSd(item.desc)" />
|
||||
<span>{{item.nameText}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</pane>
|
||||
</splitpanes>
|
||||
<!-- 指标解释 -->
|
||||
<LabelExplain v-if="$store.state.labelExplainState"></LabelExplain>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入窗口拆分组件
|
||||
import { Splitpanes, Pane } from 'splitpanes'
|
||||
import 'splitpanes/dist/splitpanes.css'
|
||||
// 指标解释
|
||||
import LabelExplain from '@/components/labelExplain/LabelExplain.vue'
|
||||
export default {
|
||||
name: 'advancedQuery',
|
||||
components: {
|
||||
Splitpanes,
|
||||
Pane
|
||||
Pane,
|
||||
LabelExplain: LabelExplain
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 默认展开
|
||||
zhibiaoImg: require('../../../static/chatCont/zhibiaojieshi.png'),
|
||||
leftCateData: null,
|
||||
checkboxState: false,
|
||||
@@ -156,12 +161,27 @@ export default {
|
||||
// 选中的指标(右侧)
|
||||
changeActive: [],
|
||||
// 右侧打钩总数
|
||||
rightGoCount: 0
|
||||
rightGoCount: 0,
|
||||
// 选中的指标展开分类id
|
||||
selectClassId: null,
|
||||
// 查询的指标
|
||||
labelNameSDFD: ''
|
||||
}
|
||||
},
|
||||
// 监听对象变化
|
||||
watch: {
|
||||
changeActive: {
|
||||
handler: function (data) {
|
||||
this.valueSearches()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleOpen (key, keyPath) {
|
||||
console.log(key, keyPath)
|
||||
this.getCateData()
|
||||
},
|
||||
handleClose (key, keyPath) {
|
||||
console.log(key, keyPath)
|
||||
@@ -177,14 +197,20 @@ export default {
|
||||
|
||||
this.searchDatas.forEach((item, index) => {
|
||||
/* eslint-disable */
|
||||
rightGoCount < 100 ? (item.inputState = true, this.changeActive.find((list, key) => { return list.nameText === item.nameText }) === undefined ? this.changeActive.push(item) : 1) : (item.inputState = false)
|
||||
this.rightGoCount < 100 ? (item.inputState = true, this.changeActive.find((list, key) => { return list.nameText === item.nameText }) === undefined ? this.changeActive.push(item) : 1) : (item.inputState = false)
|
||||
})
|
||||
this.rightGoCount = this.searchDatas.length
|
||||
break
|
||||
case 'inverse':// 反选
|
||||
let numSd = []
|
||||
this.searchDatas.forEach((item, index) => {
|
||||
/* eslint-disable */
|
||||
rightGoCount < 100 ? (item.inputState = !item.inputState, this.changeActive.find((list, key) => { return list.nameText === item.nameText }) === undefined ? this.changeActive.push(item) : 1) : (item.inputState = false)
|
||||
this.rightGoCount < 100 ? (item.inputState = !item.inputState, this.changeActive.find((list, key) => { return list.nameText === item.nameText }) === undefined ? this.changeActive.push(item) : 1) : (item.inputState = false)
|
||||
if (item.inputState) {
|
||||
numSd.push(item.inputState)
|
||||
}
|
||||
})
|
||||
this.rightGoCount = numSd.length
|
||||
break
|
||||
case 'empty':// 清空
|
||||
this.searchDatas = []
|
||||
@@ -209,6 +235,9 @@ export default {
|
||||
prev[next] = (prev[next] + 1) || 1
|
||||
return prev
|
||||
}, {})['true']
|
||||
if (this.rightGoCount === undefined) {
|
||||
this.rightGoCount = 0
|
||||
}
|
||||
break
|
||||
}
|
||||
},
|
||||
@@ -225,10 +254,90 @@ export default {
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
this.leftCateData = res.data.data.list
|
||||
this.selectClassId = this.leftCateData[0].id
|
||||
console.log(this.selectClassId,'this.selectClassId000')
|
||||
this.searchArealy()
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
},
|
||||
// 高级查询指标数据
|
||||
searchDatasf() {
|
||||
this.$axios({
|
||||
method: 'GET',
|
||||
url: 'data/data/quota',
|
||||
params: {
|
||||
id: this.selectClassId //分类id
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '高级查询指标数据')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
this.searchDatas = res.data.data.list.map((item, index) => {
|
||||
return {
|
||||
// input选中状态
|
||||
inputState: false,
|
||||
// 指标解释显示状态
|
||||
zbjsState: false,
|
||||
// 指标名称
|
||||
nameText: item.name,
|
||||
id: item.id,
|
||||
name: item.name
|
||||
}
|
||||
})
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
},
|
||||
// 按照指标名称从已有的指标集中查询
|
||||
searchArealy() {
|
||||
// if (this.labelNameSDFD !== '') {
|
||||
this.$axios({
|
||||
method: 'GET',
|
||||
url: 'data/data/search',
|
||||
params: {
|
||||
id: this.selectClassId, //分类id
|
||||
key: this.labelNameSDFD //搜索关键词
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '查询指标数据')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
this.searchDatas = res.data.data.list.map((item, index) => {
|
||||
return {
|
||||
// input选中状态
|
||||
inputState: false,
|
||||
// 指标解释显示状态
|
||||
zbjsState: false,
|
||||
// 指标名称
|
||||
nameText: item.name,
|
||||
id: item.id,
|
||||
classify_id: item.classify_id,
|
||||
desc: item.desc,
|
||||
name: item.name
|
||||
}
|
||||
})
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
// } else {
|
||||
// alert('查询的指标名称不能为空！')
|
||||
// }
|
||||
|
||||
},
|
||||
// 点击查询数据代参数跳到简单查询，高级查询数据
|
||||
valueSearches() {
|
||||
this.$store.state.advanceData = this.changeActive.filter((item, index) => {
|
||||
return item.inputState === true
|
||||
})
|
||||
},
|
||||
// 指标解释
|
||||
explainSd(expl) {
|
||||
this.$store.state.labelExplainData = expl
|
||||
this.$store.state.labelExplainState = true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@@ -245,7 +354,7 @@ export default {
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
border: 1px solid red;
|
||||
// border: 1px solid red;
|
||||
.leftNavS {
|
||||
width: 100%;
|
||||
height: 50rem;
|
||||
|
||||
@@ -1,72 +1,75 @@
|
||||
<template>
|
||||
<div class="chartsCont" v-if="transBefore.tableExplain!==''">
|
||||
<Echarts
|
||||
v-if="indStatic!==0"
|
||||
:echartsDatarts="echartsDatarts"
|
||||
@rowColInd="rowColInd"
|
||||
:echartsDatartsPie="echartsDatartsPie"
|
||||
></Echarts>
|
||||
<el-table :data="tableData" style="width: 100%" height="360" ref="table">
|
||||
<!-- <el-table-column fixed prop="date" label="日期" width="150" sortable></el-table-column>
|
||||
<el-table-column prop="name" label="姓名" width="120" sortable></el-table-column>
|
||||
<el-table-column prop="province" label="省份" width="120" sortable></el-table-column>
|
||||
<el-table-column prop="city" label="市区" width="120" sortable></el-table-column>
|
||||
<el-table-column prop="address" label="地址" width="300" sortable></el-table-column>-->
|
||||
<el-table-column
|
||||
:prop="item.labelId"
|
||||
:label="item.label"
|
||||
:fixed="index===0?true:false"
|
||||
width="180"
|
||||
sortable
|
||||
v-for="(item,index) in tableLine"
|
||||
:key="index"
|
||||
>
|
||||
<template slot-scope="scope" slot="header">
|
||||
<img
|
||||
:src="indexToExplain"
|
||||
alt
|
||||
v-if="index!==0&&!transState&&areaDataState!=='area'&&!computedLineSty(index)"
|
||||
class="slotExplain"
|
||||
:style="{'margin':indStatic===0?'0':''}"
|
||||
@click="indexExplain(scope.column.label)"
|
||||
/>
|
||||
<input
|
||||
v-if="index!==0&&indStatic!==0"
|
||||
type="checkbox"
|
||||
style="cursor: pointer;"
|
||||
@click.stop="listInput(index)"
|
||||
:style="{'margin':'0 0.45rem'}"
|
||||
:checked="listInputVal.indexOf(index)!==-1"
|
||||
ref="listInputSelect"
|
||||
/>
|
||||
<span :style="{'color':computedLineSty(index)?'red':''}">{{scope.column.label}}</span>
|
||||
</template>
|
||||
<template slot-scope="scope">
|
||||
<input
|
||||
v-if="index===0&&indStatic!==0"
|
||||
type="checkbox"
|
||||
style="cursor: pointer;"
|
||||
@click.stop="lineInput(scope.$index)"
|
||||
:checked="lineInputVal.indexOf(scope.$index)!==-1"
|
||||
ref="lineInputSelect"
|
||||
/>
|
||||
<img
|
||||
:src="indexToExplain"
|
||||
alt
|
||||
v-if="index===0&&transState&&areaDataState!=='area'&&!computedListSty(scope.$index)"
|
||||
class="slotExplain"
|
||||
:style="{'margin':indStatic===0?'0':''}"
|
||||
@click="indexExplain(scope.row['table_line0'])"
|
||||
/>
|
||||
<span
|
||||
:style="{'color':(computedListSty(scope.$index)||computedLineSty(index))?'red':''}"
|
||||
>{{scope.row['table_line'+index]}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 列表 表说明-->
|
||||
<div class="tableExplain">{{transBefore.tableExplain}}</div>
|
||||
<!-- 指标弹窗 -->
|
||||
<div>
|
||||
<div class="chartsCont" v-if="transBefore">
|
||||
<Echarts
|
||||
v-if="indStatic!==0"
|
||||
:echartsDatarts="echartsDatarts"
|
||||
@rowColInd="rowColInd"
|
||||
:echartsDatartsPie="echartsDatartsPie"
|
||||
></Echarts>
|
||||
<el-table :data="tableData" style="width: 100%" height="360" ref="table">
|
||||
<!-- <el-table-column fixed prop="date" label="日期" width="150" sortable></el-table-column>
|
||||
<el-table-column prop="name" label="姓名" width="120" sortable></el-table-column>
|
||||
<el-table-column prop="province" label="省份" width="120" sortable></el-table-column>
|
||||
<el-table-column prop="city" label="市区" width="120" sortable></el-table-column>
|
||||
<el-table-column prop="address" label="地址" width="300" sortable></el-table-column>-->
|
||||
<el-table-column
|
||||
:prop="item.labelId"
|
||||
:label="item.label"
|
||||
:fixed="index===0?true:false"
|
||||
width="180"
|
||||
sortable
|
||||
v-for="(item,index) in tableLine"
|
||||
:key="index"
|
||||
>
|
||||
<template slot-scope="scope" slot="header">
|
||||
<img
|
||||
:src="indexToExplain"
|
||||
alt
|
||||
v-if="index!==0&&!transState&&areaDataState!=='area'&&!computedLineSty(index)"
|
||||
class="slotExplain"
|
||||
:style="{'margin':indStatic===0?'0':''}"
|
||||
@click="indexExplain(scope.column.label)"
|
||||
/>
|
||||
<input
|
||||
v-if="index!==0&&indStatic!==0"
|
||||
type="checkbox"
|
||||
style="cursor: pointer;"
|
||||
@click.stop="listInput(index)"
|
||||
:style="{'margin':'0 0.45rem'}"
|
||||
:checked="listInputVal.indexOf(index)!==-1"
|
||||
ref="listInputSelect"
|
||||
/>
|
||||
<span :style="{'color':computedLineSty(index)?'red':''}">{{scope.column.label}}</span>
|
||||
</template>
|
||||
<template slot-scope="scope">
|
||||
<input
|
||||
v-if="index===0&&indStatic!==0"
|
||||
type="checkbox"
|
||||
style="cursor: pointer;"
|
||||
@click.stop="lineInput(scope.$index)"
|
||||
:checked="lineInputVal.indexOf(scope.$index)!==-1"
|
||||
ref="lineInputSelect"
|
||||
/>
|
||||
<img
|
||||
:src="indexToExplain"
|
||||
alt
|
||||
v-if="index===0&&transState&&areaDataState!=='area'&&!computedListSty(scope.$index)"
|
||||
class="slotExplain"
|
||||
:style="{'margin':indStatic===0?'0':''}"
|
||||
@click="indexExplain(scope.row['table_line0'])"
|
||||
/>
|
||||
<span
|
||||
:style="{'color':(computedListSty(scope.$index)||computedLineSty(index))?'red':''}"
|
||||
>{{scope.row['table_line'+index]}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 列表 表说明-->
|
||||
<div class="tableExplain">{{transBefore.tableExplain}}</div>
|
||||
<!-- 指标弹窗 -->
|
||||
</div>
|
||||
<div v-if="!transBefore" class="tishi54">暂无数据</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -94,6 +97,15 @@ export default {
|
||||
defaultDataRight: {
|
||||
type: Object,
|
||||
required: false
|
||||
},
|
||||
// 表数据状态
|
||||
statesDf: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
stateTells: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data () {
|
||||
@@ -264,15 +276,16 @@ export default {
|
||||
// 当前数据，统计数据中的哪一种text:('无','SUM求和','x平均数','MAX最大值','MIN最小值','MD中位数','MO众数','S²方差','S标准差'),stateType:('line','list')
|
||||
nowDataTJ: { text: '无', stateType: 'line' },
|
||||
// 转置前总数据
|
||||
transBefore: {
|
||||
tableExplain: '',
|
||||
timeArr: [],
|
||||
termsName: [],
|
||||
termsExplain: [],
|
||||
areaName: [],
|
||||
transBeforeTermsData: [],
|
||||
transBeforeAreaData: []
|
||||
},
|
||||
// transBefore: {
|
||||
// tableExplain: '',
|
||||
// timeArr: [],
|
||||
// termsName: [],
|
||||
// termsExplain: [],
|
||||
// areaName: [],
|
||||
// transBeforeTermsData: [],
|
||||
// transBeforeAreaData: []
|
||||
// },
|
||||
transBefore: null,
|
||||
// transBefore: {
|
||||
// // 数据表说明
|
||||
// tableExplain: '注： 按照统计制度要求，我国CPI每五年进行一次基期轮换，2016年1月开始使用2015年作为新一轮的对比基期，前三轮基期分别为2000年、2005年和2010年。CPI基期轮换是一项国际惯例，目的是使CPI调查所涉及到的商品和服务更具有代表性，更及时准确反映居民消费结构的新变化和物价的实际变动。 参考联合国制定的《按目的划分的个人消费分类》（COICOP）和国家统计局发布的《居民消费支出分类（2013）》，我们对CPI调查目录进行了调整，新基期调查目录和规格品与国际标准更为接近，一些新产品新服务纳入其中，能进一步反映居民消费和经济结构的变化。与上一轮基期相比，本轮基期的CPI调查目录有几个主要变化。一是按照《居民消费支出分类（2013）》，原来的“食品”、“烟酒”合并为现在的“食品烟酒”；原来的“医疗保健和个人用品”被拆分到现在的“生活用品及服务”、“医疗保健”和“其他用品和服务”中；原来的“娱乐教育文化用品及服务”被拆分到现在的“教育文化和娱乐”和“其他用品和服务”中；原来的“家庭设备用品及维修服务”被拆分到现在的“生活用品及服务”和“其他用品及服务”中。二是食品的指标内涵发生了变化，旧分类中的“食品”为大类，包括粮食、肉禽、鲜菜、鲜果、水产品、茶及饮料、在外餐饮等分类；新“食品”为“食品烟酒”大类下的中类，仅包括粮食、畜肉、禽肉、鲜菜、鲜果、水产品等，不再包括“茶及饮料”和“在外餐饮”两项。三是新增了“园艺花卉及用品”、“宠物及用品”、“养老服务”和“金融服务”等居民支出增加较快的分类，能够更加及时准确反映居民消费结构的新变化。',
|
||||
@@ -310,7 +323,7 @@ export default {
|
||||
// 调用存储的对象
|
||||
objCompBefore: null,
|
||||
// echarts渲染的数据======>非饼图
|
||||
echartsDatarts: {},
|
||||
echartsDatarts: { ghg: 1 },
|
||||
// 饼图数据
|
||||
echartsDatartsPie: {},
|
||||
// 行列转换索引状态0行1列
|
||||
@@ -343,50 +356,134 @@ export default {
|
||||
// immediate: true,
|
||||
// deep: true
|
||||
// }
|
||||
listInputVal: {
|
||||
handler () {
|
||||
this.$store.state.listInputVal = this.listInputVal
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
lineInputVal: {
|
||||
handler () {
|
||||
this.$store.state.lineInputVal = this.lineInputVal
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
tableData: {
|
||||
handler () {
|
||||
this.$store.state.tableData = this.tableData
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
tableLine: {
|
||||
handler () {
|
||||
this.$store.state.tableLine = this.tableLine
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
transBefore (newval, oldval) {
|
||||
if (newval) {
|
||||
if (newval && this.transBefore) {
|
||||
this.showTable()
|
||||
}
|
||||
},
|
||||
indStatic (newValue, oldValue) {
|
||||
console.log(newValue, 'newValue1212')
|
||||
this.chartsShow()
|
||||
if (this.transBefore) {
|
||||
this.chartsShow()
|
||||
}
|
||||
},
|
||||
'chartsStatusMegger.transState': {
|
||||
handler () {
|
||||
this.transState = this.chartsStatusMegger.transState
|
||||
this.showTable()
|
||||
if (this.transBefore) {
|
||||
this.showTable()
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
'chartsStatusMegger.computedStatic': {
|
||||
handler () {
|
||||
console.log(this.chartsStatusMegger, 1255555)
|
||||
this.nowDataTJ = this.chartsStatusMegger.computedStatic
|
||||
this.dataTJComput()
|
||||
// 重新渲染表
|
||||
this.$nextTick(() => {
|
||||
console.log(this.$refs.table, 'this.$refs.table')
|
||||
if (this.$refs.table !== undefined) {
|
||||
this.$refs.table.doLayout()
|
||||
}
|
||||
})
|
||||
if (this.transBefore) {
|
||||
console.log(this.chartsStatusMegger, 1255555)
|
||||
this.nowDataTJ = this.chartsStatusMegger.computedStatic
|
||||
this.dataTJComput()
|
||||
// 重新渲染表
|
||||
this.$nextTick(() => {
|
||||
console.log(this.$refs.table, 'this.$refs.table')
|
||||
if (this.$refs.table !== undefined) {
|
||||
this.$refs.table.doLayout()
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
// 监听行列图表转换
|
||||
rowColIndex (newVal, oldVal) {
|
||||
this.chartsShow()
|
||||
if (this.transBefore) {
|
||||
this.chartsShow()
|
||||
}
|
||||
},
|
||||
// 监听左侧菜单的数据变化
|
||||
defaultDataRight: {
|
||||
handler () {
|
||||
this.getDatas()
|
||||
handler (val) {
|
||||
console.log(val, '左侧数据变化')
|
||||
if (val) {
|
||||
// 初始化公共数据
|
||||
// console.log(this.objCompBefore, 'this.objCompBefore')
|
||||
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
// 监听下拉状态变化
|
||||
stateTells (val) {
|
||||
if (val) {
|
||||
if (JSON.parse(localStorage.getItem('classFiyData')) && JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id)) {
|
||||
this.transBefore = {}
|
||||
this.transBefore.tableExplain = JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id).data.tableExplain
|
||||
this.transBefore.timeArr = JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id).data.timeArr.map((item, index) => { return item.toString() })
|
||||
this.transBefore.termsName = JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id).data.termsName
|
||||
this.transBefore.termsExplain = JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id).data.termsExplain
|
||||
this.transBefore.areaName = JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id).data.areaName
|
||||
this.transBefore.transBeforeTermsData = JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id).data.transBeforeTermsData
|
||||
this.transBefore.transBeforeAreaData = JSON.parse(localStorage.getItem('classFiyData')).find(item => item.id === this.defaultDataRight.id).data.transBeforeAreaData
|
||||
console.log(this.transBefore, '000')
|
||||
this.$store.state.transdtr = true
|
||||
// 全局总数据
|
||||
this.$store.state.transBefore = this.transBefore
|
||||
// 全局永久不变数据
|
||||
this.$store.state.noChangeData = JSON.parse(JSON.stringify(this.transBefore))
|
||||
} else {
|
||||
console.log(this.defaultDataRight, '获取左侧选中数据555')
|
||||
console.log(this.$store.state.selectData, 'this.$store.state.selectData')
|
||||
console.log(this.$store.state.selectfilter, 'this.$store.state.selectfilter')
|
||||
this.getDatas()
|
||||
}
|
||||
}
|
||||
},
|
||||
statesDf (val) {
|
||||
if (val === 2) {
|
||||
this.transBefore = {}
|
||||
this.transBefore.tableExplain = this.$store.state.transBefore.tableExplain
|
||||
this.transBefore.timeArr = this.$store.state.transBefore.timeArr
|
||||
this.transBefore.termsName = this.$store.state.transBefore.termsName
|
||||
this.transBefore.termsExplain = this.$store.state.transBefore.termsExplain
|
||||
this.transBefore.areaName = this.$store.state.transBefore.areaName
|
||||
this.transBefore.transBeforeTermsData = this.$store.state.transBefore.transBeforeTermsData
|
||||
this.transBefore.transBeforeAreaData = this.$store.state.transBefore.transBeforeAreaData
|
||||
// console.log(this.transBefore, '我要改变')
|
||||
// 重新渲染表格
|
||||
this.$refs.table.doLayout()
|
||||
// 告诉父组件改完了
|
||||
this.$emit('tellAreadly', 1)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -638,8 +735,10 @@ export default {
|
||||
},
|
||||
// 获取后台数据表中的数据
|
||||
getDatas () {
|
||||
console.log(this.defaultDataRight, '获取数据')
|
||||
// 初始化计算数据
|
||||
if (this.transBefore) {
|
||||
this.objCompBefore.initAllData()
|
||||
}
|
||||
this.$axios({
|
||||
method: 'GET',
|
||||
url: 'data/data/detail',
|
||||
@@ -649,22 +748,39 @@ export default {
|
||||
id: this.defaultDataRight.id, // 分类id
|
||||
area: this.downLaSelect.area, // 选中的地区
|
||||
quota: this.downLaSelect.label, // 选中的指标
|
||||
cate: this.selectState// 1帅选指标 2筛选地区
|
||||
cate: this.selectState, // 1筛选指标 2筛选地区
|
||||
f: this.$store.state.selectfilter, // year=>年度分类，monthly=>月度分类，quarter=>季度分类
|
||||
// filters: this.$store.state.selectfilter, // year=>年度分类，monthly=>月度分类，quarter=>季度分类
|
||||
data: this.$store.state.selectData // 时间
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '获取数据展示数据')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
// if (res.data.data.areaName.length !== 0) {
|
||||
// this.transBefore = {}
|
||||
// this.transBefore.tableExplain = res.data.data.tableExplain
|
||||
// this.transBefore.timeArr = res.data.data.timeArr
|
||||
// this.transBefore.termsName = res.data.data.termsName
|
||||
// this.transBefore.termsExplain = res.data.data.termsExplain
|
||||
// this.transBefore.areaName = res.data.data.areaName
|
||||
// this.transBefore.transBeforeTermsData = res.data.data.transBeforeTermsData
|
||||
// this.transBefore.transBeforeAreaData = res.data.data.transBeforeAreaData
|
||||
this.transBefore = {}
|
||||
this.transBefore.tableExplain = res.data.data.tableExplain
|
||||
this.transBefore.timeArr = res.data.data.timeArr.map((item, index) => { return item.toString() })
|
||||
this.transBefore.termsName = res.data.data.termsName
|
||||
this.transBefore.termsExplain = res.data.data.termsExplain
|
||||
this.transBefore.areaName = res.data.data.areaName
|
||||
this.transBefore.transBeforeTermsData = res.data.data.transBeforeTermsData
|
||||
this.transBefore.transBeforeAreaData = res.data.data.transBeforeAreaData
|
||||
console.log(this.transBefore, '000')
|
||||
this.$store.state.transdtr = true
|
||||
// 全局总数据
|
||||
this.$store.state.transBefore = this.transBefore
|
||||
// 全局永久不变数据
|
||||
this.$store.state.noChangeData = JSON.parse(JSON.stringify(this.transBefore))
|
||||
// 告诉父组件我完成任务重置状态
|
||||
this.$emit('prentsState', false)
|
||||
// }
|
||||
} else {
|
||||
this.transBefore = null
|
||||
this.$store.state.transdtr = null
|
||||
// 全局总数据
|
||||
this.$store.state.transBefore = null
|
||||
this.$store.state.noChangeData = null
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail, 2369)
|
||||
@@ -677,11 +793,11 @@ export default {
|
||||
return (ind) => {
|
||||
let styStatic = false
|
||||
if (this.transState) {
|
||||
if (ind > (this.transBefore.transBeforeTermsData.length)) {
|
||||
if (ind > (this.transBefore.transBeforeTermsData[0].length)) {
|
||||
styStatic = true
|
||||
}
|
||||
} else {
|
||||
if (ind > (this.transBefore.transBeforeTermsData[0].length)) {
|
||||
if (ind > (this.transBefore.transBeforeTermsData.length)) {
|
||||
styStatic = true
|
||||
}
|
||||
}
|
||||
@@ -703,10 +819,18 @@ export default {
|
||||
}
|
||||
return styStatic
|
||||
}
|
||||
},
|
||||
// 监听全局表数据的的变化从而改变渲染数据
|
||||
transBefores () {
|
||||
return this.$store.state.allState
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.getDatas()
|
||||
// this.getDatas()
|
||||
},
|
||||
updated () {
|
||||
// 重新渲染表格
|
||||
this.$refs.table.doLayout()
|
||||
},
|
||||
mounted () {
|
||||
// console.log(new ComputedData())
|
||||
@@ -717,9 +841,15 @@ export default {
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.tishi54 {
|
||||
margin-top: 3rem;
|
||||
font-size: 2rem;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
}
|
||||
.chartsCont {
|
||||
margin: 1.5rem 0;
|
||||
border: 0.0625rem solid red;
|
||||
// border: 0.0625rem solid red;
|
||||
padding: 0 1.5rem;
|
||||
& > .tableExplain {
|
||||
padding: 0.75rem;
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
></cityPicker>
|
||||
</div>
|
||||
<!-- 根据时间筛选 -->
|
||||
<div class="chart_right_time">
|
||||
<div class="chart_right_time" v-if="cityDataTime">
|
||||
时间：
|
||||
<div class="chart_right_cont">
|
||||
<cityPicker
|
||||
@@ -48,7 +48,11 @@ import cityPicker from '@/components/cityPicker/CityPicker.vue'
|
||||
export default {
|
||||
name: 'chartsCut',
|
||||
props: {
|
||||
|
||||
// 渲染图表所需数据
|
||||
defaultDataRight: {
|
||||
type: Object,
|
||||
required: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
cityPicker: cityPicker
|
||||
@@ -83,16 +87,7 @@ export default {
|
||||
}
|
||||
],
|
||||
// 栏目数据 结构不可变
|
||||
cityDataTime: [
|
||||
{ 'id': '110000', 'name': '最近13个月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' },
|
||||
{ 'id': '110000', 'name': '最近24个月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' },
|
||||
{ 'id': '110000', 'name': '最近36个月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' }
|
||||
],
|
||||
citNewTime: [
|
||||
{ 'id': '110000', 'name': '最近13个月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' },
|
||||
{ 'id': '110000', 'name': '最近24个月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' },
|
||||
{ 'id': '110000', 'name': '最近36个月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' }
|
||||
],
|
||||
cityDataTime: null,
|
||||
// 栏目级数
|
||||
jishuTime: 1,
|
||||
// 默认显示栏目
|
||||
@@ -132,6 +127,24 @@ export default {
|
||||
showInputStu: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 监听左侧菜单的数据变化
|
||||
defaultDataRight: {
|
||||
handler (val) {
|
||||
console.log(val, '左侧数据变化chartsCut')
|
||||
if (val) {
|
||||
// 初始化公共数据
|
||||
if (this.$route.query.type !== 'area') {
|
||||
this.searchSelect(this.$route.query.type)
|
||||
} else {
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 点击切换图表
|
||||
cutChartsTap (ind) {
|
||||
@@ -146,7 +159,13 @@ export default {
|
||||
// 被选中时触发
|
||||
choiceCallerTime (resu) {
|
||||
console.log(resu, '66666')
|
||||
console.log(this.cityDefaultName)
|
||||
// console.log(this.cityDefaultName)
|
||||
// 改变选中值索引
|
||||
if (this.$store.state.selectData !== undefined) {
|
||||
console.log(this.$store.state.selectData, '被选中的值')
|
||||
|
||||
this.$store.state.selectData = resu[2].indexID
|
||||
}
|
||||
// 将值传给父组件
|
||||
this.$emit('comTime', resu[2].name)
|
||||
this.showInputStu = !this.showInputStu
|
||||
@@ -159,10 +178,39 @@ export default {
|
||||
showKuangCat () {
|
||||
console.log(1250)
|
||||
this.isHideProp = false
|
||||
},
|
||||
// 查询下拉筛选条件
|
||||
async searchSelect (type) {
|
||||
await this.$axios({
|
||||
method: 'GET',
|
||||
url: 'data/data/quick',
|
||||
params: {
|
||||
type: type
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '下拉筛选条件')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
if (this.$route.query.type !== 'area') {
|
||||
// console.log(Object.keys(res.data.data.list))
|
||||
// console.log(Object.values(res.data.data.list))
|
||||
this.cityDataTime = Object.keys(res.data.data.list).map((item, index) => {
|
||||
return { 'id': '110000', 'name': Object.values(res.data.data.list)[index], 'parentId': '100000', 'shortName': '北京', 'cityCode': '', indexID: item }
|
||||
})
|
||||
// 默认选中第一个
|
||||
this.$store.state.selectData = this.cityDataTime[0].indexID
|
||||
console.log(this.$store.state.selectData, 'this.cityDataTime[0].indexID')
|
||||
// 告诉父组件我获取到了
|
||||
this.$emit('stateTell', true)
|
||||
}
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
mounted () {
|
||||
this.cityDataTime = this.citNewTime
|
||||
this.cityDataArea = this.cityDataAreas
|
||||
}
|
||||
}
|
||||
|
||||
@@ -111,7 +111,7 @@ export default {
|
||||
watch: {
|
||||
cityData: {
|
||||
handler: function (newVal, oldVal) {
|
||||
console.log(newVal, '5555555555')
|
||||
// console.log(newVal, '5555555555')
|
||||
this.initDatakf()
|
||||
},
|
||||
immediate: true,
|
||||
@@ -120,7 +120,7 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
newCityData () {
|
||||
console.log(this.cityData, 'this.cityData')
|
||||
// console.log(this.cityData, 'this.cityData')
|
||||
/* eslint-disable */
|
||||
this.inlay[0].filterDatas = []
|
||||
return JSON.parse(JSON.stringify(this.cityData))
|
||||
|
||||
@@ -87,6 +87,7 @@ export default {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 10;
|
||||
& > .container {
|
||||
width: 64.375rem;
|
||||
height: 33rem;
|
||||
|
||||
@@ -146,8 +146,10 @@ export default {
|
||||
echartsDatarts: {
|
||||
handler (newVal, oldVal) {
|
||||
console.log(newVal, '11111')
|
||||
this.option = JSON.parse(JSON.stringify(newVal))
|
||||
this.drawEcharts()
|
||||
if (newVal !== undefined) {
|
||||
this.option = JSON.parse(JSON.stringify(newVal))
|
||||
this.drawEcharts()
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
@@ -198,11 +200,11 @@ export default {
|
||||
.echarts {
|
||||
width: 100%;
|
||||
height: 32rem;
|
||||
border: 1px solid red;
|
||||
// border: 1px solid red;
|
||||
& > div:nth-child(2) {
|
||||
max-width: 100%;
|
||||
min-height: 30rem;
|
||||
border: 1px solid red;
|
||||
// border: 1px solid red;
|
||||
}
|
||||
& > div:nth-child(1) {
|
||||
width: 100%;
|
||||
|
||||
@@ -11,9 +11,9 @@
|
||||
<input type="radio" value="lie" v-model="radioSelect" />列
|
||||
</div>
|
||||
<div>
|
||||
<span>全选</span>
|
||||
<span @click="allSelect()">全选</span>
|
||||
<span>|</span>
|
||||
<span>反选</span>
|
||||
<span @click="fanselect()">反选</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contanin">
|
||||
@@ -24,7 +24,7 @@
|
||||
</div>
|
||||
<!-- 确定取消 -->
|
||||
<div class="bottom">
|
||||
<div>确定</div>
|
||||
<div @click="trueEdit">确定</div>
|
||||
<div @click="$store.state.editWindowState=false">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -66,6 +66,245 @@ export default {
|
||||
{ text: '接收到符合', state: false }
|
||||
]
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
radioSelect (newVal, oldVal) {
|
||||
console.log(newVal)
|
||||
if (newVal === 'hang') {
|
||||
// 行列新增渲染
|
||||
if (this.$route.query.type === 'area') {
|
||||
this.datalist = this.$store.state.noChangeData.areaName
|
||||
} else {
|
||||
if (!this.$store.state.selectLabelHang) {
|
||||
this.datalist = this.$store.state.noChangeData.termsName.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: true,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.datalist = this.$store.state.noChangeData.termsName.map((item, index) => {
|
||||
let state = true
|
||||
if (this.$store.state.selectLabelHang.indexOf(index) === -1) {
|
||||
state = false
|
||||
} else {
|
||||
state = true
|
||||
}
|
||||
console.log(state, 'state')
|
||||
return {
|
||||
text: item,
|
||||
state: state,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
} else if (newVal === 'lie') {
|
||||
if (!this.$store.state.selectLabelLie) {
|
||||
this.datalist = this.$store.state.noChangeData.timeArr.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: true,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.datalist = this.$store.state.noChangeData.timeArr.map((item, index) => {
|
||||
let state = true
|
||||
if (this.$store.state.selectLabelLie.indexOf(index) === -1) {
|
||||
state = false
|
||||
} else {
|
||||
state = true
|
||||
}
|
||||
console.log(state, 'state')
|
||||
return {
|
||||
text: item,
|
||||
state: state,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
allSelect () {
|
||||
this.datalist.forEach((item, index) => {
|
||||
item.state = true
|
||||
})
|
||||
},
|
||||
fanselect () {
|
||||
this.datalist.forEach((item, index) => {
|
||||
item.state = !item.state
|
||||
})
|
||||
},
|
||||
// 筛选确定
|
||||
trueEdit () {
|
||||
if (this.radioSelect === 'hang') {
|
||||
if (this.$route.query.type !== 'area') {
|
||||
// 选中的下标
|
||||
let lebalIndex = this.datalist.filter((item, index) => {
|
||||
return item.state === true
|
||||
}).map((item, index) => {
|
||||
return item.id
|
||||
})
|
||||
this.$store.state.selectLabelHang = lebalIndex
|
||||
console.log(lebalIndex, '下标')
|
||||
|
||||
this.$store.state.transBefore.termsExplain = this.$store.state.noChangeData.termsExplain.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.transBefore.termsName = this.$store.state.noChangeData.termsName.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.transBefore.transBeforeTermsData = this.$store.state.noChangeData.transBeforeTermsData.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.editWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
} else {
|
||||
// 选中的下标
|
||||
let lebalIndex = this.datalist.filter((item, index) => {
|
||||
return item.state === true
|
||||
}).map((item, index) => {
|
||||
return item.id
|
||||
})
|
||||
this.$store.state.selectLabelHang = lebalIndex
|
||||
console.log(lebalIndex, '下标')
|
||||
|
||||
this.$store.state.transBefore.termsExplain = this.$store.state.noChangeData.termsExplain.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.transBefore.termsName = this.$store.state.noChangeData.termsName.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.transBefore.transBeforeAreaData = this.$store.state.noChangeData.transBeforeAreaData.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.editWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
}
|
||||
} else if (this.radioSelect === 'lie') {
|
||||
if (this.$route.query.type !== 'area') {
|
||||
// 选中的下标
|
||||
let lebalIndex = this.datalist.filter((item, index) => {
|
||||
return item.state === true
|
||||
}).map((item, index) => {
|
||||
return item.id
|
||||
})
|
||||
this.$store.state.selectLabelLie = lebalIndex
|
||||
console.log(lebalIndex, '下标')
|
||||
|
||||
// this.$store.state.transBefore.termsExplain = this.$store.state.transBefore.termsExplain.filter((item, index) => {
|
||||
// return lebalIndex.indexOf(index) !== -1
|
||||
// })
|
||||
// this.$store.state.transBefore.termsName = this.$store.state.transBefore.termsName.filter((item, index) => {
|
||||
// return lebalIndex.indexOf(index) !== -1
|
||||
// })
|
||||
// 数据转置
|
||||
let gdt = JSON.parse(JSON.stringify(this.$store.state.noChangeData.transBeforeTermsData))
|
||||
let waiBrr = gdt[0].map(function (col, index) {
|
||||
return gdt.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
waiBrr = waiBrr.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
// 转置回来
|
||||
waiBrr = waiBrr.map(function (col, index) {
|
||||
return waiBrr.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
// 赋值
|
||||
this.$store.state.transBefore.transBeforeTermsData = waiBrr
|
||||
this.$store.state.transBefore.timeArr = this.$store.state.noChangeData.timeArr.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.editWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
} else { // 地区列
|
||||
// 选中的下标
|
||||
let lebalIndex = this.datalist.filter((item, index) => {
|
||||
return item.state === true
|
||||
}).map((item, index) => {
|
||||
return item.id
|
||||
})
|
||||
this.$store.state.selectLabelLie = lebalIndex
|
||||
console.log(lebalIndex, '下标')
|
||||
|
||||
// this.$store.state.transBefore.termsExplain = this.$store.state.transBefore.termsExplain.filter((item, index) => {
|
||||
// return lebalIndex.indexOf(index) !== -1
|
||||
// })
|
||||
// this.$store.state.transBefore.termsName = this.$store.state.transBefore.termsName.filter((item, index) => {
|
||||
// return lebalIndex.indexOf(index) !== -1
|
||||
// })
|
||||
// 数据转置
|
||||
let gdt = JSON.parse(JSON.stringify(this.$store.state.noChangeData.transBeforeAreaData))
|
||||
let waiBrr = gdt[0].map(function (col, index) {
|
||||
return gdt.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
waiBrr = waiBrr.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
// 转置回来
|
||||
waiBrr = waiBrr.map(function (col, index) {
|
||||
return waiBrr.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
// 赋值
|
||||
this.$store.state.transBefore.transBeforeAreaData = waiBrr
|
||||
this.$store.state.transBefore.timeArr = this.$store.state.noChangeData.timeArr.filter((item, index) => {
|
||||
return lebalIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.editWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
// 行列新增渲染
|
||||
this.radioSelect = 'hang'
|
||||
console.log(this.$store.state.selectLabelHang)
|
||||
if (this.$route.query.type === 'area') {
|
||||
this.datalist = this.$store.state.noChangeData.areaName
|
||||
} else {
|
||||
if (!this.$store.state.selectLabelHang) {
|
||||
this.datalist = this.$store.state.noChangeData.termsName.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: true,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.datalist = this.$store.state.noChangeData.termsName.map((item, index) => {
|
||||
let state = true
|
||||
if (this.$store.state.selectLabelHang.indexOf(index) === -1) {
|
||||
state = false
|
||||
} else {
|
||||
state = true
|
||||
}
|
||||
console.log(state, 'state')
|
||||
return {
|
||||
text: item,
|
||||
state: state,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
// console.log(this.datalist, 'this.dataList')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -110,7 +349,7 @@ export default {
|
||||
width: 1.3125rem;
|
||||
height: 1.3125rem;
|
||||
}
|
||||
& > img:hover{
|
||||
& > img:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -19,18 +19,22 @@
|
||||
v-for="(item,index) in labelData"
|
||||
:key="index"
|
||||
:class="{bgcolor:item.state}"
|
||||
@click="bgclick(index)"
|
||||
@click="labelSelInd(index)"
|
||||
>{{item.text}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center">
|
||||
<div>=</div>
|
||||
<div>></div>
|
||||
<div @click="bgclick(inds)">></div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<textarea v-model="fontComput"></textarea>
|
||||
<div class="computer">
|
||||
<div v-for="(item,index) in computers" :key="index">{{item.text}}</div>
|
||||
<div
|
||||
v-for="(item,index) in computers"
|
||||
:key="index"
|
||||
@click="computSS(index)"
|
||||
>{{item.text}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -38,13 +42,14 @@
|
||||
<div class="explains">说明：指标只能从上表中显示</div>
|
||||
<!-- 确认取消 -->
|
||||
<div class="bnottom">
|
||||
<div>确认</div>
|
||||
<div @click="trueVerify">确认</div>
|
||||
<div @click="closeX">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import verify from '../../assets/js/verifyMathematicalExpression'
|
||||
export default {
|
||||
name: 'insertLabel',
|
||||
data () {
|
||||
@@ -90,17 +95,254 @@ export default {
|
||||
{ text: '3', state: false },
|
||||
{ text: '.', state: false },
|
||||
{ text: '0', state: false }
|
||||
]
|
||||
],
|
||||
// 左侧选中的指标下标
|
||||
inds: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
radioValue (newValue, oldValue) {
|
||||
if (newValue === 'hang') {
|
||||
// 行列新增渲染
|
||||
if (this.$route.query.type === 'area') {
|
||||
this.labelData = this.$store.state.transBefore.areaName
|
||||
} else {
|
||||
this.labelData = this.$store.state.transBefore.termsName.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: false
|
||||
}
|
||||
})
|
||||
}
|
||||
} else if (newValue === 'lie') {
|
||||
// 行列新增渲染
|
||||
this.labelData = this.$store.state.transBefore.timeArr.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
bgclick (ind) {
|
||||
labelSelInd (ind) {
|
||||
this.inds = ind
|
||||
this.labelData.forEach((item, index) => {
|
||||
index === ind ? item.state = true : item.state = false
|
||||
/*eslint-disable*/
|
||||
index === ind ? (item.state = true) : item.state = false
|
||||
})
|
||||
|
||||
},
|
||||
bgclick(ind) {
|
||||
console.log(ind)
|
||||
if (ind !== false) {
|
||||
this.labelData.forEach((item, index) => {
|
||||
/*eslint-disable*/
|
||||
index === ind ? (this.fontComput += '#' + item.text + '#') : ''
|
||||
})
|
||||
} else {
|
||||
alert('请选择指标！')
|
||||
}
|
||||
|
||||
},
|
||||
closeX() {
|
||||
this.$store.state.insertWindowState = false
|
||||
},
|
||||
// 计算器
|
||||
computSS(ind) {
|
||||
// console.log(ind)
|
||||
// console.log(this.fontComput,'this.fontComput')
|
||||
this.computers.forEach((item, index) => {
|
||||
index === ind ? (item.state = true, this.fontComput += item.text) : item.state = false
|
||||
})
|
||||
},
|
||||
closeX () {
|
||||
this.$store.state.insertWindowState = false
|
||||
// 确定
|
||||
trueVerify() {
|
||||
let Str = JSON.parse(JSON.stringify(this.fontComput)).replace(/#.*?#/gi, '$').split('')
|
||||
console.log(Str, '处理成表达式')
|
||||
let bty = Str.map((item, index) => {
|
||||
let sft = item
|
||||
if (item === '$') {
|
||||
if (index === 0) {
|
||||
sft = (/^[0-9]+/.test(Str[index + 1]) || /^[$]+/.test(Str[index + 1])) ? '1*' : '1'
|
||||
} else if (index === Str.length - 1) {
|
||||
sft = (/^[0-9]+/.test(Str[index - 1]) || /^[$]+/.test(Str[index - 1])) ? '*1' : '1'
|
||||
} else {
|
||||
if ((/^[$]+/.test(Str[index + 1]))) {
|
||||
sft = '1*'
|
||||
} else if ((/^[$]+/.test(Str[index - 1]))) {
|
||||
sft = '*1'
|
||||
} else {
|
||||
sft = '1'
|
||||
}
|
||||
|
||||
}
|
||||
} else {
|
||||
sft = item
|
||||
}
|
||||
return sft
|
||||
})
|
||||
console.log(bty.join(''))
|
||||
// 验证表达式是否正确
|
||||
// verify(bty.join(''), {})
|
||||
if (verify(bty.join(''), {})) {
|
||||
let newArrat = this.fontComput.split('#').filter((item, index) => {
|
||||
return item !== ''
|
||||
})
|
||||
console.log(newArrat)
|
||||
// 定义一个新数组用来存放新增指标的数据
|
||||
let newarr = []
|
||||
if (this.radioValue === 'hang') {
|
||||
if (this.$route.query.type !== 'area') {
|
||||
// 循环指标名称 回调一个计算后的数组
|
||||
|
||||
let dataStrArr = this.$store.state.transBefore.termsName.map((item, index) => {//外层
|
||||
// console.log(this.$store.state.transBefore.transBeforeTermsData[index])
|
||||
// 定义拼接计算的字符串
|
||||
let comStr = ''
|
||||
newArrat.forEach((list, key) => {
|
||||
if (this.$store.state.transBefore.termsName.indexOf(list) !== -1) {
|
||||
comStr += this.$store.state.transBefore.transBeforeTermsData[index][this.$store.state.transBefore.termsName.indexOf(list)]
|
||||
} else {
|
||||
comStr += list
|
||||
}
|
||||
})
|
||||
// console.log(comStr)
|
||||
// console.log(eval(comStr))
|
||||
return eval(comStr).toString()
|
||||
})
|
||||
// 将处理完的数据放到全局变量中
|
||||
this.$store.state.transBefore.termsName.push(this.insertName)
|
||||
this.$store.state.transBefore.termsExplain.push('')
|
||||
this.$store.state.transBefore.transBeforeTermsData.push(dataStrArr)
|
||||
this.closeX()
|
||||
this.$emit('emitState', true)
|
||||
} else {
|
||||
// 循环地区名称 回调一个计算后的数组
|
||||
|
||||
let dataStrArr = this.$store.state.transBefore.termsName.map((item, index) => {//外层
|
||||
// console.log(this.$store.state.transBefore.transBeforeTermsData[index])
|
||||
// 定义拼接计算的字符串
|
||||
let comStr = ''
|
||||
newArrat.forEach((list, key) => {
|
||||
if (this.$store.state.transBefore.termsName.indexOf(list) !== -1) {
|
||||
comStr += this.$store.state.transBefore.transBeforeTermsData[index][this.$store.state.transBefore.termsName.indexOf(list)]
|
||||
} else {
|
||||
comStr += list
|
||||
}
|
||||
})
|
||||
// console.log(comStr)
|
||||
// console.log(eval(comStr))
|
||||
return eval(comStr).toString()
|
||||
})
|
||||
// 将处理完的数据放到全局变量中
|
||||
this.$store.state.transBefore.termsName.push(this.insertName)
|
||||
this.$store.state.transBefore.termsExplain.push('')
|
||||
this.$store.state.transBefore.transBeforeTermsData.push(dataStrArr)
|
||||
this.closeX()
|
||||
this.$emit('emitState', true)
|
||||
}
|
||||
|
||||
} else {
|
||||
if (this.$route.query.type !== 'area') {
|
||||
// console.log(this.$store.state.transBefore.transBeforeTermsData)
|
||||
let bsfyu = this.$store.state.transBefore.transBeforeTermsData
|
||||
// 将数据进行转置
|
||||
let datarts = bsfyu[0].map(function (col, index) {
|
||||
return bsfyu.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
console.log(datarts)
|
||||
// 循环年
|
||||
let dataStrArr = this.$store.state.transBefore.timeArr.map((item, index) => {//外层
|
||||
// console.log(this.$store.state.transBefore.transBeforeTermsData[index])
|
||||
// 定义拼接计算的字符串
|
||||
let comStr = ''
|
||||
newArrat.forEach((list, key) => {
|
||||
if (this.$store.state.transBefore.timeArr.indexOf(list) !== -1) {
|
||||
comStr += datarts[index][this.$store.state.transBefore.timeArr.indexOf(list)]
|
||||
} else {
|
||||
comStr += list
|
||||
}
|
||||
})
|
||||
// console.log(comStr)
|
||||
// console.log(eval(comStr))
|
||||
return eval(comStr).toString()
|
||||
})
|
||||
console.log(dataStrArr, '101025')
|
||||
datarts.push(dataStrArr)
|
||||
// 将数据转置回来
|
||||
let newZz = datarts[0].map(function (col, index) {
|
||||
return datarts.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
// 将处理完的数据放到全局变量中
|
||||
this.$store.state.transBefore.timeArr.push(this.insertName)
|
||||
this.$store.state.transBefore.transBeforeTermsData = newZz
|
||||
this.closeX()
|
||||
this.$emit('emitState', true)
|
||||
} else {
|
||||
// console.log(this.$store.state.transBefore.transBeforeTermsData)
|
||||
let bsfyu = this.$store.state.transBefore.transBeforeTermsData
|
||||
// 将数据进行转置
|
||||
let datarts = bsfyu[0].map(function (col, index) {
|
||||
return bsfyu.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
console.log(datarts)
|
||||
// 循环年
|
||||
let dataStrArr = this.$store.state.transBefore.timeArr.map((item, index) => {//外层
|
||||
// console.log(this.$store.state.transBefore.transBeforeTermsData[index])
|
||||
// 定义拼接计算的字符串
|
||||
let comStr = ''
|
||||
newArrat.forEach((list, key) => {
|
||||
if (this.$store.state.transBefore.timeArr.indexOf(list) !== -1) {
|
||||
comStr += datarts[index][this.$store.state.transBefore.timeArr.indexOf(list)]
|
||||
} else {
|
||||
comStr += list
|
||||
}
|
||||
})
|
||||
// console.log(comStr)
|
||||
// console.log(eval(comStr))
|
||||
return eval(comStr).toString()
|
||||
})
|
||||
console.log(dataStrArr, '101025')
|
||||
datarts.push(dataStrArr)
|
||||
// 将数据转置回来
|
||||
let newZz = datarts[0].map(function (col, index) {
|
||||
return datarts.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
// 将处理完的数据放到全局变量中
|
||||
this.$store.state.transBefore.timeArr.push(this.insertName)
|
||||
this.$store.state.transBefore.transBeforeTermsData = newZz
|
||||
this.closeX()
|
||||
this.$emit('emitState', true)
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
} else {
|
||||
alert('您输入的表达式正确，请重新输入！')
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 行列新增渲染
|
||||
if (this.$route.query.type === 'area') {
|
||||
this.labelData = this.$store.state.transBefore.areaName
|
||||
} else {
|
||||
this.labelData = this.$store.state.transBefore.termsName.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@@ -147,7 +389,7 @@ export default {
|
||||
width: 1.3125rem;
|
||||
height: 1.3125rem;
|
||||
}
|
||||
& > img:hover{
|
||||
& > img:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
@@ -294,15 +536,15 @@ export default {
|
||||
letter-spacing: 0rem;
|
||||
}
|
||||
& > div {
|
||||
margin:1rem;
|
||||
margin: 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
& > div:hover{
|
||||
cursor: pointer;
|
||||
}
|
||||
& > div:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -6,9 +6,10 @@
|
||||
<img :src="imgUrl" alt @click="$store.state.labelExplainState=false" />
|
||||
</div>
|
||||
<div class="contanin">{{$store.state.labelExplainData}}</div>
|
||||
<input type="hidden" :value="$store.state.labelExplainData" />
|
||||
<!-- 确定取消 -->
|
||||
<div class="bottom">
|
||||
<div>复制到粘贴板</div>
|
||||
<div @click="fuzhi()">复制到粘贴板</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -21,6 +22,19 @@ export default {
|
||||
imgUrl: require('../../../static/nav/deleteImg.png')
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
fuzhi () {
|
||||
var input = document.createElement('input')
|
||||
input.setAttribute('readonly', 'readonly') // 防止手机上弹出软键盘
|
||||
input.setAttribute('value', this.$store.state.labelExplainData)
|
||||
document.body.appendChild(input)
|
||||
// input.setSelectionRange(0, 9999);
|
||||
input.select()
|
||||
document.execCommand('copy')
|
||||
document.body.removeChild(input)
|
||||
alert('已经复制到粘贴板！')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,51 +1,13 @@
|
||||
<template>
|
||||
<div class="mapData">
|
||||
<div class="mapDataLeft">
|
||||
<!-- 左侧导航 -->
|
||||
<el-row class="tac" style="overflow: auto;height:54.875rem;" v-if="defaultSelectLies">
|
||||
<el-col :span="24">
|
||||
<el-menu
|
||||
:default-openeds="defaultSelectLies"
|
||||
class="el-menu-vertical-demo"
|
||||
@open="handleOpen"
|
||||
@close="handleClose"
|
||||
@select="selectActive"
|
||||
style="border:none"
|
||||
>
|
||||
<el-submenu :index="''+index1" v-for="(item1,index1) in leftCateData" :key="index1">
|
||||
<template slot="title">{{item1.name}}</template>
|
||||
<el-submenu
|
||||
:index="index1+'-'+index2"
|
||||
v-for="(item2,index2) in item1.children"
|
||||
:key="index2"
|
||||
>
|
||||
<template slot="title">{{item2.name}}</template>
|
||||
<el-submenu
|
||||
:index="index1+'-'+index2+'-'+index3"
|
||||
v-for="(item3,index3) in item2.children"
|
||||
:key="index3"
|
||||
>
|
||||
<template slot="title">{{item3.name}}</template>
|
||||
<el-submenu
|
||||
:index="index1+'-'+index2+'-'+index3+'-'+index4"
|
||||
v-for="(item4,index4) in item3.children"
|
||||
:key="index4"
|
||||
>
|
||||
<template slot="title">{{item4.name}}</template>
|
||||
<el-submenu
|
||||
:index="index1+'-'+index2+'-'+index3+'-'+index4+'-'+index5"
|
||||
v-for="(item5,index5) in item4.children"
|
||||
:key="index5"
|
||||
>
|
||||
<template slot="title">{{item5.name}}</template>
|
||||
</el-submenu>
|
||||
</el-submenu>
|
||||
</el-submenu>
|
||||
</el-submenu>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="mapDataLeft" v-if="leftDafrt">
|
||||
<div>指标名称</div>
|
||||
<!-- 指标名称 -->
|
||||
<div
|
||||
v-for="(item,index) in leftDafrt"
|
||||
:key="index"
|
||||
:class="{bgcolor:item.state}"
|
||||
>{{item.name}}</div>
|
||||
</div>
|
||||
<div class="mapDataRight">
|
||||
<div class="maptopSty">
|
||||
@@ -60,9 +22,10 @@
|
||||
@visible-change="changesInputStu"
|
||||
></cityPicker>
|
||||
</div>
|
||||
<!-- 月 --> <!-- 季 -->
|
||||
<!-- 月 -->
|
||||
<!-- 季 -->
|
||||
<div class="monthD">
|
||||
<cityPicker
|
||||
<cityPicker
|
||||
:level="jishuTime"
|
||||
:selectpattern="selectMonth"
|
||||
:city-data="monthDatas"
|
||||
@@ -80,7 +43,7 @@
|
||||
// 引入下拉组件
|
||||
import cityPicker from '@/components/cityPicker/CityPicker.vue'
|
||||
// 引入数据计算js用于机选渲染的数据
|
||||
import ComputedData from '../../assets/js/computeddata'
|
||||
// import ComputedData from '../../assets/js/computeddata'
|
||||
import china from 'echarts/map/json/china.json'
|
||||
var echarts = require('echarts/lib/echarts')
|
||||
require('echarts/lib/chart/map')
|
||||
@@ -224,7 +187,9 @@ export default {
|
||||
{ 'id': '110000', 'name': '2月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' },
|
||||
{ 'id': '110000', 'name': '3月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' },
|
||||
{ 'id': '110000', 'name': '4月', 'parentId': '100000', 'shortName': '北京', 'cityCode': '' }
|
||||
]
|
||||
],
|
||||
// 左侧数据
|
||||
leftDafrt: null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -326,17 +291,83 @@ export default {
|
||||
},
|
||||
monthDataChange () {
|
||||
console.log(12569)
|
||||
},
|
||||
// 地图左侧指标名称显示
|
||||
searchDataMap () {
|
||||
this.$axios({
|
||||
method: 'GET',
|
||||
url: 'data/data/quota',
|
||||
params: {
|
||||
id: this.$store.state.selectDataLeft.id
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '地图左侧指标名称显示')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
this.leftDafrt = res.data.data.list.map((item, index) => {
|
||||
let brrO = {}
|
||||
if (index === 0) {
|
||||
brrO = {
|
||||
id: item.id,
|
||||
name: item.name,
|
||||
state: true
|
||||
}
|
||||
} else {
|
||||
brrO = {
|
||||
id: item.id,
|
||||
name: item.name,
|
||||
state: false
|
||||
}
|
||||
}
|
||||
return brrO
|
||||
})
|
||||
this.getLabelDatart()
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
},
|
||||
// 获取每个指标的数据
|
||||
getLabelDatart () {
|
||||
this.$axios({
|
||||
method: 'GET',
|
||||
url: 'data/data/map-data',
|
||||
params: {
|
||||
id: this.$store.state.selectDataLeft.id,
|
||||
quota_id: this.leftDafrt.find((item, index) => { return item.state === true }).id
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '数据地图数据')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
console.log()
|
||||
this.option.legend.data = [this.leftDafrt.find((item, index) => { return item.state === true }).name]
|
||||
this.option.series[0].name = [this.leftDafrt.find((item, index) => { return item.state === true }).name]
|
||||
this.option.series[0].data = res.data.data.list
|
||||
this.showMapData()
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
// 查询左侧数据
|
||||
this.searchDataMap()
|
||||
// 获取菜单信息
|
||||
this.getCateData()
|
||||
// this.getCateData()
|
||||
// 渲染图表
|
||||
this.showMapData()
|
||||
// this.showMapData()
|
||||
// 查询左侧数据
|
||||
// this.searchDataMap()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.bgcolor {
|
||||
background-color: #95cee4;
|
||||
color: #fff;
|
||||
}
|
||||
.mapData {
|
||||
margin-top: 0.75rem;
|
||||
width: 100%;
|
||||
@@ -348,32 +379,51 @@ export default {
|
||||
& > .mapDataLeft {
|
||||
width: 26rem;
|
||||
// margin-right: 2rem;
|
||||
min-height: 54.875rem;
|
||||
overflow: auto;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0rem 0.1875rem 1rem 0rem rgba(172, 172, 172, 1);
|
||||
& > div {
|
||||
padding-left: 10%;
|
||||
width: 90%;
|
||||
height: 3.2rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
font-size: 1.375rem;
|
||||
}
|
||||
& > div:nth-child(1) {
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
& > .mapDataRight {
|
||||
width: 57rem;
|
||||
overflow: auto;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0rem 0.1875rem 1rem 0rem rgba(172, 172, 172, 1);
|
||||
border: 1px solid red;
|
||||
// border: 1px solid red;
|
||||
& > div:nth-child(2) {
|
||||
width: 100%;
|
||||
min-height: 50.875rem;
|
||||
}
|
||||
& > .maptopSty {
|
||||
width: 100%;
|
||||
height:4rem;
|
||||
height: 4rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
& > .yearD {
|
||||
margin:0 2rem;
|
||||
margin: 0 2rem;
|
||||
}
|
||||
& > .monthD {
|
||||
margin:0 2rem;
|
||||
margin: 0 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -45,16 +45,24 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="center2">
|
||||
<div>{{datarts.list5}}</div>
|
||||
<div>{{datarts.list6}}</div>
|
||||
<!-- 添加 -->
|
||||
<div @click="insertData()">{{datarts.list5}}</div>
|
||||
<!-- 删除 -->
|
||||
<div @click="deleteData()">{{datarts.list6}}</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<textarea v-model="textareas"></textarea>
|
||||
<!-- <textarea v-model="textareas"></textarea> -->
|
||||
<div
|
||||
v-for="(item,index) in selectDatas"
|
||||
:key="index"
|
||||
:class="{active:item.state}"
|
||||
@click="changeBghuio(index)"
|
||||
>{{item.text}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 确定取消 -->
|
||||
<div class="bottom">
|
||||
<div>确定</div>
|
||||
<div @click="changeLeftData()">确定</div>
|
||||
<div @click="$store.state.selcettWindowState = false">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -70,88 +78,136 @@ export default {
|
||||
selectAudio: 'hang',
|
||||
dataList: [
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始1',
|
||||
state: false,
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
text: 'h就开始2',
|
||||
state: false,
|
||||
id: 2
|
||||
},
|
||||
{
|
||||
text: 'h就开始3',
|
||||
state: false,
|
||||
id: 3
|
||||
},
|
||||
{
|
||||
text: 'h就开始4',
|
||||
state: false,
|
||||
id: 4
|
||||
},
|
||||
{
|
||||
text: 'h就开始5',
|
||||
state: false,
|
||||
id: 5
|
||||
},
|
||||
{
|
||||
text: 'h就开始6',
|
||||
state: false,
|
||||
id: 6
|
||||
},
|
||||
{
|
||||
text: 'h就开始7',
|
||||
state: false,
|
||||
id: 7
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
state: false,
|
||||
id: 8
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始8',
|
||||
state: false,
|
||||
id: 9
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始9',
|
||||
state: false,
|
||||
id: 10
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始10',
|
||||
state: false,
|
||||
id: 11
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始11',
|
||||
state: false,
|
||||
id: 12
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始12',
|
||||
state: false,
|
||||
id: 13
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始13',
|
||||
state: false,
|
||||
id: 14
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始14',
|
||||
state: false,
|
||||
id: 15
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始15',
|
||||
state: false,
|
||||
id: 16
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始16',
|
||||
state: false,
|
||||
id: 17
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
},
|
||||
{
|
||||
text: 'h就开始',
|
||||
state: false
|
||||
text: 'h就开始17',
|
||||
state: false,
|
||||
id: 18
|
||||
}
|
||||
],
|
||||
datarts: {
|
||||
list1: '大于(>)',
|
||||
list2: '小于(<)',
|
||||
list3: '大于等于(>=)',
|
||||
list4: '小于(<=)',
|
||||
list4: '小于等于(<=)',
|
||||
list5: '>',
|
||||
list6: '<'
|
||||
},
|
||||
selectChange: '大于(>)',
|
||||
textareas: ''
|
||||
textareas: '',
|
||||
nums: '',
|
||||
// 选中的筛选条件
|
||||
selectDatas: []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
selectAudio (newValue, oldValue) {
|
||||
if (newValue === 'hang') {
|
||||
// 行列新增渲染
|
||||
if (this.$route.query.type === 'area') {
|
||||
this.labelData = this.$store.state.transBefore.areaName
|
||||
} else {
|
||||
this.dataList = this.$store.state.transBefore.termsName.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: false,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
}
|
||||
} else if (newValue === 'lie') {
|
||||
// 行列新增渲染
|
||||
this.dataList = this.$store.state.transBefore.timeArr.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: false,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -159,6 +215,437 @@ export default {
|
||||
this.dataList.forEach((item, index) => {
|
||||
index === ind ? item.state = true : item.state = false
|
||||
})
|
||||
},
|
||||
changeBghuio (ind) {
|
||||
this.selectDatas.forEach((item, index) => {
|
||||
index === ind ? item.state = true : item.state = false
|
||||
})
|
||||
},
|
||||
// 添加筛选条件
|
||||
insertData () {
|
||||
console.log(this.dataList.find(item => item.state === true))
|
||||
if (this.dataList.find(item => item.state === true) !== undefined && this.nums !== '' && /^[0-9]+$/.test(this.nums)) {
|
||||
let fuh = ''
|
||||
switch (this.selectChange) {
|
||||
case '大于(>)':
|
||||
fuh = '>'
|
||||
break
|
||||
case '小于(<)':
|
||||
fuh = '<'
|
||||
break
|
||||
case '大于等于(>=)':
|
||||
fuh = '>='
|
||||
break
|
||||
case '小于等于(<=)':
|
||||
fuh = '<='
|
||||
break
|
||||
}
|
||||
this.selectDatas.push({
|
||||
text: '#' + this.dataList.find(item => item.state === true).text + '#' + fuh + this.nums,
|
||||
id: this.dataList.find(item => item.state === true).id,
|
||||
state: false
|
||||
})
|
||||
} else {
|
||||
alert('无法添加筛选条件！筛选条件不正确！')
|
||||
}
|
||||
},
|
||||
// 删除筛选条件
|
||||
deleteData () {
|
||||
if (this.selectDatas.find(item => item.state === true) !== undefined) {
|
||||
this.selectDatas = this.selectDatas.filter((item, index) => {
|
||||
console.log(item.state)
|
||||
return item.state === false
|
||||
})
|
||||
} else {
|
||||
alert('请选择您需要删除的筛选条件！')
|
||||
}
|
||||
},
|
||||
// 筛选左侧数据
|
||||
changeLeftData () {
|
||||
if (this.selectDatas.length > 0) {
|
||||
if (this.selectAudio === 'hang') {
|
||||
if (this.$route.query.type !== 'area') {
|
||||
// 筛选条件
|
||||
// console.log(this.selectDatas, 'selectDatas')
|
||||
// console.log(this.$store.state.transBefore.timeArr)
|
||||
// console.log(this.selectDatas[0].text.split('#')[1], 'this.selectDatas.text.split(#)')
|
||||
let newDataBefore = JSON.parse(JSON.stringify(this.$store.state.transBefore.transBeforeTermsData))
|
||||
// 返回下标
|
||||
let brre = this.selectDatas.map((list, key) => {
|
||||
return this.$store.state.transBefore.termsName.indexOf(list.text.split('#')[1])
|
||||
})
|
||||
// 返回表达式
|
||||
let brreWay = this.selectDatas.map((list, key) => {
|
||||
return {
|
||||
text: list.text.split('#')[1],
|
||||
way: list.text.split('#')[2]
|
||||
}
|
||||
})
|
||||
// 第一次过滤出来的数据
|
||||
let firstData = newDataBefore.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
}).map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
return {
|
||||
index: key,
|
||||
value: list
|
||||
}
|
||||
})
|
||||
})
|
||||
// console.log(firstData, 'newDataBefore')
|
||||
// console.log(brreWay, 'brreWay')
|
||||
// 第二次过滤
|
||||
let DataTwo = []
|
||||
firstData.forEach((item, index) => {
|
||||
DataTwo.push(
|
||||
item.filter((list, key) => {
|
||||
/* eslint-disable */
|
||||
// console.log(eval(list.value + brreWay[index].way))
|
||||
return eval(list.value + brreWay[index].way) === true
|
||||
})
|
||||
)
|
||||
})
|
||||
// console.log(DataTwo, '第二次过滤')
|
||||
// 第三次过滤
|
||||
// 定义一个数组用来存储全集的下标
|
||||
let AllLabelIndex = []
|
||||
let threeData = DataTwo.forEach((item, index) => {
|
||||
let itemDAta = item.map((list, key) => {
|
||||
return Object.values(list)[0]
|
||||
})
|
||||
// console.log(itemDAta)
|
||||
AllLabelIndex = this.concat(AllLabelIndex, itemDAta)
|
||||
})
|
||||
console.log(AllLabelIndex, '连接数组')
|
||||
// 第三次过滤并且复制
|
||||
let waiBrr = firstData.map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
// console.log(list)
|
||||
return list.value
|
||||
})
|
||||
}).map((item, index) => {
|
||||
return item.filter((list, key) => {
|
||||
return AllLabelIndex.indexOf(key) !== -1
|
||||
})
|
||||
})
|
||||
console.log(waiBrr, '处理后的数据')
|
||||
this.$store.state.transBefore.transBeforeTermsData = waiBrr
|
||||
this.$store.state.transBefore.timeArr = this.$store.state.transBefore.timeArr.filter((item, index) => {
|
||||
return AllLabelIndex.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.transBefore.termsExplain = this.$store.state.transBefore.termsExplain.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
})
|
||||
this.$store.state.transBefore.termsName = this.$store.state.transBefore.termsName.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
})
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
// 关闭窗口
|
||||
this.$store.state.selcettWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
} else {
|
||||
// 筛选条件
|
||||
// console.log(this.selectDatas, 'selectDatas')
|
||||
// console.log(this.$store.state.transBefore.timeArr)
|
||||
// console.log(this.selectDatas[0].text.split('#')[1], 'this.selectDatas.text.split(#)')
|
||||
let newDataBefore = JSON.parse(JSON.stringify(this.$store.state.transBefore.transBeforeAreaData))
|
||||
// 返回下标
|
||||
let brre = this.selectDatas.map((list, key) => {
|
||||
return this.$store.state.transBefore.areaName.indexOf(list.text.split('#')[1])
|
||||
})
|
||||
// 返回表达式
|
||||
let brreWay = this.selectDatas.map((list, key) => {
|
||||
return {
|
||||
text: list.text.split('#')[1],
|
||||
way: list.text.split('#')[2]
|
||||
}
|
||||
})
|
||||
// 第一次过滤出来的数据
|
||||
let firstData = newDataBefore.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
}).map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
return {
|
||||
index: key,
|
||||
value: list
|
||||
}
|
||||
})
|
||||
})
|
||||
// console.log(firstData, 'newDataBefore')
|
||||
// console.log(brreWay, 'brreWay')
|
||||
// 第二次过滤
|
||||
let DataTwo = []
|
||||
firstData.forEach((item, index) => {
|
||||
DataTwo.push(
|
||||
item.filter((list, key) => {
|
||||
/* eslint-disable */
|
||||
// console.log(eval(list.value + brreWay[index].way))
|
||||
return eval(list.value + brreWay[index].way) === true
|
||||
})
|
||||
)
|
||||
})
|
||||
// console.log(DataTwo, '第二次过滤')
|
||||
// 第三次过滤
|
||||
// 定义一个数组用来存储全集的下标
|
||||
let AllLabelIndex = []
|
||||
let threeData = DataTwo.forEach((item, index) => {
|
||||
let itemDAta = item.map((list, key) => {
|
||||
return Object.values(list)[0]
|
||||
})
|
||||
// console.log(itemDAta)
|
||||
AllLabelIndex = this.concat(AllLabelIndex, itemDAta)
|
||||
})
|
||||
console.log(AllLabelIndex, '连接数组')
|
||||
// 第三次过滤并且复制
|
||||
let waiBrr = firstData.map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
// console.log(list)
|
||||
return list.value
|
||||
})
|
||||
}).map((item, index) => {
|
||||
return item.filter((list, key) => {
|
||||
return AllLabelIndex.indexOf(key) !== -1
|
||||
})
|
||||
})
|
||||
console.log(waiBrr, '处理后的数据')
|
||||
this.$store.state.transBefore.transBeforeAreaData = waiBrr
|
||||
this.$store.state.transBefore.timeArr = this.$store.state.transBefore.timeArr.filter((item, index) => {
|
||||
return AllLabelIndex.indexOf(index) !== -1
|
||||
})
|
||||
// this.$store.state.transBefore.termsExplain = this.$store.state.transBefore.termsExplain.filter((item, index) => {
|
||||
// return brre.indexOf(index) !== -1
|
||||
// })
|
||||
this.$store.state.transBefore.areaName = this.$store.state.transBefore.areaName.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
})
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
// 关闭窗口
|
||||
this.$store.state.selcettWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
}
|
||||
} else if (this.selectAudio === 'lie') {
|
||||
if (this.$route.query.type !== 'area') {
|
||||
// 筛选条件
|
||||
let newDataBefore = JSON.parse(JSON.stringify(this.$store.state.transBefore.transBeforeTermsData))
|
||||
// 转置
|
||||
newDataBefore = newDataBefore[0].map(function (col, index) {
|
||||
return newDataBefore.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
// console.log(newDataBefore,'转置')
|
||||
// 返回下标
|
||||
let brre = this.selectDatas.map((list, key) => {
|
||||
return this.$store.state.transBefore.timeArr.indexOf(list.text.split('#')[1])
|
||||
})
|
||||
console.log(brre, 'brre')
|
||||
// 返回表达式
|
||||
let brreWay = this.selectDatas.map((list, key) => {
|
||||
return {
|
||||
text: list.text.split('#')[1],
|
||||
way: list.text.split('#')[2]
|
||||
}
|
||||
})
|
||||
// 第一次过滤出来的数据
|
||||
let firstData = newDataBefore.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
}).map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
return {
|
||||
index: key,
|
||||
value: list
|
||||
}
|
||||
})
|
||||
})
|
||||
// console.log(firstData, 'newDataBefore')
|
||||
// console.log(brreWay, 'brreWay')
|
||||
// 第二次过滤
|
||||
let DataTwo = []
|
||||
firstData.forEach((item, index) => {
|
||||
DataTwo.push(
|
||||
item.filter((list, key) => {
|
||||
/* eslint-disable */
|
||||
// console.log(eval(list.value + brreWay[index].way))
|
||||
return eval(list.value + brreWay[index].way) === true
|
||||
})
|
||||
)
|
||||
})
|
||||
// console.log(DataTwo, '第二次过滤')
|
||||
// 第三次过滤
|
||||
// 定义一个数组用来存储全集的下标
|
||||
let AllLabelIndex = []
|
||||
let threeData = DataTwo.forEach((item, index) => {
|
||||
let itemDAta = item.map((list, key) => {
|
||||
return Object.values(list)[0]
|
||||
})
|
||||
// console.log(itemDAta)
|
||||
AllLabelIndex = this.concat(AllLabelIndex, itemDAta)
|
||||
})
|
||||
console.log(AllLabelIndex, '连接数组')
|
||||
// 第三次过滤并且复制
|
||||
let waiBrr = firstData.map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
// console.log(list)
|
||||
return list.value
|
||||
})
|
||||
}).map((item, index) => {
|
||||
return item.filter((list, key) => {
|
||||
return AllLabelIndex.indexOf(key) !== -1
|
||||
})
|
||||
})
|
||||
console.log(waiBrr, '处理后的数据')
|
||||
// 转置回来
|
||||
waiBrr = waiBrr[0].map(function (col, index) {
|
||||
return waiBrr.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
this.$store.state.transBefore.transBeforeTermsData = waiBrr
|
||||
// console.log(AllLabelIndex,'AllLabelIndex')
|
||||
this.$store.state.transBefore.timeArr = this.$store.state.transBefore.timeArr.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
})
|
||||
// this.$store.state.transBefore.termsExplain = this.$store.state.transBefore.termsExplain.filter((item, index) => {
|
||||
// return brre.indexOf(index) !== -1
|
||||
// })
|
||||
// this.$store.state.transBefore.termsName = this.$store.state.transBefore.termsName.filter((item, index) => {
|
||||
// return brre.indexOf(index) !== -1
|
||||
// })
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
// 关闭窗口
|
||||
this.$store.state.selcettWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
} else {//地区列数据
|
||||
// 筛选条件
|
||||
let newDataBefore = JSON.parse(JSON.stringify(this.$store.state.transBefore.transBeforeAreaData))
|
||||
// 转置
|
||||
newDataBefore = newDataBefore[0].map(function (col, index) {
|
||||
return newDataBefore.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
// console.log(newDataBefore,'转置')
|
||||
// 返回下标
|
||||
let brre = this.selectDatas.map((list, key) => {
|
||||
return this.$store.state.transBefore.timeArr.indexOf(list.text.split('#')[1])
|
||||
})
|
||||
console.log(brre, 'brre')
|
||||
// 返回表达式
|
||||
let brreWay = this.selectDatas.map((list, key) => {
|
||||
return {
|
||||
text: list.text.split('#')[1],
|
||||
way: list.text.split('#')[2]
|
||||
}
|
||||
})
|
||||
// 第一次过滤出来的数据
|
||||
let firstData = newDataBefore.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
}).map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
return {
|
||||
index: key,
|
||||
value: list
|
||||
}
|
||||
})
|
||||
})
|
||||
// console.log(firstData, 'newDataBefore')
|
||||
// console.log(brreWay, 'brreWay')
|
||||
// 第二次过滤
|
||||
let DataTwo = []
|
||||
firstData.forEach((item, index) => {
|
||||
DataTwo.push(
|
||||
item.filter((list, key) => {
|
||||
/* eslint-disable */
|
||||
// console.log(eval(list.value + brreWay[index].way))
|
||||
return eval(list.value + brreWay[index].way) === true
|
||||
})
|
||||
)
|
||||
})
|
||||
// console.log(DataTwo, '第二次过滤')
|
||||
// 第三次过滤
|
||||
// 定义一个数组用来存储全集的下标
|
||||
let AllLabelIndex = []
|
||||
let threeData = DataTwo.forEach((item, index) => {
|
||||
let itemDAta = item.map((list, key) => {
|
||||
return Object.values(list)[0]
|
||||
})
|
||||
// console.log(itemDAta)
|
||||
AllLabelIndex = this.concat(AllLabelIndex, itemDAta)
|
||||
})
|
||||
console.log(AllLabelIndex, '连接数组')
|
||||
// 第三次过滤并且复制
|
||||
let waiBrr = firstData.map((item, index) => {
|
||||
return item.map((list, key) => {
|
||||
// console.log(list)
|
||||
return list.value
|
||||
})
|
||||
}).map((item, index) => {
|
||||
return item.filter((list, key) => {
|
||||
return AllLabelIndex.indexOf(key) !== -1
|
||||
})
|
||||
})
|
||||
console.log(waiBrr, '处理后的数据')
|
||||
// 转置回来
|
||||
waiBrr = waiBrr[0].map(function (col, index) {
|
||||
return waiBrr.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
this.$store.state.transBefore.transBeforeAreaData = waiBrr
|
||||
this.$store.state.transBefore.timeArr = this.$store.state.transBefore.timeArr.filter((item, index) => {
|
||||
return brre.indexOf(index) !== -1
|
||||
})
|
||||
// this.$store.state.transBefore.termsExplain = this.$store.state.transBefore.termsExplain.filter((item, index) => {
|
||||
// return brre.indexOf(index) !== -1
|
||||
// })
|
||||
// this.$store.state.transBefore.termsName = this.$store.state.transBefore.termsName.filter((item, index) => {
|
||||
// return brre.indexOf(index) !== -1
|
||||
// })
|
||||
console.log(this.$store.state.transBefore, 'this.$store.state.transBefore')
|
||||
// 关闭窗口
|
||||
this.$store.state.selcettWindowState = false
|
||||
this.$emit('emitState', true)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
alert('筛选条件不能为空')
|
||||
}
|
||||
},
|
||||
// 数组合并去重排序
|
||||
concat(arr1, arr2) {
|
||||
if (arguments.length <= 1) {
|
||||
return false;
|
||||
}
|
||||
var concat_ = function (arr1, arr2) {
|
||||
var arr = arr1.concat();
|
||||
for (var i = 0; i < arr2.length; i++) {
|
||||
arr.indexOf(arr2[i]) === -1 ? arr.push(arr2[i]) : 0;
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
var result = concat_(arr1, arr2);
|
||||
for (var i = 2; i < arguments.length; i++) {
|
||||
result = concat_(result, arguments[i]);
|
||||
}
|
||||
//排序
|
||||
function sortNumber(a, b) {
|
||||
return a - b;
|
||||
}
|
||||
return result.sort(sortNumber);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 行列新增渲染
|
||||
if (this.$route.query.type === 'area') {
|
||||
this.dataList = this.$store.state.transBefore.areaName
|
||||
} else {
|
||||
this.dataList = this.$store.state.transBefore.termsName.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
state: false,
|
||||
id: index
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -287,11 +774,29 @@ export default {
|
||||
color: #fff;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
& > div:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
& > .right {
|
||||
& > textarea {
|
||||
width: 20.625rem;
|
||||
height: 22.875rem;
|
||||
width: 20.625rem;
|
||||
height: 22.875rem;
|
||||
border: 1px solid #bdbdbd;
|
||||
overflow: auto;
|
||||
& > div {
|
||||
width: 100%;
|
||||
height: 1.8rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
& > .active {
|
||||
background-color: deepskyblue;
|
||||
color: #fff;
|
||||
}
|
||||
& > div:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -331,8 +836,11 @@ export default {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
&>div{
|
||||
margin:3rem 1.2rem;
|
||||
& > div {
|
||||
margin: 3rem 1.2rem;
|
||||
}
|
||||
& > div:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
24
src/main.js
24
src/main.js
@@ -51,6 +51,7 @@ var root = process.env.VUE_APP_BASE_API
|
||||
|
||||
// 请求拦截器(前)
|
||||
axios.interceptors.request.use(config => {
|
||||
// console.log(config, 'config')
|
||||
// --请求之前重新拼装url--
|
||||
config.url = root + config.url
|
||||
// --默认请求参数--
|
||||
@@ -76,6 +77,29 @@ axios.interceptors.response.use(data => {
|
||||
}
|
||||
return data
|
||||
})
|
||||
// IP端
|
||||
axios({
|
||||
method: 'GET',
|
||||
url: 'site/check',
|
||||
params: {}
|
||||
}).then(res => {
|
||||
// console.log(res, 'IP段')
|
||||
if (res.data.code === 200) {
|
||||
if (!localStorage.getItem('userLogin')) {
|
||||
history.go(0)
|
||||
}
|
||||
// 用户信息存本地
|
||||
localStorage.setItem('username', res.data.data.username)
|
||||
localStorage.setItem('pic', res.data.data.pic)
|
||||
localStorage.setItem('userPwd', '123456')
|
||||
localStorage.setItem('token', 'Bearer ' + res.data.data.token)
|
||||
// 登录状态
|
||||
localStorage.setItem('userLogin', true)
|
||||
}
|
||||
// 请求接口完成 请求成功
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
// 将图形验证码写入
|
||||
Vue.prototype.$identify = identify.default
|
||||
Vue.prototype.$axios = axios
|
||||
|
||||
38
src/store.js
38
src/store.js
@@ -18,11 +18,43 @@ export default new Vuex.Store({
|
||||
// 指标解释数据
|
||||
labelExplainData: '这是指标解释使劲儿发红包健康撒大部分更健康',
|
||||
// 维度转换状态
|
||||
dimensionState: false
|
||||
},
|
||||
mutations: {
|
||||
dimensionState: false,
|
||||
// 数据表中的数据
|
||||
transdtr: true,
|
||||
// 高级查询带出来的数据
|
||||
advanceData: null,
|
||||
// 左侧数据选中的那个
|
||||
selectDataLeft: null,
|
||||
// 区分简单查询和高级查询状态1:简单查询2：高级查询
|
||||
searchState: 1,
|
||||
// 添加收藏的名字
|
||||
nameCollect: '',
|
||||
// 选中列的数据下标
|
||||
listInputVal: [0, 1, 2],
|
||||
// 选行的数据下标
|
||||
lineInputVal: [0, 1, 2, 3],
|
||||
// 渲染的表数据
|
||||
tableData: null,
|
||||
// 表的列数据
|
||||
tableLine: null,
|
||||
// 全局定义总数据
|
||||
transBefore: null,
|
||||
// 全聚德数据状态 1无变化 2变化
|
||||
allState: 1,
|
||||
// 全体的数据不会发生改变
|
||||
noChangeData: null,
|
||||
// 编辑
|
||||
// 选中行下标
|
||||
selectLabelHang: null,
|
||||
// 选中列下标
|
||||
selectLabelLie: null,
|
||||
// 下拉筛选分类
|
||||
selectfilter: null,
|
||||
// 下拉筛选条件
|
||||
selectData: 1010110
|
||||
|
||||
},
|
||||
mutations: {},
|
||||
actions: {
|
||||
|
||||
}
|
||||
|
||||
@@ -43,7 +43,7 @@
|
||||
:key="key"
|
||||
@mouseover="mouseoverCate('hierarchy2',key)"
|
||||
@mouseleave="mouseleaveCate('hierarchy2',key)"
|
||||
@click="clickCate('hierarchy2',key,list.text)"
|
||||
@click.stop="clickCate('hierarchy2',key,list.text)"
|
||||
>
|
||||
{{list.text}}
|
||||
<div class="secondWindow" v-if="list.text==='统计' && list.static">
|
||||
@@ -177,13 +177,22 @@
|
||||
>
|
||||
<!-- 列表 -->
|
||||
<!-- 图标切换 -->
|
||||
<ChartsCut @cutStatic="cutStatic"></ChartsCut>
|
||||
<ChartsCut
|
||||
@cutStatic="cutStatic"
|
||||
v-if="$store.state.transdtr"
|
||||
:defaultDataRight="defaultDataRight"
|
||||
@stateTell="stateTell"
|
||||
></ChartsCut>
|
||||
<!-- 列表内容 -->
|
||||
<ChartsCont
|
||||
:indStatic="indStatic"
|
||||
:chartsStatusMegger="chartsStatusMegger"
|
||||
:defaultDataRight="defaultDataRight"
|
||||
:stateTells="stateTells"
|
||||
@comTime="comTime"
|
||||
:statesDf="statesDf"
|
||||
@tellAreadly="tellAreadly"
|
||||
@prentsState="prentsState"
|
||||
></ChartsCont>
|
||||
</div>
|
||||
<div class="container">
|
||||
@@ -223,11 +232,11 @@
|
||||
<!-- 指标解释 -->
|
||||
<LabelExplain v-if="$store.state.labelExplainState"></LabelExplain>
|
||||
<!-- 新增指标 -->
|
||||
<InsertLabel v-if="$store.state.insertWindowState"></InsertLabel>
|
||||
<InsertLabel v-if="$store.state.insertWindowState" @emitState="emitStatesd"></InsertLabel>
|
||||
<!-- 筛选 -->
|
||||
<ScreenCom v-if="$store.state.selcettWindowState"></ScreenCom>
|
||||
<ScreenCom v-if="$store.state.selcettWindowState" @emitState="emitStatesd"></ScreenCom>
|
||||
<!-- 编辑 -->
|
||||
<EditCom v-if="$store.state.editWindowState"></EditCom>
|
||||
<EditCom v-if="$store.state.editWindowState" @emitState="emitStatesd">></EditCom>
|
||||
<!-- 添加收藏 -->
|
||||
<AddCollect v-if="$store.state.addCollectState"></AddCollect>
|
||||
<!-- 维度转换 -->
|
||||
@@ -264,6 +273,10 @@ import AddCollect from '@/components/addCollect/AddCollect.vue'
|
||||
import LabelExplain from '@/components/labelExplain/LabelExplain.vue'
|
||||
// 维度转换
|
||||
import Dimension from '@/components/dimension/Dimension.vue'
|
||||
// 引入数据计算js用于机选渲染的数据
|
||||
import ComputedData from '../../assets/js/computeddata'
|
||||
// 引入全局的createObjectUrl用于覆盖window.URL
|
||||
// import '../../assets/js/createObjectUrl'
|
||||
|
||||
export default {
|
||||
name: 'index',
|
||||
@@ -389,11 +402,15 @@ export default {
|
||||
leftCateData: null,
|
||||
// 简单查询、高级查询、数据地图切换状态(simpleness（简单）、advanced（高级） 、map（地图）)
|
||||
cutStateSeach: 'simpleness',
|
||||
// 下来帅选的数据
|
||||
// 下拉筛选的数据
|
||||
downLaSelect: {
|
||||
area: '',
|
||||
label: ''
|
||||
}
|
||||
},
|
||||
// 新增指标状态
|
||||
statesDf: 1,
|
||||
// 数据加载状态
|
||||
stateTells: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -444,6 +461,7 @@ export default {
|
||||
})
|
||||
console.log(datart)
|
||||
this.defaultDataRight = datart
|
||||
this.$store.state.selectfilter = this.defaultDataRight.f
|
||||
},
|
||||
handleClose (key, keyPath) {
|
||||
// console.log(key, keyPath)
|
||||
@@ -493,17 +511,87 @@ export default {
|
||||
case 2:
|
||||
this.cutStateSeach = 'map'
|
||||
break
|
||||
case 3:
|
||||
case 3:// 添加收藏
|
||||
this.$store.state.addCollectState = true
|
||||
// console.log(this.$store.state.selectDataLeft, 'this.$store.state.selectDataLeft')
|
||||
break
|
||||
case 4:
|
||||
case 4:// 导出至excel！！
|
||||
let brt = new ComputedData()
|
||||
brt.insertCollectS(this.$store.state.tableData, this.$store.state.tableLine, this.$store.state.listInputVal, this.$store.state.lineInputVal)
|
||||
console.log(this.$store.state.selectDataLeft, '左侧选中数据')
|
||||
let objData = brt.insertCollectS(JSON.parse(JSON.stringify(this.$store.state.tableData)), JSON.parse(JSON.stringify(this.$store.state.tableLine)), JSON.parse(JSON.stringify(this.$store.state.listInputVal)), JSON.parse(JSON.stringify(this.$store.state.lineInputVal)))
|
||||
// 调用接口导出至excel
|
||||
this.$axios({
|
||||
method: 'POST',
|
||||
url: 'data/data/download',
|
||||
data: {
|
||||
classify: this.$store.state.selectDataLeft.id,
|
||||
tableData: objData.tableData,
|
||||
header: objData.header
|
||||
},
|
||||
responseType: 'blob'// 防止接收文件流乱码 格式blob
|
||||
}).then(res => {
|
||||
console.log(res, '导出至excel！！')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.status === 200) {
|
||||
const a = document.createElement('a')
|
||||
a.download = res.headers['content-disposition'].split('"')[1]
|
||||
a.style.display = 'none'
|
||||
a.href = window.URL.createObjectURL(res.data)
|
||||
a.click()
|
||||
a.remove()
|
||||
window.URL.revokeObjectURL(window.URL.createObjectURL(res.data))
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
break
|
||||
case 5:
|
||||
break
|
||||
case 6:
|
||||
break
|
||||
case 'search':// 调接进行高级查询
|
||||
console.log(1010101010)
|
||||
// 调用接口查询高级查询的数据
|
||||
console.log(this.$store.state.advanceData)
|
||||
this.$axios({
|
||||
method: 'GET',
|
||||
url: 'data/data/quick',
|
||||
params: {
|
||||
type: this.$route.query.type
|
||||
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '时间筛选')
|
||||
console.log(Object.keys(res.data.data.list))
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
this.$axios({
|
||||
method: 'POST',
|
||||
url: 'data/data/query',
|
||||
data: {
|
||||
type: this.$route.query.type === 'area' ? 2 : 1,
|
||||
data: this.$store.state.advanceData,
|
||||
area: '',
|
||||
quota: '',
|
||||
cate: '',
|
||||
filter: this.$route.query.type,
|
||||
date: Object.keys(res.data.data.list)[0]
|
||||
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res, '高级查询数据展示')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
}
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
|
||||
break
|
||||
}
|
||||
},
|
||||
@@ -533,24 +621,88 @@ export default {
|
||||
case '筛选':
|
||||
this.$store.state.selcettWindowState = true
|
||||
break
|
||||
case '恢复':
|
||||
case '恢复':// 恢复
|
||||
this.$router.go(0)
|
||||
break
|
||||
case '清除空行空列':
|
||||
case '清除空行空列':// 清除空行空列
|
||||
this.$router.go(0)
|
||||
if (this.$store.state.transBefore) {
|
||||
// 先过滤每一行
|
||||
this.$store.state.transBefore = this.$store.state.transBefore.filter((item, index) => {
|
||||
return !item.some((item, index) => {
|
||||
return item === ''
|
||||
}) === true
|
||||
})
|
||||
// 在过滤每一列
|
||||
// 行列转置
|
||||
this.$store.state.transBefore = this.$store.state.transBefore[0].map(function (col, index) {
|
||||
return this.$store.state.transBefore.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
// 在过滤每一行
|
||||
this.$store.state.transBefore = this.$store.state.transBefore.filter((item, index) => {
|
||||
return !item.some((item, index) => {
|
||||
return item === ''
|
||||
}) === true
|
||||
})
|
||||
// 行列转置
|
||||
this.$store.state.transBefore = this.$store.state.transBefore[0].map(function (col, index) {
|
||||
return this.$store.state.transBefore.map((row, key) => {
|
||||
return row[index]
|
||||
})
|
||||
})
|
||||
}
|
||||
break
|
||||
case '编辑':
|
||||
this.$store.state.editWindowState = true
|
||||
break
|
||||
case '转置':
|
||||
console.log(100000)
|
||||
this.chartsStatusMegger.transState = !this.chartsStatusMegger.transState
|
||||
console.log(this.chartsStatusMegger.transState)
|
||||
break
|
||||
case '维度转换':
|
||||
this.$store.state.dimensionState = true
|
||||
break
|
||||
case '保存默认':
|
||||
case '保存默认':// 将分类id 和 分类数据存入本地
|
||||
// 获取本地保存数据
|
||||
console.log(JSON.parse(localStorage.getItem('classFiyData')), 'classFiyData')
|
||||
if (JSON.parse(localStorage.getItem('classFiyData'))) {
|
||||
let arrtsBGY = JSON.parse(localStorage.getItem('classFiyData'))
|
||||
console.log(this.defaultDataRight.id, 'this.defaultDataRight.id')
|
||||
if (!arrtsBGY.find(item => item.id === this.defaultDataRight.id)) {
|
||||
arrtsBGY.push({
|
||||
id: this.defaultDataRight.id,
|
||||
data: this.$store.state.transBefore
|
||||
})
|
||||
localStorage.setItem('classFiyData', JSON.stringify(arrtsBGY))
|
||||
} else {
|
||||
console.log('走这里')
|
||||
arrtsBGY.find(item => item.id === this.defaultDataRight.id).data = this.$store.state.transBefore
|
||||
localStorage.setItem('classFiyData', JSON.stringify(arrtsBGY))
|
||||
}
|
||||
} else {
|
||||
localStorage.setItem('classFiyData', JSON.stringify([{
|
||||
id: this.defaultDataRight.id,
|
||||
data: this.$store.state.transBefore
|
||||
}]))
|
||||
}
|
||||
alert('默认数据已保存！')
|
||||
break
|
||||
case '恢复默认':
|
||||
case '恢复默认':// 将分类id 和 分类数据从本地删除
|
||||
if (JSON.parse(localStorage.getItem('classFiyData'))) {
|
||||
let arrtsBGY = JSON.parse(localStorage.getItem('classFiyData'))
|
||||
if (!arrtsBGY.find(item => item.id === this.defaultDataRight.id)) {
|
||||
alert('默认数据已恢复！')
|
||||
} else {
|
||||
arrtsBGY = arrtsBGY.filter((item, index) => {
|
||||
return item.id !== this.defaultDataRight.id
|
||||
})
|
||||
localStorage.setItem('classFiyData', JSON.stringify(arrtsBGY))
|
||||
}
|
||||
} else {
|
||||
alert('默认数据已恢复！')
|
||||
}
|
||||
this.$router.go(0)
|
||||
break
|
||||
}
|
||||
},
|
||||
@@ -688,7 +840,7 @@ export default {
|
||||
defaultSelectLie () {
|
||||
let stateStatic = []
|
||||
this.leftCateData.forEach((item1, index1) => {
|
||||
if (index1 === 0) {
|
||||
if (index1 === this.leftCateData.length - 1) {
|
||||
stateStatic.push('' + index1)
|
||||
if (item1.children) {
|
||||
item1.children.forEach((item2, index2) => {
|
||||
@@ -721,19 +873,57 @@ export default {
|
||||
}
|
||||
})
|
||||
this.defaultSelectLies = stateStatic
|
||||
// console.log(this.defaultSelectLies, 'stateStatic')
|
||||
console.log(this.defaultSelectLies, 'stateStatic')
|
||||
let dataDome = []
|
||||
console.log(stateStatic, '数据')
|
||||
console.log(this.leftCateData[0].children[0], '数据0')
|
||||
JSON.parse(JSON.stringify(stateStatic)).forEach((item, index) => {
|
||||
console.log(index)
|
||||
index === 0 ? (dataDome = this.leftCateData[index]) : (dataDome = dataDome.children[0])
|
||||
})
|
||||
console.log(this.leftCateData[this.leftCateData.length - 1], '数据length-1')
|
||||
this.$store.state.selectDataLeft = this.leftCateData[this.leftCateData.length - 1]
|
||||
console.log(this.leftCateData[this.leftCateData.length - 1].children[0].children[0].children[0].children[0], '1')
|
||||
if (this.leftCateData[this.leftCateData.length - 1].children !== undefined) {
|
||||
if (this.leftCateData[this.leftCateData.length - 1].children[0].children !== undefined) {
|
||||
if (this.leftCateData[this.leftCateData.length - 1].children[0].children[0].children !== undefined) {
|
||||
if (this.leftCateData[this.leftCateData.length - 1].children[0].children[0].children[0].children !== undefined) {
|
||||
dataDome = this.leftCateData[this.leftCateData.length - 1].children[0].children[0].children[0].children[0]
|
||||
} else {
|
||||
dataDome = this.leftCateData[this.leftCateData.length - 1].children[0].children[0].children[0]
|
||||
}
|
||||
} else {
|
||||
dataDome = this.leftCateData[this.leftCateData.length - 1].children[0].children[0]
|
||||
}
|
||||
} else {
|
||||
dataDome = this.leftCateData[this.leftCateData.length - 1].children[0]
|
||||
}
|
||||
} else {
|
||||
dataDome = this.leftCateData[this.leftCateData.length - 1]
|
||||
}
|
||||
this.defaultDataRight = dataDome
|
||||
console.log(this.defaultDataRight, '1250')
|
||||
this.$store.state.selectfilter = this.defaultDataRight.f
|
||||
},
|
||||
comTime (res) {
|
||||
this.downLaSelect.time = res
|
||||
},
|
||||
// 接收子组件传值新增指标
|
||||
emitStatesd (val) {
|
||||
console.log(val, 'val')
|
||||
if (val) {
|
||||
console.log(val)
|
||||
this.statesDf = 2
|
||||
} else {
|
||||
this.statesDf = 1
|
||||
}
|
||||
},
|
||||
// 重置参数
|
||||
tellAreadly (val) {
|
||||
this.statesDf = val
|
||||
},
|
||||
// 接收并且改变参数
|
||||
stateTell (val) {
|
||||
this.stateTells = val
|
||||
},
|
||||
// 重置参数
|
||||
prentsState (val) {
|
||||
this.stateTells = val
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -789,6 +979,9 @@ export default {
|
||||
// })
|
||||
// 获取菜单信息
|
||||
this.getCateData()
|
||||
},
|
||||
updated () {
|
||||
// console.log(this.defaultDataRight, 'this.defaultSelectLies')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -997,7 +1190,7 @@ export default {
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
border: 1px solid red;
|
||||
// border: 1px solid red;
|
||||
& > .data_left {
|
||||
overflow: auto;
|
||||
// width: 25.375rem;
|
||||
|
||||
@@ -47,6 +47,7 @@
|
||||
<div
|
||||
v-for="(listLeft,keyLeft) in item.textArrLeft"
|
||||
:key="keyLeft"
|
||||
@click="jumpLianjie(true)"
|
||||
>{{listLeft.name}}</div>
|
||||
</div>
|
||||
<div class="center"></div>
|
||||
@@ -54,6 +55,7 @@
|
||||
<div
|
||||
v-for="(listRight,keyRight) in item.textArrRight"
|
||||
:key="keyRight"
|
||||
@click="jumpLianjie(true)"
|
||||
class="ListpaneRight"
|
||||
>{{listRight.name}}</div>
|
||||
</div>
|
||||
@@ -113,7 +115,7 @@
|
||||
<div class="title">数据更新</div>
|
||||
<div class="content">
|
||||
<div v-for="(item,index) in dataUpdata" :key="index">
|
||||
<div class="up">
|
||||
<div class="up" @click="jumpLianjie(false,item.filter)">
|
||||
{{computedStr(item.title)}}
|
||||
<!-- <div style="border:1px solid red;width:12rem;height: 2.125rem;"></div> -->
|
||||
<div class="next">({{item.updataTime}})</div>
|
||||
@@ -127,7 +129,7 @@
|
||||
<div v-for="(item,index) in twentyFourtimeData" :key="index">
|
||||
<img :src="item.url" alt />
|
||||
<div>
|
||||
<div class="top">{{item.title}}</div>
|
||||
<div class="top" :title="item.title">{{item.title}}</div>
|
||||
<div class="bottom">{{item.content}}</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -361,7 +363,10 @@ export default {
|
||||
title: '这是标题',
|
||||
content: '数据热文数据热文数据热文数据热文数据热文数据热文'
|
||||
}
|
||||
]
|
||||
],
|
||||
indexDatalabel: ['monthly', 'quarter', 'year'],
|
||||
// 选中的下标
|
||||
selectLabelS: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -370,7 +375,9 @@ export default {
|
||||
window.location.href = url
|
||||
},
|
||||
handleClick (tab, event) {
|
||||
console.log(101010)
|
||||
console.log(tab, event)
|
||||
this.selectLabelS = tab.index
|
||||
},
|
||||
// 获取banner
|
||||
getBanner () {
|
||||
@@ -490,7 +497,7 @@ export default {
|
||||
params: {
|
||||
}
|
||||
}).then(res => {
|
||||
// console.log(res, '数据更新')
|
||||
console.log(res, '数据更新')
|
||||
// 请求接口完成 请求成功
|
||||
if (res.data.code === 200) {
|
||||
let arrts = []
|
||||
@@ -535,6 +542,28 @@ export default {
|
||||
}).catch((fail) => {
|
||||
console.log(fail)
|
||||
})
|
||||
},
|
||||
// 跳转至数据
|
||||
jumpLianjie (state, value) {
|
||||
if (state) {
|
||||
this.$router.push(
|
||||
{
|
||||
path: '/datasweb',
|
||||
query: {
|
||||
type: this.indexDatalabel[this.selectLabelS]
|
||||
}
|
||||
}
|
||||
)
|
||||
} else {
|
||||
this.$router.push(
|
||||
{
|
||||
path: '/datasweb',
|
||||
query: {
|
||||
type: value
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
@@ -996,6 +1025,12 @@ export default {
|
||||
// line-height: 23px;
|
||||
letter-spacing: 0rem;
|
||||
color: #333333;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1; /* 省略号在第几行 */
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
& > .bottom {
|
||||
width: 16rem;
|
||||
|
||||
@@ -21,11 +21,11 @@
|
||||
</div>
|
||||
<div>
|
||||
<div>设置密码</div>
|
||||
<input type="text" placeholder="请输入密码" v-model="registerData.password" />
|
||||
<input type="password" placeholder="请输入密码" v-model="registerData.password" />
|
||||
</div>
|
||||
<div>
|
||||
<div>确认密码</div>
|
||||
<input type="text" placeholder="请重新输入密码" v-model="registerData.passwordQR" />
|
||||
<input type="password" placeholder="请重新输入密码" v-model="registerData.passwordQR" />
|
||||
</div>
|
||||
<div>
|
||||
<div>机构名称</div>
|
||||
|
||||
Reference in New Issue
Block a user