浏览代码

Merge branch 'master' of http://114.244.114.158:8802/siwei/real3d-portalsite

maxiaoxiao 10 月之前
父节点
当前提交
d9f09cf61a

+ 39 - 14
src/views/cockpit/bjxm.vue

@@ -85,12 +85,19 @@ export default {
       this.sdata = res.data;
 
       // 私宅报建汇总
+      let dateString_beginTime = store.state.cockpit_date[0];
+      let formattedDate = dateString_beginTime.slice(0, 4) + '-' + dateString_beginTime.slice(4, 6) + '-' + dateString_beginTime.slice(6);
+
+      let dateString_endTime = store.state.cockpit_date[1];
+      let formattedDate_endTime = dateString_endTime.slice(0, 4) + '-' + dateString_endTime.slice(4, 6) + '-' + dateString_endTime.slice(6);
+
       let obj_szbj = {
         jscType: 'jsc_bjxm_szbj_hz',
-        beginTime: params ? params.beginTime : store.state.cockpit_date[0],
-        endTime: params ? params.endTime : store.state.cockpit_date[1],
+        beginTime: formattedDate,
+        endTime: formattedDate_endTime,
         id: params ? params.id : '46020'
       };
+
       let res_szbj = await QueryOne(obj_szbj);
       this.sdata_szbj = res_szbj.data;
     },
@@ -122,12 +129,21 @@ export default {
 
       }
       // 私宅报建
+
+      let dateString_beginTime = store.state.cockpit_date[0];
+      let formattedDate = dateString_beginTime.slice(0, 4) + '-' + dateString_beginTime.slice(4, 6) + '-' + dateString_beginTime.slice(6);
+
+      let dateString_endTime = store.state.cockpit_date[1];
+      let formattedDate_endTime = dateString_endTime.slice(0, 4) + '-' + dateString_endTime.slice(4, 6) + '-' + dateString_endTime.slice(6);
+
       let obj_szbj = {
         jscType: 'jsc_bjxm_szbj_yffl',
-        beginTime: params ? params.beginTime : store.state.cockpit_date[0],
-        endTime: params ? params.endTime : store.state.cockpit_date[1],
+        beginTime: formattedDate,
+        endTime: formattedDate_endTime,
         id: params ? params.id : '4602'
       };
+
+
       let data_szbj = await QueryList(obj_szbj);
       let xAxis_szbj = [];
       let bat_data_szbj = [];
@@ -217,15 +233,23 @@ export default {
         //你的代码
         backgroundColor: 'rgba(17, 42, 62, 0)',//"#012366",
         tooltip: {
-          show: false,
-          trigger: 'axis',
-          axisPointer: {
-            type: 'shadow'
-          },
-          // formatter: function (params) {
-          //   const item = params[1]
-          //   return item.name + "\n" + item.value;
-          // }
+          backgroundColor: 'RGBA(20, 106, 178, 0.4)',
+          trigger: "axis",
+          textStyle: { fontSize: '100%' },
+          formatter: params => {
+            let rander = params.map(item =>
+              `
+                        
+                    <div style='
+                        border:none;
+                        border-radius:3px;
+                        color:#FFF;
+                        font-size:12px
+                        '>
+                            ${item.seriesName}: ${item.value}
+                    </div>`).join('')
+            return rander
+          }
         },
         grid: {
           left: '1%',
@@ -411,6 +435,7 @@ export default {
           //   data: bat_data
           // },
           {
+            name: "项目个数",
             type: 'line',
             smooth: true,
             itemStyle: {
@@ -429,7 +454,7 @@ export default {
       store.setToolBarShow(false);
       store.setXzqh_flag(false);
       store.setCockpit_vector({
-        word:this.left_value == 'csbj' ? '事项内容' : '报建项目名称',
+        word: this.left_value == 'csbj' ? '事项内容' : '报建项目名称',
         title: this.left_value == 'csbj' ? '城市报建完成项目' : '私宅报建完成项目',
         tableData: [],
         tablejscType: `jsc_bjxm_${this.left_value}_zbmx`,

+ 79 - 19
src/views/cockpit/common/ThreeStackedBarAndLine.vue

@@ -23,30 +23,64 @@ export default {
             let y1Data = [110, 90, 120, 70, 60]
             let option = {
                 backgroundColor: 'rgba(0, 0, 0, 0)',
+                // tooltip: {
+                //     trigger: 'axis',
+                //     extraCssText: 'box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);',
+                //     backgroundColor: '#3A4667', // 背景
+                //     borderColor: '#3A4667',
+                //     textStyle: {
+                //         color: '#fff'
+                //     },
+                // },
                 tooltip: {
-                    trigger: 'axis',
-                    extraCssText: 'box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);',
-                    backgroundColor: '#3A4667', // 背景
-                    borderColor: '#3A4667',
-                    textStyle: {
-                        color: '#fff'
-                    },
+                    backgroundColor: 'RGBA(20, 106, 178, 0.4)',
+                    trigger: "axis",
+                    textStyle: { fontSize: '100%' },
+                    formatter: params => {
+                        let rander = params.map(item =>
+                            `
+                        
+                    <div style='
+                        border:none;
+                        border-radius:3px;
+                        color:#FFF;
+                        font-size:12px
+                        '>
+                            ${item.seriesName}: ${item.value}
+                    </div>`).join('')
+                        return rander
+                    }
                 },
                 grid: {
-                    top: '10%',
+                    top: '20%',
                     left: '3%',
                     right: '3%',
                     bottom: '5%',
                     containLabel: true,
                 },
                 color: ['#efc943', '#4ee1ac', '#186bb8'],
+
                 legend: {
-                    top: '1',
-                    data: ['意向', '进行中', '已完成'],
+                    data: ['临时用地面积', '正常使用', '剩余1个月', '已到期',],
+
+                    top: '1%',
+                    // textStyle: {
+                    //     color: "#666666"
+                    // },
                     textStyle: {
-                        fontSize: 12, // 字体大小
-                        color: '#B3CFFF' // 字体颜色
-                    }
+                        fontSize: 12,
+                        color: '#fff',
+                        padding: [0, 0, 0, 0],
+                        rich: {
+                            a: {
+                                verticalAlign: 'middle',
+                            },
+                        },
+                    },
+                    itemWidth: 15,
+                    itemHeight: 10,
+
+                    itemGap: 10
                 },
                 xAxis: [{
                     type: 'category',
@@ -96,11 +130,36 @@ export default {
                             color: 'rgba(239, 247, 253, .1)'
                         }
                     },
-                },],
+                }, {
+                    name: '',
+                    nameTextStyle: {
+                        color: "#fff",
+                        fontSize: 12,
+                        padding: [0, 0, 4, 0], //name文字位置 对应 上右下左
+                    },
+                    axisLabel: {
+                        interval: 0,
+                        show: true,
+                        fontSize: 10,
+                        color: '#fff',
+                    },
+                    axisLine: {
+                        show: false,
+                    },
+                    axisTick: {
+                        show: false,
+                    },
+                    splitLine: {
+                        show: false,
+                        lineStyle: {
+                            color: 'rgba(239, 247, 253, .1)'
+                        }
+                    },
+                }],
                 series: [
                     {
-                        name: '项目数量',
 
+                        name: "正常使用",
                         type: 'line',
                         smooth: true,
                         itemStyle: {
@@ -108,9 +167,10 @@ export default {
                                 color: '#FFCC64'  // 折线的颜色
                             }
                         },
+                        yAxisIndex: 1, // 指定使用第二个Y轴  
                         data: y1Data,
                     }, {
-                        name: '意向',
+                        name: '剩余1个月',
                         type: 'bar',
                         stack: '渠道1',
                         barWidth: 14,
@@ -118,7 +178,7 @@ export default {
                         data: [12, 12, 12, 12, 1, 2],
                     },
                     {
-                        name: '进行中',
+                        name: '已到期',
                         type: 'bar',
                         stack: '渠道1',
                         barWidth: 14,
@@ -126,7 +186,7 @@ export default {
                         data: [24, 12, 12, 0, 1, 2],
                     },
                     {
-                        name: '已完成',
+                        name: '临时用地面积',
                         barWidth: 14,
 
                         type: 'bar',
@@ -166,7 +226,7 @@ export default {
 #ThreeStackedBarAndLine {
     left: 0rem;
     top: 0.1rem;
-    width: 22rem;
+    width: 21rem;
     height: 12rem;
 }
 </style>

+ 16 - 4
src/views/cockpit/common/VectorSpace/BoxCommonVector.vue

@@ -101,7 +101,7 @@ export default {
         draw_vector_tdgy_gy_jd(data) {
             // tdsy.remove();
             data.forEach((res) => {
-                res.type ='图斑上图'
+                res.type = '图斑上图'
                 if (res.geom) {
                     res.geom.coordinates.forEach((res_coordinates) => {
                         let arrayt = [];
@@ -123,8 +123,7 @@ export default {
             store.setViewerFlagb(true);
             tdsy.remove();
             store.state.vectorData = [];
-            // store.setToolBarAction(9);
-
+            store.hideToolBar();
         },
         info() { },
         switch_show(flag) {
@@ -362,7 +361,9 @@ export default {
 
         },
         async init_vector(params) {
+
             const that = this;
+
             let obj = {
                 jscType: store.state.cockpit_vector.tablejscType,
                 beginTime: store.state.cockpit_date[0],
@@ -385,6 +386,17 @@ export default {
                 obj.beginTime = undefined
                 obj.endTime = undefined
             }
+            if (this.title == '私宅报建完成项目') {
+
+                let dateString_beginTime = store.state.cockpit_date[0];
+                let formattedDate = dateString_beginTime.slice(0, 4) + '-' + dateString_beginTime.slice(4, 6) + '-' + dateString_beginTime.slice(6);
+
+                let dateString_endTime = store.state.cockpit_date[1];
+                let formattedDate_endTime = dateString_endTime.slice(0, 4) + '-' + dateString_endTime.slice(4, 6) + '-' + dateString_endTime.slice(6);
+
+                obj.beginTime = formattedDate
+                obj.endTime = formattedDate_endTime
+            }
             let data = await QueryList(obj);
             data.data.map((res) => {
                 if (res.geom) {
@@ -413,7 +425,7 @@ export default {
                 this.tableData = newVal.tableData
                 this.init_vector()
 
-            } else if(this.title){
+            } else if (this.title) {
                 this.init_vector()
             }
             if (newVal.goitem) {

+ 272 - 0
src/views/cockpit/common/XZQHPieChart.vue

@@ -0,0 +1,272 @@
+<template>
+    <div id="XZQHPieChart" ref="XZQHPieChart">
+
+    </div>
+</template>
+
+<script>
+//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
+
+export default {
+    components: {},
+    data() {
+        return {};
+    },
+    //监听属性 类似于data概念
+    computed: {},
+    //监控data中的数据变化
+    watch: {},
+    //方法集合
+    methods: {
+        init_echart() {
+            var myChart = echarts.init(this.$refs.XZQHPieChart);
+            var scale = 1;
+            function _pie2() {
+                let dataArr = [];
+                for (var i = 0; i < 4; i++) {
+                    if (i % 2 === 0) {
+                        dataArr.push({
+                            name: (i + 1).toString(),
+                            value: 25,
+                            itemStyle: {
+                                normal: {
+                                    // color: 'rgba(88,142,197,0.5)',
+                                },
+                            },
+                        });
+                    } else {
+                        dataArr.push({
+                            name: (i + 1).toString(),
+                            value: 20,
+                            itemStyle: {
+                                normal: {
+                                    color: 'rgba(0,0,0,0)',
+                                },
+                            },
+                        });
+                    }
+                }
+                return dataArr;
+            }
+            var echartData = [{
+                value: 2154,
+                name: '正常使用',
+                //  itemStyle: {
+                //                 normal: {//颜色渐变
+                //                     color: new echarts.graphic.LinearGradient(
+                //                         0, 0, 0, 1,
+                //                         [
+                //                             {offset: 0, color: '#E58B44'},
+                //                             {offset: 1, color: 'transparent'}
+                //                         ]
+                //                     )
+                //                 }
+                //             }
+
+            }, {
+                value: 3854,
+                name: '剩余1个月',
+                //  itemStyle: {
+                //                 normal: {//颜色渐变
+                //                     color: new echarts.graphic.LinearGradient(
+                //                         0, 0, 0, 1,
+                //                         [
+                //                             {offset: 0, color: '#D95CFF'},
+                //                             {offset: 1, color: 'transparent'}
+                //                         ]
+                //                     )
+                //                 }
+                //             }
+
+            }, {
+                value: 3515,
+                name: '已到期',
+                //  itemStyle: {
+                //                 normal: {//颜色渐变
+                //                     color: new echarts.graphic.LinearGradient(
+                //                         0, 0, 0, 1,
+                //                         [
+                //                             {offset: 0, color: '#06A3F4'},
+                //                             {offset: 1, color: 'transparent'}
+                //                         ]
+                //                     )
+                //                 }
+                //             }
+
+            }, ]
+            var total_datas = 0;
+            for (var i = 0; i < echartData.length; i++) {
+                total_datas += echartData[i].value
+            }
+
+            var rich = {
+                yellow: {
+                    color: "#ffc72b",
+                    fontSize: 12 * scale,
+                    // padding: [21, 0],
+                    align: 'center'
+                },
+                total: {
+                    color: "#ffc72b",
+                    fontSize: 40 * scale,
+                    align: 'center'
+                },
+
+                blue: {
+                    color: '#49dff0',
+                    fontSize: 10 * scale,
+                    align: 'center'
+                },
+                hr: {
+                    borderColor: '#0b5263',
+                    width: '100%',
+                    borderWidth: 1,
+                    height: 0,
+                }
+            },
+                option = {
+                    backgroundColor: 'rgba(0,0,0,0)',
+                    title: {
+                        text: '',
+                        subtext: 0,
+                        textStyle: {
+                            color: '#f2f2f2',
+                            fontSize: 40,
+                            align: 'center'
+                        },
+                        subtextStyle: {
+                            fontSize: 30,
+                            color: ['#ff9d19']
+                        },
+                        x: 'center',
+                        y: 'center',
+                    },
+                    legend: {
+                        show: false,
+                        // orient 设置布局方式,默认水平布局,可选值:'horizontal'(水平) | 'vertical'(垂直)
+                        orient: 'vertical',
+                        // x 设置水平安放位置,默认全图居中,可选值:'center' | 'left' | 'right' | {number}(x坐标,单位px)
+                        x: 'left',
+                        // y 设置垂直安放位置,默认全图顶端,可选值:'top' | 'bottom' | 'center' | {number}(y坐标,单位px)
+                        y: 'center',
+                        itemWidth: 24,   // 设置图例图形的宽
+                        itemHeight: 18,  // 设置图例图形的高
+                        textStyle: {
+                            color: '#666'  // 图例文字颜色
+                        },
+                        // itemGap设置各个item之间的间隔,单位px,默认为10,横向布局时为水平间隔,纵向布局时为纵向间隔
+                        itemGap: 30,
+                        data: ['居民用地', '公共管理用地', '商服用地', '工业工业', '交通运输用地', '商业用地']
+                    },
+
+                    series: [{
+                        name: '总考生数量',
+                        type: 'pie',
+                        itemStyle: {
+                            normal: {
+                                borderWidth: 1,
+                                borderColor: "#5ecef09a"
+                            }
+                        },
+                        radius: ['38%', '50%'],
+                        hoverAnimation: false,
+                        color: ['#c487ee', '#deb140', '#49dff0', '#034079', '#6f81da', '#00ffb4'],
+                        label: {
+                            normal: {
+                                formatter: function (params, ticket, callback) {
+                                    var total = 0; //考生总数量
+                                    var percent = 0; //考生占比
+                                    echartData.forEach(function (value, index, array) {
+                                        total += value.value;
+                                    });
+                                    percent = ((params.value / total) * 100).toFixed(1);
+                                    return '{yellow|' + params.name + '}\n{blue|' + percent + '%}';
+                                },
+                                rich: rich
+                            },
+                        },
+                        // labelLine: {
+                        //     normal: {
+                        //         length: 55 * scale,
+                        //         length2: 10,
+                        //         lineStyle: {
+                        //             color: '#0b5263'
+                        //         }
+                        //     }
+                        // },
+                        data: echartData
+                    },
+                    {
+                        type: 'pie',
+                        zlevel: 2,
+                        silent: true,
+                        center: ['50%', '50%'],
+                        radius: ['58%', '55%'],
+                        startAngle: 50,
+                        hoverAnimation: false,
+                        color: [{
+                            type: 'linear',
+                            x: 0,
+                            y: 0,
+                            x2: 1,
+                            y2: 1,
+                            colorStops: [{
+                                offset: 0,
+                                color: 'rgba(234, 40, 125, 1)'
+                            }, {
+                                offset: 1,
+                                color: 'rgba(234, 40, 125, 0.01)'
+                            }],
+                            global: false
+                        }],
+                        label: {
+                            normal: {
+                                show: false,
+                            },
+                        },
+                        labelLine: {
+                            normal: {
+                                show: false,
+                            },
+                        },
+                        data: _pie2(),
+                    },
+                    {
+                        type: 'pie',
+                        radius: ['35%', '36%'],
+                        data: [100],
+                        label: {
+                            show: false
+                        },
+                        color: '#121F22',
+                    }
+                    ]
+                };
+            myChart.setOption(option);
+
+        }
+    },
+    beforeCreate() { }, //生命周期 - 创建之前
+    created() { }, //生命周期 - 创建完成(可以访问当前this实例)
+    beforeMount() { }, //生命周期 - 挂载之前
+    mounted() {
+        const that = this;
+        this.$nextTick((res) => {
+            this.init_echart();
+
+        })
+    }, //生命周期 - 挂在完成
+    beforeUpdate() { }, //生命周期 - 更新之前
+    updated() { }, //生命周期 - 更新之后
+    beforeDestroy() { }, //生命周期 - 销毁之前
+    destroy() { },//生命周期 - 销毁完成
+    activated() { }, //若组件实例是 <KeepAlive> 缓存树的一部分,当组件被插入到 DOM 中时调用。
+    deactivated() { } //若组件实例是 <KeepAlive> 缓存树的一部分,当组件从 DOM 中被移除时调用。
+};
+</script>
+<style  scoped>
+#XZQHPieChart {
+    width: 20vw;
+    height: 11rem;
+}
+</style>

+ 0 - 1
src/views/cockpit/tdsy.vue

@@ -1137,7 +1137,6 @@ export default {
       //     columns:["项目名称","土地用途","出让面积(公顷)","土地使用权","土地座落","批准文号","批准机关"],
       //   })
       // }
-      console.log('this.vector_data: ', this.vector_data);
 
       store.setCockpit_vector({
         title: "土地供应完成项目",

+ 19 - 8
src/views/cockpit/wpjg.vue

@@ -317,11 +317,23 @@ export default {
           right: legendType === 'center' ? '5%' : '25%',
         },
         tooltip: {
-          show: false,
-          trigger: 'axis',
-          axisPointer: {
-            type: 'shadow',
-          },
+          backgroundColor: 'RGBA(20, 106, 178, 0.4)',
+          trigger: "axis",
+          textStyle: { fontSize: '100%' },
+          formatter: params => {
+            let rander = params.map(item =>
+              `
+                        
+                    <div style='
+                        border:none;
+                        border-radius:3px;
+                        color:#FFF;
+                        font-size:12px
+                        '>
+                            ${item.seriesName}: ${item.value}
+                    </div>`).join('')
+            return rander
+          }
         },
         legend: {
           orient: legendType === 'center' ? '' : 'vertical',
@@ -329,10 +341,9 @@ export default {
           right: legendType === 'center' ? 'center' : '2%',
           // data: ['监测图斑', '占用耕地', '占用永久基本农田', '违法占地'],
 
-          itemWidth: 12,
-          itemHeight: 12,
+          itemWidth: 15,
+          itemHeight: 10,
           itemGap: 20,
-          icon: "rect",
           textStyle: {
             fontSize: 12,
             color: '#fff',

+ 5 - 3
src/views/cockpit/ydjc.vue

@@ -20,7 +20,8 @@
                 </div>
 
             </div>
-            <ThreeStackedBarAndLine class="qxjc_echart"></ThreeStackedBarAndLine>
+            <!-- <ThreeStackedBarAndLine class="qxjc_echart"></ThreeStackedBarAndLine> -->
+            <XZQHPieChart></XZQHPieChart>
 
         </div>
         <!-- 临时用地(复垦监测) -->
@@ -44,7 +45,6 @@
                 </div>
             </div>
             <ThreeStackedBarAndLine class="qxjc_echart"></ThreeStackedBarAndLine>
-
         </div>
     </div>
 </template>
@@ -53,9 +53,11 @@
 //这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
 import { QueryOne, QueryList } from "../../api/cockpitNew";
 import ThreeStackedBarAndLine from './common/ThreeStackedBarAndLine.vue';
+import XZQHPieChart from './common/XZQHPieChart.vue';
+
 import Title from './common/Title.vue';
 export default {
-    components: { ThreeStackedBarAndLine, Title },
+    components: { ThreeStackedBarAndLine, Title, XZQHPieChart },
     data() {
         return {
             options: [

+ 2 - 2
src/views/siteselection/components/fzxz.vue

@@ -168,8 +168,8 @@ export default {
         jsdw: "建设单位",
         // xmlx: "",
         ydlx: ["07", "0701"], //默认为城镇住宅用地
-        ydmjbegin: "", //用地面积开始
-        ydmjend: "", //用地面积结束
+        ydmjbegin: "30", //用地面积开始
+        ydmjend: "50", //用地面积结束
         sjy: "", //数据源
         useMultiple: false, //是否允许多个分散地块
         useLandType: false, //是否与控规用地性质一致