修复地图

operationSupport/src/views/patrolManagement/popups/addPatrol.vue

@@ -1,24 +1,10 @@
 <template>
     <div class="main">
-        <div class="blockName">
-            {{ !isAdd ? '编辑' : '新增' }}巡更路线（
-            <span class="show-required-icon-star"></span>为必填项）
-        </div>
-        <el-form
-            :model="ruleForm"
-            :rules="rules"
-            ref="ruleForm"
-            label-width="120px"
-            class="formContent"
-        >
+        <div class="blockName">{{ !isAdd ? '编辑' : '新增' }}巡更路线（ <span class="show-required-icon-star"></span>为必填项）</div>
+        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px" class="formContent">
             <div class="formContent-item">
                 <el-form-item label="所属社区" prop="communityId">
-                    <el-select
-                        class="width100"
-                        v-model="ruleForm.communityId"
-                        placeholder="所属社区"
-                        clearable
-                    >
+                    <el-select class="width100" v-model="ruleForm.communityId" placeholder="所属社区" clearable>
                         <el-option
                             v-for="(item, index) in $parent.communityArr"
                             :key="index"
@@ -35,7 +21,7 @@
                         v-model="ruleForm.routePointRelationDtos"
                         ref="transferTude"
                         filterable
-                        style="margin-bottom: 20px;"
+                        style="margin-bottom: 20px"
                         :props="{
                             key: 'id',
                             label: 'pointName',
@@ -44,8 +30,17 @@
                         }"
                         :titles="['待选列表', '已选列表']"
                         @change="handleChange"
+                        target-order="push"
                         :data="patrolArr"
-                    ></el-transfer>
+                    >
+                        <div slot-scope="{ option }" class="transferTudeClass">
+                            <span>{{ option.pointName }}</span>
+                            <div>
+                                <span class="zoniot_font zoniot-icon-shang" @click="optionUp(0, option)"></span>
+                                <span class="zoniot_font zoniot-icon-xia" @click="optionUp(1, option)"></span>
+                            </div>
+                        </div>
+                    </el-transfer>
                     <map-value :point="targetData"></map-value>
                 </el-form-item>
             </div>
@@ -64,17 +59,17 @@
                     ></el-date-picker>
                 </el-form-item>
                 <el-form-item label="巡更时间" prop="timePeriod">
-                    <div class="timeList" v-for="(item,index) in timePeriod" :key="index">
+                    <div class="timeList" v-for="(item, index) in timePeriod" :key="index">
                         <el-time-select
                             class="width50"
                             placeholder="开始时间"
                             v-model="item.startTime"
                             :picker-options="{
-                            start: '00:00',
-                            step: '00:15',
-                            end: '23:30'
+                                start: '00:00',
+                                step: '00:15',
+                                end: '23:30'
                             }"
-                            @change="timeChange(item,'startTime')"
+                            @change="timeChange(item, 'startTime')"
                         ></el-time-select>
                         <span>至</span>
                         <el-time-select
@@ -82,21 +77,17 @@
                             v-model="item.endTime"
                             class="width50"
                             :picker-options="{
-                            start: '00:00',
-                            step: '00:15',
-                            end: '23:30',
-                            minTime: item.startTime
+                                start: '00:00',
+                                step: '00:15',
+                                end: '23:30',
+                                minTime: item.startTime
                             }"
-                            @change="timeChange(item,'endTime')"
+                            @change="timeChange(item, 'endTime')"
                         ></el-time-select>
-                        <div class="sunm" @click="addTime(index,1)">
+                        <div class="sunm" @click="addTime(index, 1)">
                             <i class="zoniot_font zoniot-icon-tianjia1"></i>
                         </div>
-                        <div
-                            class="sunm"
-                            @click="addTime(index,-1)"
-                            v-if="timePeriod.length>1 && index!=0"
-                        >
+                        <div class="sunm" @click="addTime(index, -1)" v-if="timePeriod.length > 1 && index != 0">
                             <i class="zoniot_font zoniot-icon-shanjian"></i>
                         </div>
                     </div>
@@ -118,12 +109,8 @@
                     </el-checkbox-group>
                     <div v-else class="periodValueInput">
                         每隔
-                        <el-input-number
-                            v-model="ruleForm.periodValue"
-                            controls-position="right"
-                            :min="0"
-                            :max="30"
-                        ></el-input-number>天进行(输入0-30的数字，0代表每天都要进行任务)
+                        <el-input-number v-model="ruleForm.periodValue" controls-position="right" :min="0" :max="30"></el-input-number
+                        >天进行(输入0-30的数字，0代表每天都要进行任务)
                     </div>
                 </el-form-item>
                 <el-form-item label="定位距离(m)">
@@ -133,12 +120,7 @@
                     ></el-input>
                 </el-form-item>
                 <el-form-item label="拍照/视频要求">
-                    <el-select
-                        class="width100"
-                        v-model="ruleForm.cameraSettings"
-                        placeholder="请选择拍照/视频要求"
-                        clearable
-                    >
+                    <el-select class="width100" v-model="ruleForm.cameraSettings" placeholder="请选择拍照/视频要求" clearable>
                         <el-option label="是" :value="1"></el-option>
                         <el-option label="否" :value="0"></el-option>
                     </el-select>
@@ -212,11 +194,11 @@ export default {
     methods: {
         //保存
         addEdit() {
-            this.$refs.ruleForm.validate(valid => {
+            this.$refs.ruleForm.validate((valid) => {
                 if (valid) {
                     let url = '/sc-community/patrolRoute/add';
                     this.ruleForm;
-                    let dotArr = arr => {
+                    let dotArr = (arr) => {
                         let dotObj = [];
                         arr.map((item, index) => {
                             dotObj.push({
@@ -266,6 +248,8 @@ export default {
             this.$emit('initPage');
         },
         getPoint(id) {
+            this.ruleForm.routePointRelationDtos = [];
+            this.targetData = [];
             this.$http.get('/sc-community/patrol/point/getPointList', { id, id }).then(({ data, status, msg }) => {
                 this.patrolArr = data;
             });
@@ -290,6 +274,29 @@ export default {
                 });
                 this.ruleForm.timePeriod = TimeArr.join();
             }
+        },
+        optionUp(nub, item) {
+            let thisArr = this.ruleForm.routePointRelationDtos;
+            let okArr = this.$refs.transferTude.targetData;
+            let newArr = [];
+            let inx = null;
+            thisArr.map((list, index) => {
+                if (list == item.id) {
+                    inx = index;
+                }
+                return inx;
+            });
+            if (inx !== null && thisArr.length > 1) {
+                //向下
+                if (nub == 1 && inx < thisArr.length - 1) {
+                    thisArr.splice(inx + 1, 1, ...thisArr.splice(inx, 1, thisArr[inx + 1]));
+                    okArr.splice(inx + 1, 1, ...okArr.splice(inx, 1, okArr[inx + 1]));
+                } else if (nub != 1 && inx > 0) {
+                    thisArr.splice(inx, 1, ...thisArr.splice(inx - 1, 1, thisArr[inx]));
+                    okArr.splice(inx, 1, ...okArr.splice(inx - 1, 1, okArr[inx]));
+                }
+                this.targetData = okArr;
+            }
         }
     },
     created() {}
@@ -344,4 +351,26 @@ export default {
         display: inline-block;
     }
 }
+/deep/ .el-transfer-panel__item.el-checkbox {
+    margin-right: 0;
+}
+.transferTudeClass {
+    display: flex;
+    justify-content: space-between;
+    > div {
+        width: 60px;
+        display: flex;
+        justify-content: space-around;
+    }
+    .zoniot_font {
+        line-height: 30px;
+    }
+}
+/deep/ .el-transfer-panel:first-child {
+    .transferTudeClass {
+        > div {
+            display: none;
+        }
+    }
+}
 </style>

operationSupport/src/views/patrolManagement/popups/addPoint.vue

@@ -110,7 +110,8 @@ export default {
                     height: '500px',
                     props: {
                         callback: resolve,
-                        location: this.initDot
+                        location: this.initDot,
+                        data: this.formData
                     },
                     title: title
                 });

operationSupport/src/views/patrolManagement/popups/mapValue.vue

@@ -1,24 +1,12 @@
 <template>
     <div>
-        <div id="mapValue" :style="`height:${height||300}px`"></div>
+        <div id="mapValue" :style="`height:${height || 300}px`"></div>
         <!--控制条-->
         <div class="map-control" v-if="isStart && !!point.length">
             <div class="clickIco">
-                <i
-                    class="zoniot_font zoniot-icon-kaishi"
-                    v-if="palyStayus==0"
-                    @click="navgControl('start')"
-                ></i>
-                <i
-                    class="zoniot_font zoniot-icon-tingzhi"
-                    v-else-if="palyStayus==2"
-                    @click="navgControl('pause')"
-                ></i>
-                <i
-                    class="zoniot_font zoniot-icon-kaishi"
-                    v-else-if="palyStayus==1"
-                    @click="navgControl('resume')"
-                ></i>
+                <i class="zoniot_font zoniot-icon-kaishi" v-if="palyStayus == 0" @click="navgControl('start')"></i>
+                <i class="zoniot_font zoniot-icon-tingzhi" v-else-if="palyStayus == 2" @click="navgControl('pause')"></i>
+                <i class="zoniot_font zoniot-icon-kaishi" v-else-if="palyStayus == 1" @click="navgControl('resume')"></i>
             </div>
             <el-slider
                 class="slider"
@@ -47,20 +35,39 @@ export default {
     data() {
         return {
             marker: '',
-            markerArr: []
+            markerArr: [],
+            polyline: null
         };
     },
     watch: {
-        point(e) {
-            this.point.map((item, index) => {
-                let tag = false;
-                if (index == this.point.length - 1) {
-                    tag = true;
-                }
+        point: {
+            handler() {
                 if (!!this.map) {
-                    this.addIcon(item, tag);
+                    this.lineArr = [];
+                    // 判断当前是否有绘制点位清除
+                    if (this.markerArr.length > 0) {
+                        this.map.remove(this.markerArr);
+                        this.markerArr = [];
+                    }
+                    // 判断当前是否有巡航路线清除
+                    if (!!this.pathSimplifierIns) {
+                        this.pathSimplifierIns.setData([]);
+                        this.pathSimplifierIns = null;
+                    }
+                    // 判断当前是否有轨迹清除
+                    if (!!this.polyline) {
+                        this.map.remove(this.polyline);
+                        this.polyline = null;
+                    }
+                    // 先初始化点位信息
+                    this.point.map((item, index) => {
+                        this.addIcon(item, index);
+                    });
+                    this.setMap();
                 }
-            });
+            },
+            deep: true,
+            immediate: true
         }
     },
     methods: {
@@ -70,26 +77,49 @@ export default {
                 zoom: 11 //初始化地图层级
             });
         },
-        addIcon(e, is) {
-            let _this = this;
+        //绘制点位信息
+        addIcon(e, index) {
             let lineArr = [e.longitude, e.latitude];
             this.marker = new AMap.Marker({
                 icon: this.icon,
                 position: lineArr
             });
+            this.marker.setLabel({
+                offset: new AMap.Pixel(-22, 40),
+                content: `巡更点：${index + 1}`
+            });
             this.markerArr.push(this.marker);
             this.lineArr.push(lineArr);
-            if (is) {
-                this.map.add(this.markerArr);
-                this.map.setFitView();
+        },
+        // 添加点位 添加路线到地图
+        setMap() {
+            this.map.add(this.markerArr);
+            this.map.setFitView();
+            // 大于一个点创建 巡航路线
+            if (this.point.length > 1) {
+                // 是否巡航开启
                 if (this.isStart) {
                     this.$nextTick(() => {
                         this.initPlayBox();
                         this.beforeInit = true;
-                        this.initLineArr();
+                        this.initLineArr(true);
                     });
+                } else {
+                    this.addPolyline();
                 }
             }
+        },
+        //轨迹路线
+        addPolyline() {
+            this.polyline = new AMap.Polyline({
+                map: this.map,
+                path: this.lineArr,
+                showDir: true,
+                strokeColor: '#28F', //线颜色
+                // strokeOpacity: 1,     //线透明度
+                strokeWeight: 6 //线宽
+                // strokeStyle: "solid"  //线样式
+            });
         }
     },
     created() {
@@ -100,11 +130,26 @@ export default {
 };
 </script>
 <style scoped  lang="scss">
-/* --------------------------------高德地图样式----------------------------- */
 #mapValue {
-    // margin-top: 20px;
     width: 100%;
-    // height: 300px;
+    /deep/ .amap-marker-label {
+        border: 0 none;
+        background-color: #fff;
+        white-space: nowrap;
+        box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
+        border-radius: 5px;
+    }
+
+    /deep/ .amap-marker-label:before {
+        position: absolute;
+        border: 5px solid transparent;
+        border-bottom-color: #fff;
+        top: -10px;
+        left: 43%;
+        content: '';
+        width: 0;
+        height: 0;
+    }
 }
 .my-autocomplete {
     li {

operationSupport/src/views/patrolManagement/popups/popMap.vue

@@ -48,12 +48,14 @@ export default {
             this.placeSearch = new AMap.PlaceSearch({
                 map: _this.map
             });
+            AMap.event.addListener(this.placeSearch, 'markerClick', (e) => {
+                this.thisMapPot = e.event.lnglat;
+                this.$message.success('选择成功');
+            });
         },
         mapClick(e) {
             this.addIcon(e.lnglat);
-        },
-        mapSelect(e) {
-            this.addIcon(e.location);
+            this.$message.success('选择成功');
         },
         addIcon(e) {
             if (!!this.marker) {
@@ -67,6 +69,10 @@ export default {
                 position: loc,
                 map: this.map
             });
+            this.marker.setLabel({
+                offset: new AMap.Pixel(-50, 35),
+                content: !!this.params.data.pointName ? `巡更名称：${this.params.data.pointName}` : `巡更经纬度：${e.lng}，${e.lat}`
+            });
             this.map.setFitView();
         },
         submit() {
@@ -75,14 +81,15 @@ export default {
         },
         togglePlaceSearch(val, resolve) {
             this.placeSearch.search(val, (status, result) => {
-                if (result.info == 'OK') {
+                if (result.info == 'OK' && status == 'complete') {
                     this.poisArray = result.poiList.pois;
                 }
                 resolve && resolve(true);
             });
         },
         handleSelect(item) {
-            this.mapSelect(item);
+            this.addressName = item.name;
+            this.placeSearch.search(item.name);
         },
         querySearch(queryString, cb) {
             new Promise((resolve) => {
@@ -94,6 +101,10 @@ export default {
             });
         }
     },
+    destroyed() {
+        this.map && this.map.destroy();
+        this.marker = '';
+    },
     created() {
         this.$nextTick(() => {
             this.init();
@@ -107,6 +118,24 @@ export default {
     margin-top: 20px;
     width: 100%;
     height: 400px;
+    /deep/ .amap-marker-label {
+        border: 0 none;
+        background-color: #fff;
+        white-space: nowrap;
+        box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
+        border-radius: 5px;
+    }
+
+    // /deep/ .amap-marker-label:after {
+    //     position: absolute;
+    //     border: 5px solid transparent;
+    //     border-top-color: #fff;
+    //     top: 19px;
+    //     left: 43%;
+    //     content: '';
+    //     width: 0;
+    //     height: 0;
+    // }
 }
 .my-autocomplete {
     li {

operationSupport/src/views/payService/propertyFee/stepPage/details.vue

@@ -4,15 +4,25 @@
         <el-form ref="form" label-width="110px">
             <template v-for="(item, index) in formLook">
                 <el-col :span="12" :key="index">
-                    <el-form-item :label="item.label">
+                    <el-form-item :label="labelType(item.label, item.prop)">
                         <template v-if="item.slot">
-                            <template v-if="item.slot === 'chargeStatus'">
+                            <template v-if="item.slot == 'assetsArea' && thisItem['chargeType'] == 4">
+                                {{ !!thisItem['parkingDetail'] ? thisItem['parkingDetail'] : '--' }}
+                            </template>
+                            <template v-else-if="item.slot == 'chargeMode'">
+                                {{ !!chargeModeValue[thisItem[item.prop]] ? chargeModeValue[thisItem[item.prop]] : '--' }}
+                            </template>
+                            <template v-else-if="item.slot === 'chargeStatus'">
                                 <span v-if="thisItem['chargeStatus'] == 1" class="redText">未缴费</span>
                                 <span v-else class="greenText">已缴费</span>
                             </template>
-                            <template v-if="item.slot === 'payEndTime'">
+                            <template v-else-if="item.slot === 'payEndTime'">
                                 <div style="white-space: nowrap">{{ thisItem['payBeginTime'] }} - {{ thisItem['payEndTime'] }}</div>
                             </template>
+
+                            <template v-else>
+                                {{ thisItem[item.prop] || '--' }}
+                            </template>
                         </template>
                         <template v-else>
                             {{ thisItem[item.prop] || '--' }}
@@ -28,6 +38,11 @@ export default {
     props: ['params'],
     data() {
         return {
+            chargeModeValue: {
+                1: '固定收费',
+                2: '价格*面积收费',
+                4: '单价*用量'
+            },
             formLook: [
                 {
                     label: '费用名称:',
@@ -39,7 +54,8 @@ export default {
                 },
                 {
                     label: '面积(㎡):',
-                    prop: 'assetsArea'
+                    prop: 'assetsArea',
+                    slot: 'assetsArea'
                 },
                 {
                     label: '单价(元):',
@@ -54,7 +70,7 @@ export default {
                     prop: 'paymentDays'
                 },
                 {
-                    label: '账单收费日期:',
+                    label: '账单计费日期:',
                     prop: 'payEndTime',
                     slot: 'payEndTime'
                 },
@@ -106,6 +122,25 @@ export default {
                     }
                 })
                 .catch(() => {});
+        },
+        labelType(lab, val) {
+            let type = this.thisItem['chargeType'];
+            if (val == 'assetsArea') {
+                if (type == 2) {
+                    lab = '用量(吨):';
+                } else if (type == 3) {
+                    lab = '用量(度):';
+                } else if (type == 4) {
+                    lab = '车位:';
+                }
+            } else if (val == 'chargePrice') {
+                if (type == 2) {
+                    lab = '价格(元/吨):';
+                } else if (type == 3) {
+                    lab = '价格(元/度):';
+                }
+            }
+            return lab;
         }
     },
     created() {
@@ -119,6 +154,7 @@ export default {
     /deep/ .el-form-item__label,
     /deep/.el-form-item__content {
         font-size: 12px;
+        white-space: nowrap;
     }
 }
 </style>

operationSupport/src/views/payService/propertyFee/stepPage/single.vue

@@ -6,18 +6,21 @@
                 <el-col :span="12" :key="index">
                     <el-form-item :label="labelType(item.label, item.prop)">
                         <template v-if="item.slot">
-                            <template v-if="item.slot === 'assetsArea' && thisItem['chargeType'] == 4">
+                            <template v-if="item.slot == 'assetsArea' && thisItem['chargeType'] == 4">
                                 {{ !!thisItem['parkingDetail'] ? thisItem['parkingDetail'] : '--' }}
                             </template>
-                            <template v-if="item.slot === 'chargeMode'">
+                            <template v-else-if="item.slot == 'chargeMode'">
                                 {{ !!chargeModeValue[thisItem[item.prop]] ? chargeModeValue[thisItem[item.prop]] : '--' }}
                             </template>
-                            <template v-if="item.slot === 'chargeStatus'">
+                            <template v-else-if="item.slot == 'chargeStatus'">
                                 <span class="redText">未缴费</span>
                             </template>
-                            <template v-if="item.slot === 'payEndTime'">
+                            <template v-else-if="item.slot === 'payEndTime'">
                                 <div style="white-space: nowrap">{{ typeTimeTransition(thisItem.payBeginTime, thisItem.payEndTime) }}</div>
                             </template>
+                            <template v-else>
+                                {{ thisItem[item.prop] || '--' }}
+                            </template>
                         </template>
                         <template v-else>
                             {{ thisItem[item.prop] || '--' }}
@@ -216,6 +219,7 @@ export default {
     /deep/ .el-form-item__label,
     /deep/.el-form-item__content {
         font-size: 12px;
+        white-space: nowrap;
     }
 }
 .inline {