农事操作隐藏后四个，地图模式2d改为3d

guoshilong

2022-11-08 082613d446e29e4ec1c16bfaa52345106a498b23

 src/views/wel/index.vue

@@ -2,8 +2,18 @@
    <div class="home">
        <div class="left">
            <div class="farm-info">
                <div class="farm-title">农场概览</div>
                <div class="statis">
              <div class="farm-title">农场概览</div>
<!--              <div class="statis" style="padding-left: 50px">-->
<!--                <el-select v-model="farm.id" placeholder="请选择所属农场" filterable @change="farmChange">-->
<!--                  <el-option-->
<!--                    v-for="item in farmList"-->
<!--                    :key="item.id"-->
<!--                    :label="item.farmName"-->
<!--                    :value="item.id">-->
<!--                  </el-option>-->
<!--                </el-select>-->
<!--              </div>-->
              <div class="statis">
                    <div class="echarts-statis">
                        <el-progress
                            type="circle"
@@ -16,7 +26,7 @@
                    </div>
                    <div class="percentText">
                        <p>地块使用率</p>
                        <p style="position: relative; top: -12px">
                        <p>
                            <span
                                style="font-size: 32px; font-weight: 550; margin-top: -10px"
                            >{{ landInfo.rate || 0 }}</span>%
@@ -27,7 +37,7 @@
                        <div class="land-statis">
                            <div class="land-title">地块总面积</div>
                            <div class="land-num">
                                <span>{{ landInfo.zarea }}</span>&nbsp;亩
                                <span>{{  landInfo.zarea }}</span>&nbsp;亩
                            </div>
                        </div>
                        <div class="land-statis">
@@ -43,8 +53,8 @@
                            </div>
                        </div>
                    </div>
                    <div class="map-view">
                        <img src="../../../public/img/map.png" />
                    <div class="map-view" @click="goToMapModel">
                        <img src="../../../public/img/map.png"  />
                        <div class="title">农场地图→</div>
                    </div>
                </div>
@@ -65,7 +75,26 @@
                            <el-button plain size="small" @click="recovery(item)">
                                <span style="color: #5abf78">采收</span>
                            </el-button>
                            <el-button plain size="small" @click="over(item.id)">结束</el-button>
                            <!-- <el-button plain size="small" @click="over(item.id)">结束</el-button> -->
                            <el-button plain size="small" @click="over(item)">结束</el-button>
                        </div>
                    </div>
                    <!-- 秧苗 -->
                    <div class="farm" v-for="(item, index) in farmPlanListYM" :key="index">
                        <div class="farm-img" @click="recoveryDetail(item)">
                            <img :src="item.url" class="img" />
                        </div>
                        <div class="cai">{{ item.strainName }}(秧苗)</div>
                        <div class="area">
                            种植面积：
                            <span>{{ item.area }}</span>亩
                        </div>
                        <div class="btn">
                            <el-button plain size="small" @click="plant(item)">
                                <span style="color: #5abf78">移栽</span>
                            </el-button>
                            <!-- <el-button plain size="small" @click="over(item.id)">结束</el-button> -->
                            <el-button plain size="small" @click="over(item)">结束</el-button>
                        </div>
                    </div>
                </div>
@@ -157,32 +186,38 @@
            </div>
        </div>
        <!-- 弹窗, 采收 -->
        <recovery v-if="recoveryVisible" ref="recovery"></recovery>
        <recovery v-if="recoveryVisible" ref="recovery" :farmDetail="farm"></recovery>
        <!-- 弹窗，结束种养-->
        <over v-if="overVisible" ref="over" @refreshOnLoad="refreshAll"></over>
        <!-- 圈地 -->
        <land v-if="landVisible" ref="land"></land>
        <land v-if="landVisible" ref="land" @refreshOnLoad="refreshAll"></land>
        <!-- 种养品 -->
        <plant v-if="plantVisible" ref="plant" @refreshOnLoad="onLoad"></plant>
        <plant v-if="plantVisible" ref="plant" @refreshOnLoad="refreshAll"></plant>
        <!-- 农事操作 -->
        <farming v-if="farmingVisible" ref="farming"></farming>
        <farming v-if="farmingVisible" ref="farming" @refreshOnLoad="refreshAll"></farming>
        <!-- 农资入库 -->
        <stock v-if="stockVisible" ref="stock"></stock>
        <stock v-if="stockVisible" ref="stock" @refreshOnLoad="refreshAll"></stock>
    </div>
</template>

<script>
import { mapGetters } from "vuex"
import { getList, update } from "@/api/farmplant/farmplant"
import { getList, update,getStrainCount,getStrainCountYM } from "@/api/farmplant/farmplant"
import { getFarmingCount, getFarmingStatis } from "@/api/farm/farmingrecord"
import { selectCount } from "@/api/land/land"
import { StockCount } from "@/api/stock/stock"
import {getFarmList} from "@/api/farm/farm";
import recovery from "./recovery.vue"
import over from "./over.vue"
import land from "./land.vue"
import plant from "./plant.vue"
import farming from "./farming.vue"
import stock from "./stock.vue"
import fixed from "@/util/mathHandler"
export default {
    components: {
        recovery,
        over,
        land,
        plant,
        farming,
@@ -194,12 +229,17 @@
            farmingList: [],
            stockList: [],
            isFarmingDetail: false,
            isStockDetail: false,
            landInfo: {},
            farm:{},
            farmList:[],
            customColor: "#5ABF78",
            total: 0,
            farmingCount: 0,
            farmPlanList: [],
            farmPlanListYM:[],
            recoveryVisible: false,
            overVisible:false,
            landVisible: false,
            plantVisible: false,
            farmingVisible: false,
@@ -211,9 +251,24 @@
        }
    },
    computed: {
        ...mapGetters(["userInfo"]),
        ...mapGetters(["userInfo","$farmId"]),
    },
    created () {
  created () {

        this.$EventBus.$on('getFarmObj', (farmObj)=>{
            // this.$nextTick(() => {
            //     this.$EventBus.$emit("setFarmId", farmObj.id);
            // });
            setTimeout(() => {
                this.$EventBus.$emit("setFarmId", farmObj.id);
            }, 100);
        })


        //初始化农场信息
        // let farmId = this.userInfo.$farmId
        this.farm.id = this.$farmId
        this.initData(this.userInfo.tenant_id);
        //地块使用率统计
        this.getCountStatis()
        //采收列表
@@ -223,12 +278,66 @@
        //本年农事操作记录,分组
        this.getFarmingStatis()
        this.StockCount()

    },
    methods: {
  watch: {
    '$farmId':{
      handler (newName, oldName) {
        this.farm.id = newName

        setTimeout(() => {
        //农场概览 地块使用率
        this.getCountStatis ()
        //本年农事操作记录
        this.getFarmingCount()
        //本年农事操作记录,分组
        this.getFarmingStatis()
        this.StockCount()
        //当前农场种养品种
        this.onLoad()
        }, 100);

      }
    }
  },
  methods: {
      //获取农场信息
        initData(tenantId) {
          const data = {
            deptId:this.userInfo.dept_id
          }
          getFarmList(data).then(res => {
            this.farmList = this.farmList.concat(res.data.data)
          });
        },
        refreshAll(){
            this.getCountStatis ()
            //本年农事操作记录
            this.getFarmingCount()
            //本年农事操作记录,分组
            this.getFarmingStatis()
            this.StockCount()
            //当前农场种养品种
            this.onLoad()
        },
        //农场下拉框change事件
        farmChange(data) {
          this.farm.id = data
          //更新农场数据
          //农场概览 地块使用率
          this.getCountStatis ()
          //当前农场种养品种
          this.onLoad()
          //本年农事操作记录
          // this.getFarmingCount()
          //农资库存
          // this.StockCount()

        },
        //本年农事操作记录
        getFarmingCount () {
            var that = this
            getFarmingCount(this.userInfo.farmId).then((res) => {
            getFarmingCount(this.$farmId).then((res) => {
                that.total = res.data.data
                // that.total = 0;
                if (that.total > 0) {
@@ -239,23 +348,30 @@
        //本年农事操作记录，分组统计
        getFarmingStatis () {
            var that = this
            getFarmingStatis(this.userInfo.farmId).then((res) => {
            getFarmingStatis(this.$farmId).then((res) => {
                that.farmingList = res.data.data
            })
        },
        //农资库存
        StockCount () {
            var that = this
            StockCount(this.userInfo.farmId).then((res) => {
                that.stockList = res.data.data
                console.log(that.stockList)
            StockCount(this.$farmId).then((res) => {
                that.stockList = res.data.data.filter((e)=>{
                    return e.val != 0
                })
                that.stockList.forEach((e)=>{
                    e.val = fixed.fixedNum(e.val)
                })
            })
        },
        //地块使用率统计
        getCountStatis () {
            var that = this
            selectCount(this.userInfo.farmId).then((res) => {
            selectCount(this.farm.id).then((res) => {
                var data = res.data.data
                that.landInfo = data
                that.landInfo.zarea = fixed.fixedNum(that.landInfo.zarea)
                that.landInfo.sarea = fixed.fixedNum(that.landInfo.sarea)
            })
        },
        handleChange (val) {
@@ -267,10 +383,21 @@
                status: 1,
            }
            params['tenantId'] = this.userInfo.tenant_id
            params['farmId'] = this.userInfo.farmId
            getList(1, 10, Object.assign(params)).then((res) => {
                const data = res.data.data
                this.farmPlanList = data.records
            params['farmId'] = this.farm.id
            getStrainCount(1, 100, Object.assign(params)).then((res) => {
                const data = res.data.data.records
                this.farmPlanList = data
                this.farmPlanList.forEach((e)=>{
                    e.area = fixed.fixedNum(e.area)
                })
            })

            getStrainCountYM(1, 100, Object.assign(params)).then((res) => {
                const data = res.data.data.records
                this.farmPlanListYM = data
                this.farmPlanListYM.forEach((e)=>{
                    e.area = fixed.fixedNum(e.area)
                })
            })
        },
        //采收
@@ -280,30 +407,13 @@
                this.$refs.recovery.init(data)
            })
        },
        //结束种植
        over (id) {
            var that = this
            this.$confirm("确定结束当前种植的农产品?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
        //结束种养
        over(data) {
            this.overVisible = true
            this.$nextTick(() => {
                this.$refs.over.initData(data,this.farm.id)
            })
                .then(() => {
                    const data = {
                        id: id,
                        status: 2,
                    }
                    return update(data)
                })
                .then(() => {
                    that.onLoad()
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                })
        },
        //圈地
        land () {
            this.landVisible = true
            this.$nextTick(() => {
@@ -311,10 +421,10 @@
            })
        },
        //种植
        plant () {
        plant (item) {
            this.plantVisible = true
            this.$nextTick(() => {
                this.$refs.plant.init()
                this.$refs.plant.init(item)
            })
        },
        //农事操作
@@ -348,7 +458,6 @@
        },
        //本年农事操作明细--有参
        farmPlantDetails (item) {
            console.log(item, 11111)
            const data = {
                type: item.value,
                activeName: "tab2",
@@ -394,6 +503,13 @@
                query: data,
            })
        },
        //进入地图模式
        goToMapModel () {
            this.$router.push({
                path: `/mapPattern`,
                // query: row,
            })
        }
    },
};
</script>
@@ -445,8 +561,8 @@

                .percentText {
                    position: relative;
                    left: -16%;
                    top: 57px;
                    left: -15.8%;
                    top: 77px;
                    width: 90px;
                    font-size: 16px;
                    text-align: center;
@@ -462,7 +578,7 @@

                    .land-statis {
                        width: 33%;
                        margin: 3% 8%;
                        margin: 3% 3%;

                        .land-num {
                            margin-top: 20px;