feat:添加农场确权页面

src/components/navigation.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="navigation yes-events">
+    <div class="btn" @click="toPage">农场确权</div>
+  </div>
+</template>
+
+<script setup>
+import { useRouter } from "vue-router";
+const router = useRouter();
+
+const toPage = () =>{
+  router.push('/authentic')
+}
+</script>
+
+<style lang="scss" scoped>
+.navigation{
+  position: fixed;
+  top: 34px;
+  right: 25vw;
+  .btn{
+    width: 80px;
+    height: 30px;
+    text-align: center;
+    line-height: 28px;
+    border-radius: 5px;
+    cursor: pointer;
+    background: rgba(255,255,255,0.5);
+  }
+}
+</style>

src/router/mainRoutes.js

@@ -18,6 +18,11 @@ export default [
         component: () => import("@/views/file/index.vue"),
     },
     {
+        path: "/authentic",
+        name: "Authentic",
+        component: () => import("@/views/authentic/index.vue"),
+    },
+    {
         path: "/regionalInformation",
         name: "RegionalInformation",
         component: () => import("@/views/regionalInformation/index.vue"),
@@ -28,11 +33,6 @@ export default [
         component: () => import("@/views/checkComparison/index.vue"),
     },
     {
-        path: "/grzxqk",
-        name: "Grzxqk",
-        component: () => import("@/views/grzxqk/index.vue"),
-    },
-    {
         path: "/edit_ns_record",
         name: "EditNsRecord",
         component: () => import("@/views/edit_ns_recrod/index.vue"),

src/views/Navigation.vue

@@ -1,177 +0,0 @@
-<template>
-  <div class="nav-box no-events" :key="menuType">
-    <div class="nav">
-      <template v-for="(item, index) in list" :key="index">
-        <div class="nav-item yse-events">
-          <template v-if="index != 3">
-            <div
-                v-for="(ele, idx) in item"
-                :key="idx + 1"
-                @click="handleActive(ele.act,ele)"
-                :class="['name', { active: active === ele.act, harm: ele.class }]"
-            >
-              {{ ele.name }}
-            </div>
-          </template>
-        </div>
-      </template>
-      <div class="nav-btn yse-events" @click="toPage('zhgl')">查看巡园照片</div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, onMounted, toRefs } from "vue";
-import { useStore } from "vuex";
-import { ROLE_ENUM } from "@/api/enum.js";
-import { useRouter } from "vue-router";
-const store = useStore();
-const router = useRouter();
-const userinfo = store.getters.userinfo;
-let emits = defineEmits(["select","handleAct"]);
-let props = defineProps({
-  val: {
-    type: String,
-    value: "znxy",
-  },
-});
-let { val } = toRefs(props);
-let menuType = ref(val.value);
-
-function handleSelect(val, title) {
-  if (val === menuType.value) {
-    return;
-  }
-  menuType.value = val;
-  if (val === "znxy") {
-    emits("select", val, title);
-  } else {
-    router.push("/" + val);
-  }
-}
-
-onMounted(()=>{
-  initList()
-})
-
-const toPage = (path) => {
-  router.push("/" + path);
-}
-
-const curGardenId = ref(userinfo.curGardenId);
-
-const list = ref([
-  // [
-  //   {
-  //     name: "生长",
-  //     act: 3,
-  //   },
-  //   {
-  //     name: "病害",
-  //     act: 4,
-  //     class: true,
-  //   },
-  //   {
-  //     name: "虫害",
-  //     act: 5,
-  //     class: true,
-  //   },
-  // ],
-  [
-    {
-      name: "负责人",
-      act: 6,
-    },
-    {
-      name: "编号",
-      act: 7,
-    },
-  ],
-]);
-const active = ref(0);
-const handleActive = (i,v) => {
-  active.value = i;
-  emits('handleAct',v)
-};
-
-const initList = async () =>{
-  const { code, data } = await VE_API.regionalInformation.aPictureGarden({
-    gardenId: curGardenId.value,
-  });
-  const arr = data.data[0].children.map((item,index) =>{
-    return {
-      ...item,
-      act:index + 1
-    }
-  })
-  arr.unshift({
-    name:'果园',
-    act:0,
-    type:3
-  })
-  list.value.unshift(arr)
-}
-</script>
-
-<style lang="scss" scoped>
-.nav-box {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  z-index: 3;
-  .nav {
-    position: relative;
-    margin: 0 auto;
-    margin-top: 100 / 16 * 1rem;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    .nav-item {
-      background: rgba(2, 41, 55, 1);
-      border-radius: 4px;
-      border: 1px solid rgba(33, 174, 174, 0.51);
-      color: #fff;
-      padding: 3px 0;
-      display: flex;
-      justify-content: space-between;
-      margin-right: 15px;
-      cursor: pointer;
-      .name {
-        border-radius: 4px;
-        padding: 6px 3px;
-        margin: 0 5px;
-        border: 1px solid transparent;
-
-        &.active {
-          background: rgba(2, 144, 136, 0.63);
-          border: 1px solid #00fff0;
-        }
-        &.harm {
-          color: #ff2929;
-          position: relative;
-          &::before {
-            content: "";
-            position: absolute;
-            right: 0;
-            top: 4px;
-            width: 5px;
-            height: 5px;
-            background: #ff2929;
-            border-radius: 50%;
-          }
-        }
-      }
-    }
-    .nav-btn {
-      padding: 6px 11px;
-      font-weight: bold;
-      font-size: 15px;
-      color: #0ac9c1;
-      background: rgba(2,41,55,0.8);
-      border-radius: 17px;
-      border: 1px solid rgba(33,174,174,0.51);
-      cursor: pointer;
-    }
-  }
-}
-</style>

src/views/authentic/index.vue

@@ -0,0 +1,13 @@
+<template>
+    <div>
+1111
+    </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/grzxqk/WorkerMap.js

@@ -1,174 +0,0 @@
-import Layer from 'ol/layer/Vector'
-import Source from 'ol/source/Vector'
-import Select from 'ol/interaction/Select.js';
-import {singleClick} from 'ol/events/condition'
-import WKT from "ol/format/WKT";
-import * as olEvents from 'ol/events';
-import config from "@/api/config.js"
-import * as KMap from '@/utils/ol-map/KMap';
-import Style from "ol/style/Style";
-import Photo from "ol-ext/style/Photo";
-import {base_img_url2} from "../../api/config";
-import Stroke from "ol/style/Stroke";
-import * as util from "@/common/ol_common.js"
-import {newAreaFeature, newAreaPoint, newPolymerFeature, newPoint} from "../zhgl/map";
-import Text from "ol/style/Text";
-import Fill from "ol/style/Fill";
-import Icon from "ol/style/Icon";
-import Feature from "ol/Feature";
-import {getDateText} from "../../utils/util"
-import {transformFromGCJToWGS,pointWktToLocation,toPointWkt} from "../../utils/WSCoordinate"
-
-/**
- * @description 智能巡园地图层对象
- */
-class WorkerMap {
-
-    constructor(){
-        let that = this
-        this.vectorStyle = new KMap.VectorStyle()
-        this.areaLayer = new KMap.VectorLayer("areaLayer",999,{style:(f)=> that.vectorStyle.getPolygonStyle("#ffffff10", "#ffffff",3)})
-        this.workerLayer = new KMap.VectorLayer("workerLayer",999,{style:(f)=> {
-                let timeAndLength = f.get("execTime")+"分钟" +"  "+ f.get("pathLength")+"m";
-                let timeAndLengthObj = new Text({
-                    offsetY:-120,
-                    font:"20px sans-serif",
-                    text:timeAndLength,
-                    stroke: new Stroke({
-                        color: "#00FFF0",
-                        width: 1,
-                    }),
-                    fill: new Fill({
-                        color: "#00FFF0"
-                    }),
-                })
-                let timeAndLengthStyle = new Style({
-                    text:timeAndLengthObj
-                })
-                let textObj = new Text({
-                    font:"20px sans-serif",
-                    text:f.get("name"),
-                    stroke: new Stroke({
-                        color: "#00FFF0",
-                        width: 1,
-                    }),
-                    fill: new Fill({
-                        color: "#00FFF0",
-                    }),
-                })
-                let textStyle = new Style({
-                    text:textObj
-                })
-                let style = new Style({
-                    image: new Icon({
-                        src:config.base_img_url3+"birdseye-look-vue/worker_path/worker_point.png",
-                        scale:1,
-                        anchor:[0.5,1],
-                    })
-                });
-                return [timeAndLengthStyle, textStyle,style]
-        }})
-        this.pathLayer = new KMap.VectorLayer("pathLayer",999,{style:this.vectorStyle.getLineStyle("#4cb7fa", "#4cb7fa",2)})
-    }
-    initWorker(list){
-        let that = this
-        this.workerLayer.refresh()
-        this.pathLayer.refresh()
-        that.workerLayer.layer.setVisible(true)
-        for(let item of list){
-            if(item.wkt == ""){
-                continue
-            }
-            let temp = pointWktToLocation(item.wkt)
-            temp = transformFromGCJToWGS(temp)
-            item.wkt = toPointWkt(temp)
-            that.workerLayer.addFeature(newPoint(item))
-        }
-    }
-
-    //加载执行人轨迹
-    loadExecutorPath(allotExecutorId){
-        let that = this
-        that.pathLayer.refresh()
-        this.pathLayer.layer.setVisible(true)
-        VE_API.ns_record_allot_executor_path.points({allotExecutorId}).then(({data})=>{
-            let i = 0;
-            let wkt = "LINESTRING("
-            for(let item of data.list){
-                let {longitude,latitude} = that.pointWktToLocation(item.wkt)
-                item.wkt = toPointWkt({longitude,latitude})
-                let feature = newPoint(item)
-                that.pathLayer.addFeature(feature)
-                if(i == 0){
-                    let text = "起"+getDateText(feature.get("execTime"))
-                    feature.setStyle(that.vectorStyle.getPointTextStyle(text,"#FFFFFF","#3f9edb",3,16))
-                }else if(i == data.list.length - 1){
-                    let text = "终"+ getDateText(feature.get("execTime"))
-                    feature.setStyle(that.vectorStyle.getPointTextStyle(text,"#FFFFFF","#3f9edb",3,16))
-                }else{
-                    let text = getDateText(feature.get("execTime"))
-                    feature.setStyle(that.vectorStyle.getPointTextStyle(text,"#FFFFFF","#3f9edb",3,16))
-                }
-                wkt+=(i == 0 ? "" : ",") + longitude + " " + latitude
-                i++
-            }
-            wkt+=")"
-            let lineFeature = new Feature({
-                geometry: new WKT().readGeometry(wkt)
-            });
-            that.pathLayer.addFeature(lineFeature)
-            that.fit(that.pathLayer.source.getExtent())
-            that.workerLayer.layer.setVisible(false)
-        })
-    }
-
-    initClick(listener){
-        let that = this
-        this.kmap.map.on("click",function (event){
-            let clickFeature = that.kmap.map.forEachFeatureAtPixel(event.pixel, function(feature){
-                // 为点击到的feature发送自定义的click消息
-                if(feature.dispatchEvent != undefined){
-                    listener && listener(feature)
-                }
-                return feature
-            })
-        })
-    }
-
-    initMap(location, target)  {
-        let level = 18
-        let coordinate = util.wktCastGeom(location).getFirstCoordinate()
-        this.kmap = new KMap.Map(target,level,coordinate[0], coordinate[1],null,5,22);
-        let xyz = config.base_img_url + 'map/lby/{z}/{x}/{y}.png';
-        this.kmap.addXYZLayer(xyz,{minZoom:15,maxZoom:22});
-        let xyz2 = config.base_img_url3 + 'map/lby/{z}/{x}/{y}.png';
-        this.kmap.addXYZLayer(xyz2,{minZoom:12,maxZoom:22});
-        this.kmap.addLayer(this.areaLayer.layer)
-        this.kmap.addLayer(this.workerLayer.layer)
-        this.kmap.addLayer(this.pathLayer.layer)
-    }
-
-    initArea(organId, callback){
-        let that = this
-        this.areaLayer.refresh()
-        VE_API.area.list({organId}).then(({data,code})=>{
-            for(let item of data){
-                that.areaLayer.addFeature(newAreaFeature(item))
-            }
-            callback && callback()
-        })
-    }
-
-    fit(geomOrExtent){
-        this.kmap.fit(geomOrExtent,[10,10,10,10])
-    }
-
-    pointWktToLocation(wkt){
-        let start = wkt.indexOf("(")
-        let end = wkt.indexOf(")")
-        let arr = wkt.substring(start + 1,end).trim().split(" ")
-        return transformFromGCJToWGS({latitude: parseFloat(arr[1]), longitude: parseFloat(arr[0])})
-    }
-}
-
-export default WorkerMap

src/views/grzxqk/index.vue

@@ -1,392 +0,0 @@
-<!--
- * @Author: your name
- * @Date: 2021-01-18 15:46:34
- * @LastEditTime: 2021-11-30 18:54:36
- * @LastEditors: Please set LastEditors
- * @Description: In User Settings Edit
- * @FilePath: \vue3-element-admin\src\views\Home.vue
--->
-<template>
-  <Bg></Bg>
-  <Header></Header>
-  <div class="container2">
-    <div class="mainDiv">
-      <div class="leftBox">
-        <Title title="工人列表"></Title>
-        <div class="workerList">
-          <div
-            class="workerItem cursor-pointer"
-            v-for="item in workerPathList"
-            :key="item.id"
-            :class="[selectedWorkerObj.id == item.id ? 'active' : '']"
-            @click="selectedWorker(item)"
-          >
-            <img class="icon" :src="item.icon" />
-            <div class="desc">
-              <div class="name">{{ item.name }}</div>
-              <div class="type">临时工</div>
-            </div>
-            <div class="timeBox">
-              <div class="time">{{ item.execTime }}分</div>
-              <div class="length">{{ item.pathLength }}m</div>
-            </div>
-            <el-icon class="arrowRight"><ArrowRight /></el-icon>
-          </div>
-        </div>
-      </div>
-      <div class="rightBox">
-        <div class="head">
-          <div class="name">工人执行轨迹</div>
-          <div class="line"></div>
-          <div class="rhombus"></div>
-          <el-select class="select" effect="dark" popper-class="v-select-popper-ns" v-model="value">
-            <el-option
-              v-for="item in options"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            />
-          </el-select>
-        </div>
-        <div class="tabs">
-          <div class="title">
-            农事-
-            <!-- <template  v-for="(name,index) in rowData.nsTypeNames" :key="index">
-              <template v-if="index != 0">、</template>{{name}}
-            </template> -->
-          </div>
-          <div
-            class="tab cursor-pointer"
-            @click="onActive(index, item, true)"
-            :class="[selected == index ? 'active' : '']"
-            v-for="(item, index) in createDateList"
-            :key="item"
-          >
-            {{ item }}
-          </div>
-          <div
-            v-if="selectedWorkerObj.name"
-            class="title selectWorker cursor-pointer"
-            @click="reloadAll"
-          >
-            查看全部
-          </div>
-        </div>
-        <div class="map" ref="mapRef"></div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { useStore } from "vuex";
-import { onMounted, ref, onUnmounted } from "vue";
-import config from "@/api/config.js";
-import { useRoute } from "vue-router";
-import Title from "../components/title";
-import WorkerMap from "./WorkerMap";
-import Bg from "../Bg";
-import Header from "@/views/components/Header.vue";
-
-const store = useStore();
-const createDateList = ref([]);
-const workerPathList = ref([]);
-const curCreateDate = ref(null);
-const route = useRoute();
-const selected = ref(null);
-const selectedWorkerObj = ref({});
-const mapRef = ref(null);
-const pollingId = ref(null);
-let kmap = new WorkerMap();
-
-const queryId = route.query.recordId;
-
-onMounted(() => {
-  loadCreateDateList();
-  let location = store.getters.userinfo.location;
-  let organId = store.getters.userinfo.curGardenId;
-  kmap.initMap(location, mapRef.value);
-  kmap.initClick((f) => {
-    let res = workerPathList.value.find((item) => item.id == f.get("id"));
-    selectedWorker(res);
-  });
-  kmap.initArea(organId);
-});
-
-onUnmounted(() => {
-  if (pollingId.value != null) {
-    clearTimeout(pollingId.value);
-  }
-});
-
-async function onActive(index, createDate, checkSelected) {
-  if (checkSelected && selected.value == index) {
-    return;
-  }
-  if (pollingId.value != null) {
-    clearTimeout(pollingId.value);
-  }
-  curCreateDate.value = createDate;
-  //加载工人点位
-  await loadWorker(createDate);
-  kmap.fit(kmap.workerLayer.source.getExtent());
-
-  //查询当期日期是否已汇总
-  let res = await VE_API.ns_record_allot_collect.isAllCollect({
-    recordId: queryId,
-    createDate,
-  });
-  //没有汇总过的
-  if (!res.data) {
-    polling();
-  }
-  selected.value = index;
-}
-//加载工人点位
-async function loadWorker(createDate) {
-  //查询工人点位
-  let { data } = await VE_API.ns_record_allot_executor.workerPathList({
-    recordId: queryId,
-    createDate,
-  });
-  workerPathList.value = data;
-  kmap.initWorker(data);
-}
-
-function polling() {
-  loadWorker(curCreateDate.value);
-  pollingId.value = setTimeout(polling, 5000);
-}
-
-function loadCreateDateList() {
-  VE_API.ns_record_allot_executor
-    .getExecutorCreateDate({ nsRecordId: queryId })
-    .then(({ data }) => {
-      createDateList.value = data;
-      onActive(0, createDateList.value[0], false);
-      loadWorker(curCreateDate.value);
-    });
-}
-
-/**
- * 选择工人
- */
-function selectedWorker(obj) {
-  kmap.loadExecutorPath(obj.id);
-  selectedWorkerObj.value = obj;
-  if (pollingId.value != null) {
-    clearTimeout(pollingId.value);
-  }
-}
-
-function reloadAll() {
-  onActive(selected.value, createDateList.value[selected.value], false);
-  selectedWorkerObj.value = {};
-}
-
-const value = ref("Option1");
-const options = [
-  {
-    value: "Option1",
-    label: "筛选农事",
-  }
-];
-</script>
-
-<style lang="scss" scoped>
-@import "../../styles/index.scss";
-
-.container2 {
-  height: 100%;
-  width: 100%;
-  z-index: 2;
-  position: absolute;
-}
-
-.mainDiv {
-  position: absolute;
-  top: 100px;
-  bottom: 50px;
-  left: 20px;
-  right: 20px;
-
-  .leftBox {
-    float: left;
-    width: 25%;
-    height: calc(100%);
-    border: 1px solid rgba(81, 233, 240, 0.6);
-    box-sizing: border-box;
-    overflow: hidden;
-    .workerList {
-      @include wh(100%, calc(100% - 58px));
-      margin-top: 10px;
-      background: rgba(1, 224, 212, 0.08);
-      overflow-y: auto;
-      .workerItem {
-        @include wh(auto, calc(80px));
-        display: flex;
-        align-items: center;
-        box-sizing: border-box;
-        .icon {
-          @include wh(61px, 61px);
-          border: 1px solid rgba(2, 240, 235, 0.67);
-          padding: 5px;
-          box-sizing: border-box;
-          border-radius: 50%;
-          margin-left: 21px;
-        }
-        .desc {
-          margin-left: 16px;
-          .name {
-            @include wh(100px, 30px);
-            @include PingFang(#fff, 500);
-            font-size: 23px;
-          }
-          .type {
-            margin-top: 3px;
-            @include wh(80px, 23px);
-            @include PingFang(#00fff0, 500);
-            font-size: 17px;
-          }
-        }
-        .timeBox {
-          @include wh(150px, 41px);
-          background: rgba(66, 66, 66, 0.62);
-          border-radius: 5px;
-          border: 1px solid #00f0e3;
-          display: flex;
-          align-items: center;
-          padding-left: 9px;
-          .time {
-            @include wh(150px, 41px);
-            line-height: 41px;
-            font-family: DOUYU;
-            font-weight: normal;
-            font-size: 20px;
-            color: #00fff0;
-          }
-          .length {
-            @include wh(187px, 41px);
-            line-height: 41px;
-            font-family: DOUYU;
-            font-weight: normal;
-            font-size: 20px;
-            color: #00fff0;
-          }
-        }
-        .arrowRight {
-          font-size: 25px;
-          color: #ffffff;
-          margin-left: 16px;
-        }
-      }
-      .active {
-        background-color: #ffffff50;
-      }
-    }
-  }
-  .rightBox {
-    position: relative;
-    float: right;
-    width: calc(75% - 12px);
-    height: 100%;
-    background: #032c3940;
-    border: 1px solid rgba(81, 233, 240, 0.6);
-    box-sizing: border-box;
-    .head {
-      @include wh(calc(100% - 19px - 224px), 30px);
-      display: flex;
-      align-items: center;
-      justify-content: space-around;
-      margin-right: 224px;
-      position: relative;
-      .select{
-        position: absolute;
-        right: -232px;
-        width: 137px;
-        top: 7px;
-        ::v-deep{
-          .el-select__wrapper{
-            background: #052834;
-            border-radius: 5px;
-            border: 1px solid #5EFCFF;
-            box-shadow: none;
-          }
-          .el-select__placeholder,.el-select__caret{
-            color: #00F6FF;
-          }
-        }
-      }
-
-      .name {
-        @include wh(auto, 21px);
-        font-weight: normal;
-        font-size: 21px;
-        line-height: 30px;
-        color: #ffffff;
-      }
-
-      .line {
-        width: calc(100% - 250px);
-        border-bottom: 1px solid #51e9f0;
-        opacity: 0.4;
-        box-sizing: border-box;
-        margin-top: 7px;
-      }
-
-      .rhombus {
-        margin-top: 7px;
-        @include wh(50px, 15px);
-        @include ossBg("rhombus.png");
-      }
-    }
-    .tabs {
-      @include wh(calc(100% - 200px), auto);
-      float: left;
-      display: flex;
-      align-items: center;
-      margin: 20px 0px 0px 13px;
-      .title {
-        @include wh(auto, auto);
-        background: rgba(0, 255, 240, 0.65);
-        border-radius: 5px;
-        border: 1px solid #5efcff;
-        box-sizing: border-box;
-        text-align: center;
-        @include PingFang(#ffffff, 800);
-        font-size: 20px;
-        padding: 6px 18px;
-      }
-      .tab {
-        @include wh(auto, auto);
-        background: #012226;
-        border-radius: 5px;
-        border: 1px solid #5efcff;
-        text-align: center;
-        @include PingFang(#ffffff, 800);
-        font-size: 20px;
-        padding: 3px 10px;
-        margin-left: 10px;
-      }
-      .active {
-        background: #5efcff;
-        border-radius: 5px;
-        border: 1px solid #5efcff;
-        color: #012226;
-      }
-      .selectWorker {
-        position: absolute;
-        right: 15px;
-      }
-    }
-
-    .map {
-      position: absolute;
-      top: 106px;
-      left: 13px;
-      right: 13px;
-      bottom: 13px;
-    }
-  }
-}
-</style>

src/views/home/index.vue

@@ -2,7 +2,7 @@
   <div class="base-container no-events">
     <fnHeader showDate></fnHeader>
     <div class="content">
-      <!-- <div class="top"></div> -->
+      <navigation></navigation>
       <div class="left yes-events">
         <tool-list
           direction="left"
@@ -41,6 +41,7 @@
 <script setup>
 import { onMounted, ref } from "vue";
 import fnHeader from "@/components/fnHeader.vue";
+import navigation from "@/components/navigation.vue";
 import chartBox from "@/components/chartBox.vue";
 import toolList from "@/components/toolList.vue";
 import fileBar from "@/components/fileBar.vue";

src/views/ns_allot/AllotNsMap.js

@@ -1,120 +0,0 @@
-import Layer from 'ol/layer/Vector'
-import Source from 'ol/source/Vector'
-import Select from 'ol/interaction/Select.js';
-import {singleClick} from 'ol/events/condition'
-import * as olEvents from 'ol/events';
-import config from "@/api/config.js"
-import * as KMap from '@/utils/ol-map/KMap';
-import Style from "ol/style/Style";
-import Photo from "ol-ext/style/Photo";
-import {base_img_url2} from "../../api/config";
-import Stroke from "ol/style/Stroke";
-import * as util from "@/common/ol_common.js"
-import {newAreaFeature, newAreaPoint, newPolymerFeature, newPoint} from "../zhgl/map";
-
-/**
- * @description 智能巡园地图层对象
- */
-class AllotNsMap {
-
-    constructor(){
-        let that = this
-        this.vectorStyle = new KMap.VectorStyle()
-        let pointSimpleStyle = this.vectorStyle.getPointSimpleStyle(8,"#999999","#d5d5d0","1")
-        this.areaLayer = new KMap.VectorLayer("areaLayer",999,{style:(f)=> that.vectorStyle.getPolygonStyle("#ffffff10", "#ffffff",3)})
-        this.areaPointLayer =  new KMap.VectorLayer("areaPointLayer",1002,{style:(f)=> that.vectorStyle.getPointTextStyle(f.get("name"), "#120046","#FFFFFF",2, 30)})
-        this.treeLayer = new KMap.VectorLayer("treeLayer",1001,{style:pointSimpleStyle})
-        this.treeFeatures = []
-    }
-
-    initMap(location, target)  {
-        let level = 18
-        let coordinate = util.wktCastGeom(location).getFirstCoordinate()
-        this.kmap = new KMap.Map(target,level,coordinate[0], coordinate[1],null,10,22);
-        let xyz = config.base_img_url + 'map/lby/{z}/{x}/{y}.png';
-        this.kmap.addXYZLayer(xyz,{minZoom:15,maxZoom:22});
-        let xyz2 = config.base_img_url3 + 'map/lby/{z}/{x}/{y}.png';
-        this.kmap.addXYZLayer(xyz2,{minZoom:12,maxZoom:22});
-        this.kmap.addLayer(this.areaLayer.layer)
-        this.kmap.addLayer(this.treeLayer.layer)
-        this.kmap.addLayer(this.areaPointLayer.layer)
-    }
-
-    initArea(organId, callback){
-        let that = this
-        this.areaLayer.refresh()
-        VE_API.area.list({organId}).then(({data,code})=>{
-            for(let item of data){
-                that.areaLayer.addFeature(newAreaFeature(item))
-                that.areaPointLayer.addFeature(newAreaPoint(item))
-            }
-            callback && callback()
-        })
-    }
-
-
-    initTree(organId, callback){
-        let that = this
-        this.treeLayer.refresh()
-        that.treeFeatures = []
-        VE_API.tree.treeList({organId,areaId:-1}).then(({data,code})=>{
-            for(let item of data){
-                let point = newPoint(item);
-                that.treeFeatures.push(point)
-                that.treeLayer.addFeature(point)
-            }
-            callback && callback()
-        })
-    }
-
-    addToggleTreeSelect(listener){
-        let that = this
-        let selectStyle = this.vectorStyle.getPointSimpleStyle(8,"#cc3f2e","#e18b7c","2")
-        this.treeLayer.addToggleSelect(function({deselected,selected, preventDefault}){
-            if(selected.length > 0){
-                listener && listener(selected[0],deselected[0])
-            }
-            preventDefault()
-        },this.kmap.map, selectStyle)
-        that.treeLayer.toggleSelect.setActive(false)
-    }
-
-    addToggleAreaSelect(listener){
-        let that = this
-        this.areaLayer.addToggleSelect(function({deselected,selected,preventDefault}){
-            if(selected.length > 0){
-                that.treeLayer.source.forEachFeature((f)=>{
-                    if(f.get("areaId") == selected[0].get("id")){
-                        that.treeLayer.toggleSelect.getFeatures().remove(f)
-                    }
-                })
-                that.treeLayer.source.forEachFeature((f)=>{
-                    if(f.get("areaId") == selected[0].get("id")){
-                        that.treeLayer.toggleSelect.getFeatures().push(f)
-                    }
-                })
-            }
-            if(deselected.length > 0){
-                that.treeLayer.source.forEachFeature((f)=>{
-                    if(f.get("areaId") == deselected[0].get("id")){
-                        that.treeLayer.toggleSelect.getFeatures().remove(f)
-                    }
-                })
-            }
-            listener && listener(selected[0],deselected[0])
-            preventDefault()
-        },this.kmap.map)
-        that.areaLayer.toggleSelect.setActive(false)
-
-    }
-
-    setTreeStyle(style){
-        this.treeLayer.layer.setStyle(style)
-        this.treeLayer.layer.changed()
-    }
-    fit(geomOrExtent){
-        this.kmap.fit(geomOrExtent)
-    }
-}
-
-export default AllotNsMap

src/views/ns_allot/components/NsItem.vue

@@ -1,127 +0,0 @@
-<template>
-<div class="main">
-  <div class="head">
-    <div class="iconBox">
-    </div>
-    <div class="label">
-      <div class="name">
-        <template v-for="(name,index) in rowData.nsTypeNames" :key="index">
-          <template v-if="index != 0">、</template>{{name}}
-        </template>
-      </div>
-      <div class="date_title">执行时间</div>
-      <div class="exec_date">
-        <template v-for="(date,index) in rowData.execDate" :key="date">
-          <template v-if="index != 0">、</template>{{dateFormat(new Date(date),'mm月dd日')}}
-        </template>
-      </div>
-    </div>
-  </div>
-  <div class="exec_area">执行区域:
-    <template v-for="(name,index) in rowData.areaNames" :key="index">
-      <template v-if="index != 0">、</template>{{name}}
-    </template>
-  </div>
-  <div class="table">
-    <div class="thead">
-      <div class="th">序号</div>
-      <div class="th">药物名称</div>
-      <div class="th">药物配比/倍</div>
-      <div class="th">药物用量ml</div>
-    </div>
-    <div class="tbody">
-      <div v-for="(item,index) in rowData.drugList" :key="item.drugId" class="row">
-        <div class="col">药物{{index + 1}}</div>
-        <div class="col">{{item.drugName}}</div>
-        <div class="col">1 : {{item.peibi}}</div>
-        <div class="col">{{item.yongliang}} ml/g</div>
-      </div>
-    </div>
-  </div>
-</div>
-</template>
-
-<script setup>
-import {useRoute, useRouter} from "vue-router";
-import {dateFormat} from "../../../utils/date_util";
-
-const emits = defineEmits(["addNsRecord"])
-const router = useRouter();
-const route = useRoute()
-const props = defineProps({
-  rowData:{
-    type:Object,
-    required:true
-  }
-})
-
-function edit(){
-  emits("addNsRecord",props.rowData.id)
-}
-</script>
-
-<style lang="scss" scoped>
-@import "./table";
-@import "../../../styles/index";
-.main{
-  @include wh(calc(100% - 9px),auto);
-  border: 1px solid rgba(81,233,240,0.6);
-  padding: 9px;
-  box-sizing: border-box;
-  margin-left: 9px;
-  margin-top: 9px;
-  .head{
-    @include wh(calc(100%),61px);
-    .iconBox{
-      float: left;
-      @include wh(61px,61px);
-      background: #023D3C;
-      border: 1px solid rgba(2,240,235,0.67);
-      padding: 5px;
-      box-sizing: border-box;
-    }
-    .label{
-      float: right;
-      @include wh(calc(100% - 61px - 6px),61px);
-      @include ossBg("after_bg1.png");
-      position: relative;
-      .name{
-        @include wh(auto,16px);
-        @include LeftTop(26px,10px);
-        font-weight: 500;
-        font-size: 16px;
-        color: #FFFFFF;
-      }
-      .date_title{
-        @include wh(auto,12px);
-        @include LeftTop(25px,32px);
-        font-family: DOUYU;
-        font-weight: normal;
-        font-size: 16px;
-        color: #FFF116;
-      }
-      .exec_date{
-        @include wh(auto,12px);
-        @include LeftTop(97px,32px);
-        font-family: PingFang SC;
-        font-weight: 500;
-        font-size: 16px;
-        color: #00DCC6;
-      }
-      .edit-btn{
-        position: absolute;
-        top:10px;
-        right:30px;
-        color:#ffffff;
-      }
-    }
-  }
-  .exec_area{
-    margin:9px 0px 9px 0px;
-    @include wh(auto,16px);
-    font-weight: normal;
-    font-size: 16px;
-    color: #FF5926;
-  }
-}
-</style>

src/views/ns_allot/components/Nslb.vue

@@ -1,107 +0,0 @@
-<template>
-  <div style="border: 1px solid rgba(81,233,240,0.6); box-sizing: border-box">
-    <Title title="农事列表">
-      <template v-slot:title-slot>
-      </template>
-    </Title>
-    <div class="chatsTabs yse-events">
-      <div class="lbtn"><div class="text" :class="[status == STATUS_ENUM.STAY_SEND ? 'active' : '']"  @click="changeTabs(STATUS_ENUM.STAY_SEND)">待分发</div></div>
-      <div class="btn"><div class="text"  :class="[status == STATUS_ENUM.STAY_EXECUTE ? 'active' : '']" @click="changeTabs(STATUS_ENUM.STAY_EXECUTE)">执行中</div></div>
-      <div class="rbtn"><div class="text" :class="[status == STATUS_ENUM.HAVE_CHECK ? 'active' : '']" @click="changeTabs(STATUS_ENUM.HAVE_CHECK)">已完成</div></div>
-    </div>
-    <div class="nslb yse-events">
-      <template v-for="item in tableData" :key="item.id">
-        <NsItem @click="selectNsItem(item.id)" :rowData="item" :style=" (activeId == item.id  ? 'background:#033C49;' : '')" ></NsItem>
-      </template>
-    </div>
-    <div class="btn-layout">
-    </div>
-  </div>
-</template>
-<script setup>
-import {onMounted, ref, reactive, toRefs} from "vue";
-import {useStore} from "vuex";
-import Title from "../../components/title";
-import {NS_RECORD_STATUS_ENUM as STATUS_ENUM} from "../../../api/enum"
-import NsItem from "./NsItem";
-
-const emits = defineEmits(["selectNsItem"])
-let store = useStore();
-let userInfo = store.getters.userinfo
-
-const activeId = ref(null)
-const tableData = ref([]);
-const params = reactive({
-  organId:userInfo.curGardenId,
-  name: "",
-  limit: 10,
-  page: 1,
-  total: 0,
-  status: STATUS_ENUM.STAY_SEND
-});
-const { name, limit, page, total , status} = toRefs(params);
-
-onMounted(async () => {
-  getDataList()
-})
-
-function changeTabs(e){
-  status.value = e
-  getDataList()
-}
-
-function selectNsItem(id){
-  if(activeId.value == id)
-    return
-  activeId.value = id
-  emits("selectNsItem",id)
-}
-
-function reset(){
-  getDataList()
-  activeId.value = null
-}
-/**
- * @description: 获取列表数据
- * @param {*}
- * @return {*}
- */
-const getDataList = async () => {
-  const { code, data, count } = await VE_API.nsjy.page(params);
-  if (code == 0 || code == 1) {
-    tableData.value = data;
-    total.value = count;
-  }
-};
-
-defineExpose({reset})
-
-
-</script>
-
-<style lang="scss" scoped>
-@import "../../../styles/chatsTabs";
-@import "../../../styles/index";
-
-.nslb{
-  @include wh(auto,calc(100% - 48px - 48px - 45px));
-  overflow-y: scroll;
-}
-.btn-layout{
-  @include wh(auto,calc(45px));
-  border-top: 1px solid rgba(81,233,240,0.6);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-around;
-  .big-btn{
-    @include wh(70%, 45px);
-    font-size: 20px;
-    border-radius: 5px;
-    background: #13C4CD;
-    border: 1px solid rgba(81,233,240,1);
-    color: #ffffff;
-  }
-}
-
-</style>

src/views/ns_allot/components/table.scss

@@ -1,94 +0,0 @@
-@import "../../../styles/index.scss";
-.table{
-  @include wh(calc(100%),auto);
-  border: 1px solid #16494f;
-  border-radius: 5px;
-  box-sizing: border-box;
-  .title{
-    @include wh(100px,26px);
-    line-height: 26px;
-    font-size: 16px;
-    font-weight: bold;
-    padding: 5px;
-  }
-  .thead{
-    min-height: rpx(50);
-    display: flex;
-    border-bottom: 1px solid #009a8c;
-    box-sizing: border-box;
-    color: #e6e6e6;
-    .th{
-      @include wh(calc(33% - 20px),rpx(50));
-      line-height: rpx(50);
-      text-align: center;
-      border-right: 1px solid #009a8c;
-      box-sizing: border-box;
-      background-color: #009a8c40;
-    }
-    .th:first-child{
-      border-top-left-radius: 5px;
-    }
-    .th:last-child{
-      border-top-right-radius: 5px;
-    }
-    .notopborder{
-      border-top: none;
-    }
-  }
-  .tbody{
-    @include wh(100%,auto);
-    font-size: 16px;
-    color: #00DCC6;
-    .row{
-      display: flex;
-      border-bottom: 1px solid #009a8c;
-      box-sizing: border-box;
-      .col{
-        @include wh(calc(33% - 20px),rpx(60));
-        line-height: rpx(60);
-        border-right: 1px solid #009a8c;
-        text-align: center;
-        box-sizing: border-box;
-        .com{
-          float: left;
-          width: calc(100% - 35px);
-          border: none;
-          padding: 0px;
-          color: #009a8c;
-          background-color: transparent;
-          line-height: rpx(60);
-        }
-        .prefix{
-          float: left;
-          width: 35px;
-        }
-      }
-      .col:first-child{
-        border-left: 1px solid #009a8c;
-      }
-      .notopborder{
-        border-top: none;
-      }
-    }
-    .row:last-child{
-      border-bottom: 1px solid #009a8c;
-      box-sizing: border-box;
-    }
-  }
-}
-
-.my-select{
-  margin: 0px 5px 0px 5px;
-  background-color: transparent;
-  border: none;
-  color: #009a8c;
-  width: calc(100% - 5px - 5px);
-  line-height: rpx(60);
-  .my-option{
-    color: #009a8c;
-    background-color: transparent;
-    border: none;
-    line-height: rpx(60);
-  }
-}
-

src/views/ns_allot/index.vue

@@ -1,366 +0,0 @@
-<!--
- * @Author: your name
- * @Date: 2021-01-18 15:46:34
- * @LastEditTime: 2021-11-30 18:54:36
- * @LastEditors: Please set LastEditors
- * @Description: In User Settings Edit
- * @FilePath: \vue3-element-admin\src\views\Home.vue
--->
-<template>
-  <div class="container2">
-    <div class="mainDiv">
-      <Nslb @selectNsItem="selectNsItem" ref="nslbRef" :key="nslbUpdate" class="leftBox"></Nslb>
-      <div class="rightBox">
-        <div class="head">
-          <div class="item1">
-            <div class="warning"></div>
-            <div class="warning"></div>
-            <div class="warning"></div>
-            <template v-if="day > 0">
-              执行时间还剩<font style="color:#ffffff;">{{day}}</font>天
-            </template>
-            <template v-if="day < 0">
-              农事任务已经开始<font style="color:#ffffff;">{{-day}}</font>天
-            </template>
-            <template v-if="day == 0">
-              执行时间就在今天
-            </template>
-          </div>
-          <div class="item2">
-            <font style="color:#ffffff;">执行区域：</font>
-            <template v-for="(item,index) in areaArr">
-              <template v-if="index != 0">、</template>{{item.name}}
-            </template>
-            <template v-if="execStyle">
-              <font style="color:#ffffff;">执行方式：</font>{{execStyle == 1 ?'无人机':'人工'}}
-            </template>
-          </div>
-        </div>
-        <div class="map" ref="mapRef"></div>
-        <div class="foot">
-          <div class="row">工人分配详情
-            <el-button v-if="nsRecordStatus == STARUS_ENUM.STAY_SEND"
-                       size="large"
-                       color="#03232d"
-                       class="submit"
-                       @click="submit"
-                       type="primary" >确定下发</el-button>
-          </div>
-          <template v-for="item in areaArr" :key="item.id">
-            <div class="row">
-              {{item.name}}({{areaTreeCountMap[item.id].count}}棵树）责任人：
-              <select class="select" @change="changeWorkerTel(item.id)"
-                      :disabled="nsRecordStatus != STARUS_ENUM.STAY_SEND"
-                      v-model="allotMap[item.id].workerTel">
-                <option  value="" >请选择</option>
-                <option v-for="item in workerList" :key="item.tel"  :value="item.tel" >{{item.name}}</option>
-              </select>
-              <font class="font2">(建议人数5)</font>
-            </div>
-            <div class="row">
-              <div class="item" v-for="item in allotMap[item.id].executorList" :key="item.executor">
-                {{item.name}}
-                <div v-if="nsRecordStatus == STARUS_ENUM.STAY_SEND"  class="close cursor-pointer"
-                     @click="removeExecutor(item)">x</div>
-              </div>
-            </div>
-          </template>
-        </div>
-      </div>
-    </div>
-  </div>
-
-</template>
-
-<script setup>
-import {useStore} from "vuex"
-import { ElMessage,ElMessageBox  } from 'element-plus'
-import {onMounted, ref, reactive, toRefs, provide, inject , watch, computed} from "vue";
-import config from "@/api/config.js"
-import {NS_RECORD_STATUS_ENUM as STARUS_ENUM} from "../../api/enum"
-import {useRoute, useRouter} from "vue-router";
-import {dateFormat,GetDateDiff} from "../../utils/date_util"
-import Title from "../components/title";
-import AllotNsMap from "./AllotNsMap";
-import Nslb from "./components/Nslb"
-
-const emit = defineEmits(["back"])
-
-const selectDateObj = ref({})
-
-const router = useRouter();
-const route = useRoute()
-const nslbRef = ref(null)
-const nsDrugList = ref([])
-const nsTypeList = ref([])
-const store = useStore()
-const nslbUpdate = ref(1)
-const location = store.getters.userinfo.location
-const organId = store.getters.userinfo.curGardenId
-const workerList = ref([])
-const mapRef=ref(null)
-
-const execDate = ref(null)
-const treeIds = ref([])
-const areaIds = ref([])
-const execStyle = ref(null)
-const areaTreeCountMap = ref({}) // 区树的数量map
-const areaArr = ref([])//区的map
-const day = ref(null)//
-
-const nsRecordId = ref(null)
-const nsRecordStatus = ref(null)
-const allotMap = ref({})
-
-const kmap = new AllotNsMap()
-onMounted(()=>{
-  initWorker()
-  kmap.initMap(location, mapRef.value)
-  kmap.addToggleAreaSelect()
-  kmap.addToggleTreeSelect()
-  kmap.initArea(organId, ()=>{
-    kmap.initTree(organId, ()=>{
-    })
-  })
-})
-
-//重置选择
-function resetSelectNsItem(){
-  nsRecordId.value = null
-  nsRecordStatus.value = null
-  execDate.value =  []
-  day.value = null
-  treeIds.value = []
-  areaIds.value = []
-  areaArr.value = []
-  execStyle.value = []
-  nslbUpdate.value = nslbUpdate.value + 1
-  loadSelectArea()
-  loadSelectTree()
-}
-
-//选择农事
-function selectNsItem(id){
-  VE_API.nsjy.getNsRecord({id}).then(({data})=>{
-    nsRecordId.value = id
-    nsRecordStatus.value = data.status
-    execDate.value = data.execDate ? data.execDate : []
-    if(data.execDate && data.execDate.length > 0){
-      day.value = GetDateDiff(new Date(), new Date(data.execDate[0]),"day")
-    }
-    treeIds.value = data.treeIds
-    areaIds.value = data.areaIds
-    execStyle.value = data.execStyle
-    loadSelectArea()
-    loadSelectTree()
-    loadWorkerTels()
-  })
-}
-//加载areaIds 数据选中
-function loadSelectArea(){
-  let arr = []
-  kmap.areaLayer.toggleSelect.getFeatures().clear()
-  if(areaIds.value == 0){
-    return
-  }
-  kmap.areaLayer.source.forEachFeature((f)=>{
-    let res = areaIds.value.find((id)=> f.get("id") == id)
-    if(res){
-      arr.push({id:f.get("id"),name:f.get("name")})
-      allotMap.value[f.get("id")] = {id:"",workerTel:"",areaId:f.get("id"),nsRecordId: nsRecordId.value, executorList:[]}
-      kmap.areaLayer.toggleSelect.getFeatures().push(f)
-    }
-  })
-  areaArr.value = arr
-}
-
-function loadWorkerTels(){
-  VE_API.ns_record_allot.list({nsRecordId:nsRecordId.value}).then(({data})=>{
-    for(let key in allotMap.value){
-      let obj = data.find((item)=> item.areaId == key)
-      if(obj){
-        allotMap.value[key] = obj
-      }
-    }
-  })
-}
-
-//加载treeIds 数据选中
-function loadSelectTree(){
-  let i = 0
-  kmap.treeLayer.toggleSelect.getFeatures().clear()
-  if(!treeIds.value && treeIds.value.length == 0){
-    return
-  }
-  let areaMap = {}
-  kmap.treeFeatures.forEach((f)=>{
-    while(i < treeIds.value.length){
-      if(f.get("id") === treeIds.value[i]){
-        if(areaMap[f.get("areaId")] == null){
-          areaMap[f.get("areaId")] = {count:1}
-        }else{
-          areaMap[f.get("areaId")]["count"]++
-        }
-        kmap.treeLayer.toggleSelect.getFeatures().push(f)
-        i++
-      }
-      break
-    }
-  })
-  areaTreeCountMap.value = areaMap
-}
-
-function changeWorkerTel(areaId){
-  let form = allotMap.value[areaId]
-  VE_API.ns_record_allot.save(form).then(()=>{
-    loadWorkerTels()
-  })
-}
-
-function removeExecutor(item){
-  VE_API.ns_record_allot_executor.remove({allotId: item.allotId, executor: item.executor}).then(({code})=>{
-    if(code == 0)
-      selectNsItem(nsRecordId.value)
-  })
-}
-
-function submit(){
-  VE_API.nsjy.sendStayExecute({id:nsRecordId.value, status: STARUS_ENUM.STAY_EXECUTE}).then(({code})=>{
-    if(code == 0){
-      nslbUpdate.value++
-      resetSelectNsItem()
-      nslbRef.value.reset()
-    }
-  })
-}
-
-
-function initWorker(){
-  VE_API.garden_worker.list({organId:organId}).then(({data})=>{
-    workerList.value = data
-  })
-}
-
-</script>
-
-<style lang="scss" scoped>
-@import "../../styles/index.scss";
-.container2{
-  height: 100%;
-  width: 100%;
-  z-index: 2;
-  position: absolute;
-}
-.mainDiv{
-  position: absolute;
-  top:100px;
-  bottom: 50px;
-  left: 20px;
-  right: 20px;
-  .leftBox{
-    float: left;
-    width: 500px;
-    height: calc(100%);
-  }
-  .rightBox{
-    float: right;
-    width: calc(100% - 500px - 12px);
-    height: 100%;
-    background: #032C3940;
-    border-radius: 4px;
-    border: 1px solid rgba(81, 233, 240, 0.6);
-    box-sizing: border-box;
-    .head{
-      margin: 19px 0px 0px 19px;
-      @include wh(calc(100% - 19px - 19px),calc(40px));
-      font-family: DOUYU;
-      font-weight: normal;
-      font-size: 22px;
-      color: #FF5926;
-      .item1{
-        float: left;
-        @include wh(489px,40px);
-        @include ossBg("item1.png");
-        display: flex;
-        align-items: center;
-        padding-left: 10px;
-        .warning{
-          @include wh(29px,25px);
-          @include ossBg("warning.png");
-        }
-      }
-      .item2{
-        float: left;
-        @include wh(489px,40px);
-      }
-    }
-    .map{
-      margin: 19px 0px 0px 19px;
-      @include wh(calc(100% - 19px - 19px),calc(100% - 40px - 300px - 19px - 19px))
-    }
-    .foot{
-      position: relative;
-      margin: 19px 0px 0px 19px;
-      @include wh(calc(100% - 19px - 19px),calc(300px));
-      font-family: DOUYU;
-      font-weight: normal;
-      font-size: 22px;
-      color: #FFFFFF;
-      .submit{
-        width: 200px;
-        position: absolute;
-        right: calc(100px);
-        bottom: 50px;
-      }
-      .row{
-        height: 39px;
-        display: flex;
-        align-items: center;
-        .select{
-          border-radius: 5px;
-          text-align: center;
-          width: 150px;
-          background: rgba(10,236,255,0.21);
-          color: #59EBFF;
-        }
-        .font2{
-          font-family: PingFang SC;
-          font-weight: 800;
-          font-size: 22px;
-          color: #FF5926;
-          margin-left: 10px;
-        }
-        .item{
-          position: relative;
-          @include wh(100px,34px);
-          background: #0AECFF;
-          border-radius: 5px;
-          border: 1px solid #59EBFF;
-          margin-left: 18px;
-          color: #023236;
-          font-size: 16px;
-          line-height: 34px;
-          text-align: center;
-          font-weight: bold;
-          .close{
-            position: absolute;
-            right:-7px;
-            top:-7px;
-            @include wh(15px,15px);
-            background: #FF5926;
-            color: #ffffff;
-            border-radius: 50%;
-            text-align: center;
-            line-height: 15px;
-            font-size: 12px;
-          }
-        }
-        .item:first-child{
-          margin-left: 0px;
-        }
-      }
-    }
-  }
-}
-
-</style>