优化代码
Showing
17 changed files
with
185 additions
and
213 deletions
... | @@ -3,69 +3,69 @@ | ... | @@ -3,69 +3,69 @@ |
3 | </template> | 3 | </template> |
4 | 4 | ||
5 | <script> | 5 | <script> |
6 | import tdTheme from './theme.json' // 引入默认主题 | 6 | import tdTheme from "./theme.json"; // 引入默认主题 |
7 | import '../map/hanzhong.js' | 7 | import "../map/hanzhong.js"; |
8 | 8 | ||
9 | export default { | 9 | export default { |
10 | name: 'echart', | 10 | name: "echart", |
11 | props: { | 11 | props: { |
12 | className: { | 12 | className: { |
13 | type: String, | 13 | type: String, |
14 | default: 'chart' | 14 | default: "chart", |
15 | }, | 15 | }, |
16 | id: { | 16 | id: { |
17 | type: String, | 17 | type: String, |
18 | default: 'chart' | 18 | default: "chart", |
19 | }, | 19 | }, |
20 | width: { | 20 | width: { |
21 | type: String, | 21 | type: String, |
22 | default: '100%' | 22 | default: "100%", |
23 | }, | 23 | }, |
24 | height: { | 24 | height: { |
25 | type: String, | 25 | type: String, |
26 | default: '2.5rem' | 26 | default: "2.5rem", |
27 | }, | 27 | }, |
28 | options: { | 28 | options: { |
29 | type: Object, | 29 | type: Object, |
30 | default: () => ({}) | 30 | default: () => ({}), |
31 | } | 31 | }, |
32 | }, | 32 | }, |
33 | data () { | 33 | data() { |
34 | return { | 34 | return { |
35 | chart: null | 35 | chart: null, |
36 | } | 36 | }; |
37 | }, | 37 | }, |
38 | watch: { | 38 | watch: { |
39 | options: { | 39 | options: { |
40 | handler (options) { | 40 | handler(options) { |
41 | // 设置true清空echart缓存 | 41 | // 设置true清空echart缓存 |
42 | this.chart.setOption(options, true) | 42 | this.chart.setOption(options, true); |
43 | window.addEventListener('resize',()=>{ | 43 | window.addEventListener("resize", () => { |
44 | this.chart.resize() | 44 | if (this.chart) { |
45 | }) | 45 | this.chart.resize(); |
46 | }, | ||
47 | deep: true | ||
48 | } | 46 | } |
47 | }); | ||
48 | }, | ||
49 | deep: true, | ||
50 | }, | ||
49 | }, | 51 | }, |
50 | mounted () { | 52 | mounted() { |
51 | this.$echarts.registerTheme('tdTheme', tdTheme); // 覆盖默认主题 | 53 | this.$echarts.registerTheme("tdTheme", tdTheme); // 覆盖默认主题 |
52 | this.initChart(); | 54 | this.initChart(); |
53 | }, | 55 | }, |
54 | beforeDestroy () { | 56 | beforeDestroy() { |
55 | this.chart.dispose() | 57 | this.chart.dispose(); |
56 | this.chart = null | 58 | this.chart = null; |
57 | }, | 59 | }, |
58 | methods: { | 60 | methods: { |
59 | initChart () { | 61 | initChart() { |
60 | // 初始化echart | 62 | // 初始化echart |
61 | this.chart = this.$echarts.init(this.$el, 'tdTheme') | 63 | this.chart = this.$echarts.init(this.$el, "tdTheme"); |
62 | function nowSize(val,initWidth=1920){ | 64 | function nowSize(val, initWidth = 1920) { |
63 | return val * (nowClientWidth/initWidth); | 65 | return val * (nowClientWidth / initWidth); |
64 | } | ||
65 | this.chart.setOption(this.options, true) | ||
66 | |||
67 | |||
68 | } | ||
69 | } | 66 | } |
70 | } | 67 | this.chart.setOption(this.options, true); |
68 | }, | ||
69 | }, | ||
70 | }; | ||
71 | </script> | 71 | </script> | ... | ... |
1 | <template> | 1 | <template> |
2 | <!-- 柱状图 --> | 2 | <!--上报统计柱状图 --> |
3 | <Echart :options="options" id="bottomLeftChart" height="100%" width="100%"></Echart> | 3 | <Echart |
4 | :options="options" | ||
5 | id="bottomLeftChart" | ||
6 | height="100%" | ||
7 | width="100%" | ||
8 | ></Echart> | ||
4 | </template> | 9 | </template> |
5 | 10 | ||
6 | <script> | 11 | <script> |
7 | import Echart from "@/common/echart"; | 12 | import Echart from "@/common/echart"; |
8 | export default { | 13 | export default { |
9 | data () { | 14 | data() { |
10 | return { | 15 | return { |
11 | options: {}, | 16 | options: {}, |
12 | }; | 17 | }; |
... | @@ -22,16 +27,13 @@ export default { | ... | @@ -22,16 +27,13 @@ export default { |
22 | }, | 27 | }, |
23 | watch: { | 28 | watch: { |
24 | cdata: { | 29 | cdata: { |
25 | handler (newData) { | 30 | handler(newData) { |
26 | this.options = { | 31 | this.options = { |
27 | legend: { | 32 | tooltip: { |
28 | data: ["成功", "失败"], | 33 | trigger: "axis", |
29 | icon: "circle", | 34 | axisPointer: { |
30 | textStyle: { | 35 | type: "shadow", |
31 | color: "#B4B4B4", | ||
32 | }, | 36 | }, |
33 | top: "10%", | ||
34 | right: "5%", | ||
35 | }, | 37 | }, |
36 | grid: { | 38 | grid: { |
37 | left: "5%", | 39 | left: "5%", |
... | @@ -72,23 +74,46 @@ export default { | ... | @@ -72,23 +74,46 @@ export default { |
72 | name: "成功", | 74 | name: "成功", |
73 | type: "bar", | 75 | type: "bar", |
74 | stack: "总量", | 76 | stack: "总量", |
75 | barWidth: 10, | 77 | barWidth: 18, |
78 | label: { | ||
79 | show: true, | ||
80 | formatter: function (params) { | ||
81 | if (params.value > 0) { | ||
82 | return params.value; | ||
83 | } else { | ||
84 | return ''; | ||
85 | } | ||
86 | } | ||
87 | }, | ||
76 | itemStyle: { | 88 | itemStyle: { |
77 | normal: { | 89 | normal: { |
78 | // 这里设置圆角 | 90 | // 这里设置圆角 |
79 | color: "#16F4D2", | 91 | color: "#16F4D2", |
80 | } | 92 | }, |
81 | }, | 93 | }, |
82 | data: newData.barData, | 94 | data: newData.barData, |
95 | |||
83 | }, | 96 | }, |
84 | { | 97 | { |
85 | name: "失败", | 98 | name: "失败", |
86 | type: "bar", | 99 | type: "bar", |
87 | stack: "总量", | 100 | stack: "总量", |
101 | label: { | ||
102 | show: true, | ||
103 | formatter: function (params) { | ||
104 | if (params.value > 0) { | ||
105 | return params.value; | ||
106 | } else { | ||
107 | return ''; | ||
108 | } | ||
109 | } | ||
110 | |||
111 | |||
112 | }, | ||
88 | itemStyle: { | 113 | itemStyle: { |
89 | normal: { | 114 | normal: { |
90 | // 这里设置圆角 | 115 | // 这里设置圆角 |
91 | color: "#C99E68" | 116 | color: "#C99E68", |
92 | }, | 117 | }, |
93 | }, | 118 | }, |
94 | data: newData.lineData, | 119 | data: newData.lineData, | ... | ... |
1 | <template> | 1 | <template> |
2 | <!-- 柱状图 --> | 2 | <!--登记类型总量柱状图 --> |
3 | <Echart :options="options" id="bottomLeftChart" height="100%" width="100%" class="" ></Echart> | 3 | <Echart :options="options" id="bottomLeftChart" height="100%" width="100%" class="" ></Echart> |
4 | </template> | 4 | </template> |
5 | 5 | ||
... | @@ -27,7 +27,7 @@ export default { | ... | @@ -27,7 +27,7 @@ export default { |
27 | grid: { | 27 | grid: { |
28 | // 让图表占满容器 | 28 | // 让图表占满容器 |
29 | top: "20%", | 29 | top: "20%", |
30 | left: "12%", | 30 | left: "10%", |
31 | right: "5%", | 31 | right: "5%", |
32 | bottom: "16%", | 32 | bottom: "16%", |
33 | }, | 33 | }, | ... | ... |
1 | <template> | 1 | <template> |
2 | <Echart :options="options" id="centreLeft1Chart" :key="key" height="1.0417rem" width="80%"></Echart> | 2 | <Echart |
3 | :options="options" | ||
4 | id="centreLeft1Chart" | ||
5 | :key="key" | ||
6 | height="1.0417rem" | ||
7 | width="80%" | ||
8 | ></Echart> | ||
3 | </template> | 9 | </template> |
4 | <script> | 10 | <script> |
5 | import Echart from '@/common/echart' | 11 | import Echart from "@/common/echart"; |
6 | export default { | 12 | export default { |
7 | components: { | 13 | components: { |
8 | Echart, | 14 | Echart, |
9 | }, | 15 | }, |
10 | data() { | 16 | data() { |
11 | return { | 17 | return { |
12 | key:0 | 18 | key: 0, |
13 | } | 19 | }; |
14 | }, | 20 | }, |
15 | props: { | 21 | props: { |
16 | cdata: { | 22 | cdata: { |
17 | type: Object, | 23 | type: Object, |
18 | default: () => ({}) | 24 | default: () => ({}), |
19 | }, | 25 | }, |
20 | }, | 26 | }, |
21 | watch: { | 27 | watch: { |
22 | cdata: { | 28 | cdata: { |
23 | handler (newData) { | 29 | handler(newData) { |
24 | console.log("newData",newData); | 30 | let pieColors = ["#5470c6", "#91cc75", "#fac858", "#ee6666", "#73c0de"]; |
31 | let richColor = {}; | ||
32 | pieColors.forEach((item, idx) => { | ||
33 | richColor[`color${idx}`] = { | ||
34 | fontSize: 10, | ||
35 | color: item, | ||
36 | }; | ||
37 | }); | ||
38 | |||
39 | let chartData = [ | ||
40 | { value: 1048, name: "Search Engine" }, | ||
41 | { value: 735, name: "Direct" }, | ||
42 | { value: 580, name: "Email" }, | ||
43 | { value: 484, name: "Union Ads" }, | ||
44 | { value: 300, name: "Video Ads" }, | ||
45 | ]; | ||
25 | this.options = { | 46 | this.options = { |
26 | grid: { | ||
27 | right:"1%", | ||
28 | bottom:"4%" | ||
29 | }, | ||
30 | color: [ | 47 | color: [ |
31 | "#37a2da", | 48 | "#37a2da", |
32 | "#32c5e9", | 49 | "#32c5e9", |
33 | "#9fe6b8", | 50 | "#9fe6b8", |
34 | "#ffdb5c", | 51 | "#ffdb5c", |
35 | "#ff9f7f", | 52 | "#ff9f7f", |
53 | "#8378ea", | ||
36 | "#fb7293", | 54 | "#fb7293", |
37 | "#e7bcf3", | 55 | "#e7bcf3", |
38 | "#8378ea" | 56 | |
39 | ], | 57 | ], |
40 | tooltip: { | ||
41 | trigger: "item", | ||
42 | formatter: "{a} <br/>{b} : {c} ({d}%)" | ||
43 | }, | ||
44 | toolbox: { | ||
45 | show: true | ||
46 | }, | ||
47 | calculable: true, | ||
48 | series: [ | 58 | series: [ |
49 | { | 59 | { |
50 | name: "业务量", | 60 | name: "Access From", |
51 | type: "pie", | 61 | type: "pie", |
52 | radius: [20,100], | 62 | radius: ["54%", "70%"], |
53 | roseType: "area", | 63 | avoidLabelOverlap: true, |
54 | data: newData.seriesData | 64 | label: { |
65 | formatter: (params) => { | ||
66 | // console.log(params) | ||
67 | return `{color${params.dataIndex}|${params.name}(${params.value})}`; | ||
68 | }, | ||
69 | rich: richColor, | ||
70 | }, | ||
71 | labelLine: { | ||
72 | lineStyle: { | ||
73 | width: 3, | ||
74 | }, | ||
75 | }, | ||
76 | data: newData.seriesData, | ||
55 | } | 77 | } |
56 | ], | 78 | ], |
57 | 79 | }; | |
58 | } | 80 | this.key++; |
59 | this.key++ | ||
60 | }, | 81 | }, |
61 | immediate: true, | 82 | immediate: true, |
62 | deep: true | 83 | deep: true, |
63 | } | 84 | }, |
64 | } | 85 | }, |
65 | }; | 86 | }; |
66 | </script> | 87 | </script> |
67 | 88 | ||
68 | <style lang="scss" scoped> | 89 | <style lang="scss" scoped> |
69 | #centreLeft1Chart { | 90 | #centreLeft1Chart { |
70 | margin-bottom: .0521rem; | 91 | margin-bottom: 0.0521rem; |
71 | margin-left:60px; | 92 | margin-left: .3125rem; |
72 | } | 93 | } |
73 | </style> | 94 | </style> | ... | ... |
... | @@ -8,7 +8,7 @@ | ... | @@ -8,7 +8,7 @@ |
8 | import Chart from "./Chart"; | 8 | import Chart from "./Chart"; |
9 | import work from "@/api/work"; | 9 | import work from "@/api/work"; |
10 | export default { | 10 | export default { |
11 | data () { | 11 | data() { |
12 | return { | 12 | return { |
13 | cdata: { | 13 | cdata: { |
14 | seriesData: [], | 14 | seriesData: [], |
... | @@ -18,40 +18,44 @@ export default { | ... | @@ -18,40 +18,44 @@ export default { |
18 | components: { | 18 | components: { |
19 | Chart, | 19 | Chart, |
20 | }, | 20 | }, |
21 | mounted () { | 21 | mounted() { |
22 | this.getdjywltotal(); | 22 | this.getdjywltotal(); |
23 | window.addEventListener("resize", () => { | 23 | window.addEventListener("resize", () => { |
24 | this.cdata.seriesData = []; | ||
24 | this.getdjywltotal(); | 25 | this.getdjywltotal(); |
25 | }); | 26 | }); |
26 | }, | 27 | }, |
27 | methods: { | 28 | methods: { |
28 | // 获取登记业务量玫瑰图数据 | 29 | // 获取登记业务量玫瑰图数据 |
29 | async getdjywltotal () { | 30 | async getdjywltotal() { |
30 | this.cdata.seriesData=[] | 31 | if (this.cdata.seriesData.length == 0) { |
31 | try { | 32 | try { |
32 | let p = { | 33 | let p = { |
33 | DJLX: "", | 34 | DJLX: "", |
34 | QLLX: "", | 35 | QLLX: "", |
35 | XZQDM: "", | 36 | XZQDM: "", |
36 | }; | 37 | }; |
38 | this.cdata.seriesData = []; | ||
37 | let res = await work.getdjywltotal(p); | 39 | let res = await work.getdjywltotal(p); |
38 | // 遍历修改数组键,作为echars图表的参数 | 40 | if(this.cdata.seriesData.length == 0){ |
39 | res.result.map((item) => { | 41 | res.result.map((item) => { |
40 | return ( | 42 | return this.cdata.seriesData.push({ |
41 | this.cdata.seriesData.push({ "name": item.AREACODE, "value": item.ywtotal }) | 43 | name: item.AREACODE, |
44 | value: item.ywtotal, | ||
45 | }); | ||
42 | 46 | ||
43 | ) | ||
44 | }); | 47 | }); |
45 | } catch (error) { | ||
46 | console.log(error); | ||
47 | } | 48 | } |
49 | // 遍历修改数组键,作为echars图表的参数 | ||
48 | 50 | ||
49 | 51 | ||
52 | } catch (error) { | ||
53 | console.log(error); | ||
54 | } | ||
55 | } | ||
50 | }, | 56 | }, |
51 | }, | 57 | }, |
52 | }; | 58 | }; |
53 | </script> | 59 | </script> |
54 | 60 | ||
55 | <style lang="scss" scoped> | 61 | <style lang="scss" scoped></style> |
56 | |||
57 | </style> | ... | ... |
... | @@ -129,7 +129,6 @@ export default { | ... | @@ -129,7 +129,6 @@ export default { |
129 | if (!this.heightNumSetting) { | 129 | if (!this.heightNumSetting) { |
130 | let _this = this | 130 | let _this = this |
131 | if (this.heightNum) { | 131 | if (this.heightNum) { |
132 | console.log("this.heightNum``",this.heightNum); | ||
133 | _this.$nextTick(() => { | 132 | _this.$nextTick(() => { |
134 | 133 | ||
135 | window.addEventListener('resize', () => { | 134 | window.addEventListener('resize', () => { | ... | ... |
src/views/home/dataView/2wd.vue
deleted
100644 → 0
File mode changed
src/views/home/dataView/box.vue
deleted
100644 → 0
1 | <template> | ||
2 | <div | ||
3 | class="ScaleBox" | ||
4 | ref="ScaleBox" | ||
5 | :style="{ | ||
6 | width: width + 'px', | ||
7 | height: height + 'px', | ||
8 | }" | ||
9 | > | ||
10 | <slot></slot> | ||
11 | </div> | ||
12 | </template> | ||
13 | |||
14 | <script> | ||
15 | export default { | ||
16 | name: "ScaleBox", | ||
17 | props: {}, | ||
18 | data() { | ||
19 | return { | ||
20 | scale: 0, | ||
21 | width: 1920, | ||
22 | height: 1080, | ||
23 | }; | ||
24 | }, | ||
25 | mounted() { | ||
26 | this.setScale(); | ||
27 | window.addEventListener("resize", this.debounce(this.setScale)); | ||
28 | }, | ||
29 | methods: { | ||
30 | getScale() { | ||
31 | // 固定好16:9的宽高比,计算出最合适的缩放比 | ||
32 | const { width, height } = this; | ||
33 | const wh = window.innerHeight / height; | ||
34 | const ww = window.innerWidth / width; | ||
35 | console.log(ww < wh ? ww : wh); | ||
36 | return ww < wh ? ww : wh; | ||
37 | }, | ||
38 | setScale() { | ||
39 | // 获取到缩放比例,设置它 | ||
40 | this.scale = this.getScale(); | ||
41 | if (this.$refs.ScaleBox) { | ||
42 | this.$refs.ScaleBox.style.setProperty("--scale", this.scale); | ||
43 | } | ||
44 | }, | ||
45 | debounce(fn, delay) { | ||
46 | const delays = delay || 500; | ||
47 | let timer; | ||
48 | return function () { | ||
49 | const th = this; | ||
50 | const args = arguments; | ||
51 | if (timer) { | ||
52 | clearTimeout(timer); | ||
53 | } | ||
54 | timer = setTimeout(function () { | ||
55 | timer = null; | ||
56 | fn.apply(th, args); | ||
57 | }, delays); | ||
58 | }; | ||
59 | }, | ||
60 | }, | ||
61 | }; | ||
62 | </script> | ||
63 | |||
64 | <style lang="scss"> | ||
65 | #ScaleBox { | ||
66 | --scale: 1; | ||
67 | } | ||
68 | .ScaleBox { | ||
69 | position: absolute; | ||
70 | transform: scale(var(--scale)) translate(-50%, -50%); | ||
71 | display: flex; | ||
72 | flex-direction: column; | ||
73 | transform-origin: 0 0; | ||
74 | left: 50%; | ||
75 | top: 50%; | ||
76 | transition: 0.1s; | ||
77 | z-index: 999; | ||
78 | // background: rgba(255, 0, 0, 0.3); | ||
79 | } | ||
80 | </style> |
... | @@ -129,7 +129,7 @@ export default { | ... | @@ -129,7 +129,7 @@ export default { |
129 | position: relative; | 129 | position: relative; |
130 | text-align: center; | 130 | text-align: center; |
131 | width: 100%; | 131 | width: 100%; |
132 | height: 25%; | 132 | height: 22%; |
133 | } | 133 | } |
134 | .carda { | 134 | .carda { |
135 | background: url("~@/image/sthj.png") no-repeat; | 135 | background: url("~@/image/sthj.png") no-repeat; |
... | @@ -137,7 +137,7 @@ export default { | ... | @@ -137,7 +137,7 @@ export default { |
137 | position: relative; | 137 | position: relative; |
138 | text-align: center; | 138 | text-align: center; |
139 | width: 100%; | 139 | width: 100%; |
140 | height: 25%; | 140 | height: 22%; |
141 | } | 141 | } |
142 | 142 | ||
143 | // .card1 { | 143 | // .card1 { |
... | @@ -192,8 +192,8 @@ export default { | ... | @@ -192,8 +192,8 @@ export default { |
192 | font-weight: 700; | 192 | font-weight: 700; |
193 | width: .195rem; | 193 | width: .195rem; |
194 | height: .2475rem; | 194 | height: .2475rem; |
195 | font-size: .1863rem; | 195 | font-size: .2863rem; |
196 | font-size: .1867rem; | 196 | font-size: .2867rem; |
197 | } | 197 | } |
198 | } | 198 | } |
199 | 199 | ... | ... |
... | @@ -44,16 +44,12 @@ export default { | ... | @@ -44,16 +44,12 @@ export default { |
44 | async addhousetotal () { | 44 | async addhousetotal () { |
45 | try { | 45 | try { |
46 | let {result:res}= await work.addhousetotal(); | 46 | let {result:res}= await work.addhousetotal(); |
47 | console.log("resultssssssssssss",res); | ||
48 | res.map((item,index) => { | 47 | res.map((item,index) => { |
49 | console.log("item",item); | ||
50 | console.log("index",index); | ||
51 | return ( | 48 | return ( |
52 | this.config.data.push([index,item.fwyt,item.fwxz,item.mj]) | 49 | this.config.data.push([index,item.fwyt,item.fwxz,item.mj]) |
53 | ) | 50 | ) |
54 | 51 | ||
55 | }); | 52 | }); |
56 | console.log("this.config.data",this.config.data); | ||
57 | } catch (error) { | 53 | } catch (error) { |
58 | console.log("error",error); | 54 | console.log("error",error); |
59 | } | 55 | } |
... | @@ -115,6 +111,15 @@ export default { | ... | @@ -115,6 +111,15 @@ export default { |
115 | margin: 0 auto; | 111 | margin: 0 auto; |
116 | height: 1.1031rem; | 112 | height: 1.1031rem; |
117 | margin-top: .0521rem; | 113 | margin-top: .0521rem; |
114 | /deep/.header{ | ||
115 | font-size: .0738rem; | ||
116 | } | ||
117 | /deep/.rows{ | ||
118 | .ceil{ | ||
119 | font-size: .0738rem; | ||
120 | color: #6BC1FC | ||
121 | } | ||
122 | } | ||
118 | } | 123 | } |
119 | } | 124 | } |
120 | 125 | ... | ... |
... | @@ -7,7 +7,6 @@ | ... | @@ -7,7 +7,6 @@ |
7 | </template> | 7 | </template> |
8 | <script> | 8 | <script> |
9 | import "@/utils/flexible.js"; | 9 | import "@/utils/flexible.js"; |
10 | import ScaleBox from "./box.vue"; | ||
11 | import drawMixin from "@/utils/drawMixin"; | 10 | import drawMixin from "@/utils/drawMixin"; |
12 | import leftcard from "./leftcard"; | 11 | import leftcard from "./leftcard"; |
13 | import centercard from "./centercard"; | 12 | import centercard from "./centercard"; |
... | @@ -22,8 +21,7 @@ export default { | ... | @@ -22,8 +21,7 @@ export default { |
22 | components: { | 21 | components: { |
23 | leftcard, | 22 | leftcard, |
24 | centercard, | 23 | centercard, |
25 | rightcard, | 24 | rightcard |
26 | ScaleBox, | ||
27 | }, | 25 | }, |
28 | mounted () { | 26 | mounted () { |
29 | // this.timeFn(); | 27 | // this.timeFn(); | ... | ... |
... | @@ -343,7 +343,6 @@ export default { | ... | @@ -343,7 +343,6 @@ export default { |
343 | }, | 343 | }, |
344 | // 上移下移 | 344 | // 上移下移 |
345 | moveUpward (index, row) { | 345 | moveUpward (index, row) { |
346 | console.log("row上移", row); | ||
347 | 346 | ||
348 | realMove(row.dictid, "UP", this.tableData); | 347 | realMove(row.dictid, "UP", this.tableData); |
349 | let id = findParents(this.tableData, row.dictid); | 348 | let id = findParents(this.tableData, row.dictid); |
... | @@ -351,7 +350,6 @@ export default { | ... | @@ -351,7 +350,6 @@ export default { |
351 | this.key++; | 350 | this.key++; |
352 | }, | 351 | }, |
353 | moveDown (index, row) { | 352 | moveDown (index, row) { |
354 | console.log("row下移", row); | ||
355 | realMove(row.dictid, "DOWN", this.tableData); | 353 | realMove(row.dictid, "DOWN", this.tableData); |
356 | let id = findParents(this.tableData, row.dictid); | 354 | let id = findParents(this.tableData, row.dictid); |
357 | this.keyList = id; | 355 | this.keyList = id; | ... | ... |
... | @@ -188,7 +188,8 @@ export default { | ... | @@ -188,7 +188,8 @@ export default { |
188 | // } | 188 | // } |
189 | // }) | 189 | // }) |
190 | // }, | 190 | // }, |
191 | // updateInfo() { | 191 | // 更新信息 |
192 | updateInfo() { | ||
192 | // this.$refs.form.validate((valid) => { | 193 | // this.$refs.form.validate((valid) => { |
193 | // if (valid) { | 194 | // if (valid) { |
194 | // putAction(`${api.users}/${this.form.id}`, this.form).then((res) => { | 195 | // putAction(`${api.users}/${this.form.id}`, this.form).then((res) => { |
... | @@ -201,14 +202,14 @@ export default { | ... | @@ -201,14 +202,14 @@ export default { |
201 | // }) | 202 | // }) |
202 | // } | 203 | // } |
203 | // }) | 204 | // }) |
204 | // } | 205 | } |
205 | } | 206 | } |
206 | } | 207 | } |
207 | </script> | 208 | </script> |
208 | 209 | ||
209 | <style scoped lang="scss"> | 210 | <style scoped lang="scss"> |
210 | .user-info { | 211 | .user-info { |
211 | margin: 36px 200px; | 212 | margin: .1875rem 1.0417rem; |
212 | background: #ffffff; | 213 | background: #ffffff; |
213 | max-height: 90%; | 214 | max-height: 90%; |
214 | overflow-y: auto; | 215 | overflow-y: auto; | ... | ... |
1 | <template> | 1 | <template> |
2 | <div class="information from-clues"> | 2 | <div class="information from-clues"> |
3 | <div class="from-clues-header"> | 3 | <div class="from-clues-header"> |
4 | <el-form ref="ruleForm" :model="form" label-width="100px"> | 4 | <el-form ref="ruleForm" label-width="100px"> |
5 | <el-form-item> | 5 | <el-form-item> |
6 | <Breadcrumb /> | 6 | <Breadcrumb /> |
7 | </el-form-item> | 7 | </el-form-item> |
8 | <el-row class="mb-5"> | 8 | <el-row class="mb-5"> |
9 | <el-col :span="3" class="btnColRight"> | 9 | <el-col :span="3" class="btnColRight"> |
10 | <btn nativeType="cx" @click="information()">基本信息</btn> | 10 | <btn nativeType="cx" @click="information">基本信息</btn> |
11 | <btn nativeType="cx" @click="password()">修改秘密</btn> | 11 | <btn nativeType="cx" @click="password">修改密码</btn> |
12 | </el-col> | 12 | </el-col> |
13 | </el-row> | 13 | </el-row> |
14 | </el-form> | 14 | </el-form> |
15 | </div> | 15 | </div> |
16 | <div class="from-clues-content"> | 16 | <div class="from-clues-content"> |
17 | <div class="contentbox"> | 17 | <div class="contentbox"> |
18 | <base-set :user-info="userData" v-show="isshow" /> | 18 | <base-set v-show="isshow" /> |
19 | <password-edit :user-info="userData" v-show="!isshow" /> | 19 | <password-edit v-show="!isshow" /> |
20 | </div> | 20 | </div> |
21 | </div> | 21 | </div> |
22 | <edit-dialog ref="dialogForm" /> | ||
23 | <authorizationdiglog ref="rolesForm" /> | ||
24 | </div> | 22 | </div> |
25 | </template> | 23 | </template> |
26 | <script> | 24 | <script> |
25 | import "@/utils/flexible.js"; | ||
27 | import BaseSet from "./base-set.vue"; | 26 | import BaseSet from "./base-set.vue"; |
28 | import PasswordEdit from "./password-edit.vue"; | 27 | import PasswordEdit from "./password-edit.vue"; |
29 | export default { | 28 | export default { |
... | @@ -53,6 +52,7 @@ export default { | ... | @@ -53,6 +52,7 @@ export default { |
53 | </script> | 52 | </script> |
54 | 53 | ||
55 | <style scoped lang="scss"> | 54 | <style scoped lang="scss"> |
55 | @import "~@/styles/mixin.scss"; | ||
56 | @import "~@/styles/public.scss"; | 56 | @import "~@/styles/public.scss"; |
57 | .information{ | 57 | .information{ |
58 | .btnColRight{ | 58 | .btnColRight{ |
... | @@ -76,7 +76,7 @@ export default { | ... | @@ -76,7 +76,7 @@ export default { |
76 | } | 76 | } |
77 | } | 77 | } |
78 | .contentbox{ | 78 | .contentbox{ |
79 | height: 650px; | 79 | height: 3.0854rem; |
80 | } | 80 | } |
81 | } | 81 | } |
82 | 82 | ... | ... |
... | @@ -79,16 +79,17 @@ export default { | ... | @@ -79,16 +79,17 @@ export default { |
79 | // } | 79 | // } |
80 | }, | 80 | }, |
81 | mounted() {}, | 81 | mounted() {}, |
82 | // methods: { | 82 | methods: { |
83 | // validatorConfirmPassword(rule, value, callback) { | 83 | validatorConfirmPassword(rule, value, callback) { |
84 | // const { newPassword } = this.form | 84 | const { newPassword } = this.form |
85 | // if (value !== newPassword) { | 85 | if (value !== newPassword) { |
86 | // callback('两次输入密码不一致') | 86 | callback('两次输入密码不一致') |
87 | // } else { | 87 | } else { |
88 | // callback() | 88 | callback() |
89 | // } | 89 | } |
90 | // }, | 90 | }, |
91 | // updatePassword() { | 91 | // 确认修改 |
92 | updatePassword() { | ||
92 | // this.$refs.form.validate((valid) => { | 93 | // this.$refs.form.validate((valid) => { |
93 | // if (valid) { | 94 | // if (valid) { |
94 | // const params = Object.assign({}, this.form, { id: this.userId }) | 95 | // const params = Object.assign({}, this.form, { id: this.userId }) |
... | @@ -101,8 +102,8 @@ export default { | ... | @@ -101,8 +102,8 @@ export default { |
101 | // }) | 102 | // }) |
102 | // } | 103 | // } |
103 | // }) | 104 | // }) |
104 | // } | 105 | } |
105 | // } | 106 | } |
106 | } | 107 | } |
107 | </script> | 108 | </script> |
108 | 109 | ... | ... |
... | @@ -24,7 +24,6 @@ | ... | @@ -24,7 +24,6 @@ |
24 | @p-current-change="handleCurrentChange" | 24 | @p-current-change="handleCurrentChange" |
25 | :column="tableData.columns" | 25 | :column="tableData.columns" |
26 | :data="tableData.data" | 26 | :data="tableData.data" |
27 | :key="key" | ||
28 | :expand-row-keys="keyList" row-key="dictid" | 27 | :expand-row-keys="keyList" row-key="dictid" |
29 | > | 28 | > |
30 | </lb-table> | 29 | </lb-table> | ... | ... |
-
Please register or sign in to post a comment