智慧农业后台管理页面
guoshilong
2022-11-08 082613d446e29e4ec1c16bfaa52345106a498b23
src/views/land/cs.vue
@@ -75,6 +75,24 @@
                <div class="land-img">
                    <img v-if="item.url" :src="item.url" class="landimg" />
                    <img v-else src="../../../public/img/bg/noimage.jpg" class="landimg" />
                    <!-- <div v-for="(url,index) in item.urls" :key="index" class="strainimg">
                        <img  v-if="url" :src="url" width="30px" height="30px"  />
                    </div>-->
                    <div
                        v-if="item.urls.length >0"
                        class="strainimg"
                        :class="{strainimg1:item.urls.length==1,strainimg2:item.urls.length==2,strainimg3:item.urls.length==3,strainimg4:item.urls.length==4,strainimg5:item.urls.length>=5}"
                    >
                        <img
                            v-for="(url,index) in item.urls"
                            :key="index"
                            :src="url"
                            width="30px"
                            height="30px"
                        />
                    </div>
                    <!-- <img
                        src="../../../public/img/97ae6951541f46e1bb2468adb5d69403.png"
                        class="pzIcon"
@@ -144,22 +162,23 @@
        '$farmId': {
            handler (newName, oldName) {
                // this.farm.id = newName
                this.page.currentPage = 1
                //地块页面
                setTimeout(() => {
                    this.onLoad()
                }, 100);
                }, 100)
            }
        }
    },
    created () {
        this.$EventBus.$on('getFarmObj', (farmObj)=>{
        this.$EventBus.$on('getFarmObj', (farmObj) => {
            // this.$nextTick(() => {
            //     this.$EventBus.$emit("setFarmId", farmObj.id);
            // });
            setTimeout(() => {
                this.$EventBus.$emit("setFarmId", farmObj.id);
            }, 100);
                this.$EventBus.$emit("setFarmId", farmObj.id)
            }, 100)
        })
        this.onLoad(this.page)
    },
@@ -219,8 +238,14 @@
                const data = res.data.data
                this.page.total = data.total
                this.farmPlanList = data.records
                this.farmPlanList.forEach((e)=>{
                this.farmPlanList.forEach((e) => {
                    e.landArea = fixed.fixedNum(e.landArea)
                    if (e.strainUrl == "") {
                        e["urls"] = []
                    } else {
                        e["urls"] = e.strainUrl.split(",")
                    }
                })
            })
        },
@@ -359,4 +384,40 @@
.edit {
    padding-left: 13px;
}
.strainimg {
    position: absolute;
    // display:flex;
    // align-content:center
    // flex-direction: row;
    // align-items: center;
}
.strainimg1 {
    width: 31px;
    top: 45%;
    left: 45%;
}
.strainimg2 {
    width: 60px;
    top: 45%;
    left: 40%;
}
.strainimg3 {
    width: 60px;
    top: 38%;
    left: 36%;
}
.strainimg4 {
    width: 60px;
    top: 38%;
    left: 36%;
}
.strainimg5 {
    width: 90px;
    top: 38%;
    left: 30%;
}
.strainimg img {
    border-radius: 50%;
}
</style>