From 3d246e2571ca60eb71e5060a1eee2e95e7235ca7 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 18 Jul 2022 11:55:42 +0800
Subject: [PATCH] bufen
---
src/views/wel/index.vue | 1554 +++++++++++++++++++++++++++++-----------------------------
1 files changed, 779 insertions(+), 775 deletions(-)
diff --git a/src/views/wel/index.vue b/src/views/wel/index.vue
index 63df300..6b249e4 100644
--- a/src/views/wel/index.vue
+++ b/src/views/wel/index.vue
@@ -1,825 +1,829 @@
<template>
- <div class="home">
- <div class="left">
- <div class="farm-info">
- <div class="farm-title">农场概览</div>
- <div class="statis">
- <div class="echarts-statis">
- <el-progress
- type="circle"
- :percentage="landInfo.rate"
- :stroke-width="15"
- :width="150"
- :color="customColor"
- :show-text="false"
- ></el-progress>
- </div>
- <div class="percentText">
- <p>地块使用率</p>
- <p style="position: relative; top: -12px">
- <span
- style="font-size: 32px; font-weight: 550; margin-top: -10px"
- >{{ landInfo.rate || 0 }}</span
- >%
- </p>
- </div>
- <div class="avue-statis">
- <!-- <avue-data-display :option="option"></avue-data-display> -->
- <div class="land-statis">
- <div class="land-title">地块总面积</div>
- <div class="land-num">
- <span>{{ landInfo.zarea }}</span
- > 亩
- </div>
+ <div class="home">
+ <div class="left">
+ <div class="farm-info">
+ <div class="farm-title">农场概览</div>
+ <div class="statis">
+ <div class="echarts-statis">
+ <el-progress
+ type="circle"
+ :percentage="landInfo.rate"
+ :stroke-width="15"
+ :width="150"
+ :color="customColor"
+ :show-text="false"
+ ></el-progress>
+ </div>
+ <div class="percentText">
+ <p>地块使用率</p>
+ <p style="position: relative; top: -12px">
+ <span
+ style="font-size: 32px; font-weight: 550; margin-top: -10px"
+ >{{ landInfo.rate || 0 }}</span>%
+ </p>
+ </div>
+ <div class="avue-statis">
+ <!-- <avue-data-display :option="option"></avue-data-display> -->
+ <div class="land-statis">
+ <div class="land-title">地块总面积</div>
+ <div class="land-num">
+ <span>{{ landInfo.zarea }}</span> 亩
+ </div>
+ </div>
+ <div class="land-statis">
+ <div class="land-title">当前种养面积</div>
+ <div class="land-num">
+ <span>{{ landInfo.sarea }}</span> 亩
+ </div>
+ </div>
+ <div class="land-statis">
+ <div class="land-title">当前种养品种</div>
+ <div class="land-num">
+ <span>{{ landInfo.num }}</span> 种
+ </div>
+ </div>
+ </div>
+ <div class="map-view">
+ <img src="../../../public/img/map.png" />
+ <div class="title">农场地图→</div>
+ </div>
+ </div>
</div>
- <div class="land-statis">
- <div class="land-title">当前种养面积</div>
- <div class="land-num">
- <span>{{ landInfo.sarea }}</span
- > 亩
- </div>
+ <div class="farm-variety">
+ <div class="title">当前种养品种</div>
+ <div class="content">
+ <div class="farm" v-for="(item, index) in farmPlanList" :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="recovery(item)">
+ <span style="color: #5abf78">采收</span>
+ </el-button>
+ <el-button plain size="small" @click="over(item.id)">结束</el-button>
+ </div>
+ </div>
+ </div>
</div>
- <div class="land-statis">
- <div class="land-title">当前种养品种</div>
- <div class="land-num">
- <span>{{ landInfo.num }}</span
- > 种
- </div>
- </div>
- </div>
- <div class="map-view">
- <img src="../../../public/img/map.png" />
- <div class="title">农场地图→</div>
- </div>
+ <div class="farm-bottom"></div>
</div>
- </div>
- <div class="farm-variety">
- <div class="title">当前种养品种</div>
- <div class="content">
- <div class="farm" v-for="(item, index) in farmPlanList" :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="recovery(item)"
- ><span style="color: #5abf78">采收</span></el-button
- >
- <el-button plain size="small" @click="over(item.id)"
- >结束</el-button
- >
+ <div class="right">
+ <div class="production">
+ <div class="title">生产管理</div>
+ <div class="btn">
+ <!-- <div class="production-button"> -->
+ <div class="button" @click="land" style="background-color: #6991f4">
+ <div class="btn-img">
+ <img src="../../../public/img/wel/tian.png" class="img" />
+ </div>
+ <div class="text">圈地</div>
+ </div>
+ <div class="button" style="background-color: #f2a560" @click="plant">
+ <div class="btn-img">
+ <img src="../../../public/img/wel/ye.png" class="img" />
+ </div>
+ <div class="text">添加种养品种</div>
+ </div>
+ <div class="button" style="background-color: #f37ba1" @click="farming">
+ <div class="btn-img">
+ <img src="../../../public/img/wel/tuo.png" class="img" />
+ </div>
+ <div class="text">农事操作</div>
+ </div>
+ <div class="button" style="background-color: #9d82f6" @click="stock">
+ <div class="btn-img">
+ <img src="../../../public/img/wel/fang.png" class="img" />
+ </div>
+ <div class="text">农资入库</div>
+ </div>
+ </div>
</div>
- </div>
+ <div class="statistics">
+ <div class="title">生产统计</div>
+ <div class="farming-statis">
+ <div class="left">
+ <div class="farm-text">本年农事操作</div>
+ <div class="num">
+ <span>{{ total }}</span> 次
+ </div>
+ </div>
+ <div class="right">
+ <el-link type="success" :underline="false" @click="farmPlantDetail">明细>></el-link>
+ </div>
+ </div>
+ <div class="farming-divider" v-if="isFarmingDetail">
+ <el-divider></el-divider>
+ </div>
+ <div class="farming-details" :v-if="isFarmingDetail">
+ <div
+ class="detail"
+ v-for="(item, index) in farmingList"
+ :key="index"
+ @click="farmPlantDetails(item)"
+ >
+ <div class="detail-title">{{ item.name }}</div>
+ <div class="detail-number">
+ <span>{{ item.value }}</span>次
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="repertory">
+ <div class="title">
+ <div class="repertory-title">农资库存</div>
+ <div class="detail">
+ <el-link type="success" :underline="false " @click="stockDetail">明细>></el-link>
+ </div>
+ </div>
+ <div class="repertory-centont">
+ <div
+ class="detail"
+ v-for="(item, index) in stockList"
+ :key="index"
+ @click="stockDetails(item)"
+ >
+ <div class="detail-title">{{ item.name}}</div>
+ <div class="detail-number">
+ 剩余库存
+ <span>{{ item.val}}</span>公斤
+ </div>
+ </div>
+ </div>
+ </div>
</div>
- </div>
- <div class="farm-bottom"></div>
+ <!-- 弹窗, 采收 -->
+ <recovery v-if="recoveryVisible" ref="recovery"></recovery>
+ <!-- 圈地 -->
+ <land v-if="landVisible" ref="land"></land>
+ <!-- 种养品 -->
+ <plant v-if="plantVisible" ref="plant" @refreshOnLoad="onLoad"></plant>
+ <!-- 农事操作 -->
+ <farming v-if="farmingVisible" ref="farming"></farming>
+ <!-- 农资入库 -->
+ <stock v-if="stockVisible" ref="stock"></stock>
</div>
- <div class="right">
- <div class="production">
- <div class="title">生产管理</div>
- <div class="btn">
- <!-- <div class="production-button"> -->
- <div class="button" @click="land" style="background-color: #6991f4">
- <div class="btn-img">
- <img src="../../../public/img/wel/tian.png" class="img" />
- </div>
- <div class="text">圈地</div>
- </div>
- <div class="button" style="background-color: #f2a560" @click="plant">
- <div class="btn-img">
- <img src="../../../public/img/wel/ye.png" class="img" />
- </div>
- <div class="text">添加种养品种</div>
- </div>
- <div
- class="button"
- style="background-color: #f37ba1"
- @click="farming"
- >
- <div class="btn-img">
- <img src="../../../public/img/wel/tuo.png" class="img" />
- </div>
- <div class="text">农事操作</div>
- </div>
- <div class="button" style="background-color: #9d82f6" @click="stock">
- <div class="btn-img">
- <img src="../../../public/img/wel/fang.png" class="img" />
- </div>
- <div class="text">农资入库</div>
- </div>
- </div>
- </div>
- <div class="statistics">
- <div class="title">生产统计</div>
- <div class="farming-statis">
- <div class="left">
- <div class="farm-text">本年农事操作</div>
- <div class="num">
- <span>{{ total }}</span
- > 次
- </div>
- </div>
- <div class="right">
- <el-link type="success" :underline="false" @click="farmPlantDetail"
- >明细>></el-link
- >
- </div>
- </div>
- <div class="farming-divider" v-if="isFarmingDetail">
- <el-divider></el-divider>
- </div>
- <div class="farming-details" :v-if="isFarmingDetail">
- <div class="detail" v-for="(item, index) in farmingList" :key="index" @click="farmPlantDetails(item)">
- <div class="detail-title">{{ item.name }}</div>
- <div class="detail-number">
- <span>{{ item.value }}</span
- >次
- </div>
- </div>
- </div>
- </div>
- <div class="repertory">
- <div class="title">
- <div class="repertory-title">农资库存</div>
- <div class="detail">
- <el-link type="success" :underline="false "@click="stockDetail" >明细>></el-link>
- </div>
- </div>
- <div class="repertory-centont">
- <div class="detail" v-for="(item, index) in stockList" :key="index" @click="stockDetails(item)">
- <div class="detail-title">{{ item.name}}</div>
- <div class="detail-number">剩余库存 <span>{{ item.val}}</span>公斤</div>
- </div>
- </div>
- </div>
- </div>
- <!-- 弹窗, 采收 -->
- <recovery v-if="recoveryVisible" ref="recovery"></recovery>
- <!-- 圈地 -->
- <land v-if="landVisible" ref="land"></land>
- <!-- 种养品 -->
- <plant v-if="plantVisible" ref="plant" @refreshOnLoad="onLoad"></plant>
- <!-- 农事操作 -->
- <farming v-if="farmingVisible" ref="farming"></farming>
- <!-- 农资入库 -->
- <stock v-if="stockVisible" ref="stock"></stock>
- </div>
</template>
<script>
-import { mapGetters } from "vuex";
-import { getList, update } from "@/api/farmplant/farmplant";
-import { getFarmingCount, getFarmingStatis } from "@/api/farm/farmingrecord";
-import { selectCount } from "@/api/land/land";
-import {StockCount} from "@/api/stock/stock"
-import recovery from "./recovery.vue";
-import land from "./land.vue";
-import plant from "./plant.vue";
-import farming from "./farming.vue";
-import stock from "./stock.vue";
+import { mapGetters } from "vuex"
+import { getList, update } from "@/api/farmplant/farmplant"
+import { getFarmingCount, getFarmingStatis } from "@/api/farm/farmingrecord"
+import { selectCount } from "@/api/land/land"
+import { StockCount } from "@/api/stock/stock"
+import recovery from "./recovery.vue"
+import land from "./land.vue"
+import plant from "./plant.vue"
+import farming from "./farming.vue"
+import stock from "./stock.vue"
export default {
- components: {
- recovery,
- land,
- plant,
- farming,
- stock,
- },
- name: "wel",
- data() {
- return {
- farmingList: [],
- stockList: [],
- isFarmingDetail: false,
- landInfo: {},
- customColor: "#5ABF78",
- total: 0,
- farmingCount: 0,
- farmPlanList: [],
- recoveryVisible: false,
- landVisible: false,
- plantVisible: false,
- farmingVisible: false,
- stockVisible: false,
- option: {
- span: 8,
- data: [],
- },
- };
- },
- computed: {
- ...mapGetters(["userInfo"]),
- },
- created() {
- //地块使用率统计
- this.getCountStatis();
- //采收列表
- this.onLoad();
- //本年农事操作记录
- this.getFarmingCount();
- //本年农事操作记录,分组
- this.getFarmingStatis();
- this.StockCount();
- },
- methods: {
- //本年农事操作记录
- getFarmingCount() {
- var that = this;
- getFarmingCount(this.userInfo.farmId).then((res) => {
- that.total = res.data.data;
- // that.total = 0;
- if (that.total > 0) {
- that.isFarmingDetail = true;
+ components: {
+ recovery,
+ land,
+ plant,
+ farming,
+ stock,
+ },
+ name: "wel",
+ data () {
+ return {
+ farmingList: [],
+ stockList: [],
+ isFarmingDetail: false,
+ landInfo: {},
+ customColor: "#5ABF78",
+ total: 0,
+ farmingCount: 0,
+ farmPlanList: [],
+ recoveryVisible: false,
+ landVisible: false,
+ plantVisible: false,
+ farmingVisible: false,
+ stockVisible: false,
+ option: {
+ span: 8,
+ data: [],
+ },
}
- });
},
- //本年农事操作记录，分组统计
- getFarmingStatis() {
- var that = this;
- getFarmingStatis(this.userInfo.farmId).then((res) => {
- that.farmingList = res.data.data;
- });
+ computed: {
+ ...mapGetters(["userInfo"]),
},
- StockCount() {
- var that = this;
- StockCount(this.userInfo.farmId).then((res) => {
- that.stockList= res.data.data;
- console.log(that.stockList)
- });
+ created () {
+ //地块使用率统计
+ this.getCountStatis()
+ //采收列表
+ this.onLoad()
+ //本年农事操作记录
+ this.getFarmingCount()
+ //本年农事操作记录,分组
+ this.getFarmingStatis()
+ this.StockCount()
},
- //地块使用率统计
- getCountStatis() {
- var that = this;
- selectCount(this.userInfo.farmId).then((res) => {
- var data = res.data.data;
- that.landInfo = data;
- });
+ methods: {
+ //本年农事操作记录
+ getFarmingCount () {
+ var that = this
+ getFarmingCount(this.userInfo.farmId).then((res) => {
+ that.total = res.data.data
+ // that.total = 0;
+ if (that.total > 0) {
+ that.isFarmingDetail = true
+ }
+ })
+ },
+ //本年农事操作记录，分组统计
+ getFarmingStatis () {
+ var that = this
+ getFarmingStatis(this.userInfo.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)
+ })
+ },
+ //地块使用率统计
+ getCountStatis () {
+ var that = this
+ selectCount(this.userInfo.farmId).then((res) => {
+ var data = res.data.data
+ that.landInfo = data
+ })
+ },
+ handleChange (val) {
+ window.console.log(val)
+ },
+ //获取种植中的种养品
+ onLoad () {
+ var params = {
+ 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
+ })
+ },
+ //采收
+ recovery (data) {
+ this.recoveryVisible = true
+ this.$nextTick(() => {
+ this.$refs.recovery.init(data)
+ })
+ },
+ //结束种植
+ over (id) {
+ var that = this
+ this.$confirm("确定结束当前种植的农产品?", {
+ confirmButtonText: "确定",
+ cancelButtonText: "取消",
+ type: "warning",
+ })
+ .then(() => {
+ const data = {
+ id: id,
+ status: 2,
+ }
+ return update(data)
+ })
+ .then(() => {
+ that.onLoad()
+ this.$message({
+ type: "success",
+ message: "操作成功!",
+ })
+ })
+ },
+ //圈地
+ land () {
+ this.landVisible = true
+ this.$nextTick(() => {
+ this.$refs.land.init()
+ })
+ },
+ //种植
+ plant () {
+ this.plantVisible = true
+ this.$nextTick(() => {
+ this.$refs.plant.init()
+ })
+ },
+ //农事操作
+ farming () {
+ this.farmingVisible = true
+ this.$nextTick(() => {
+ this.$refs.farming.init()
+ })
+ },
+ //农资入库
+ stock () {
+ this.stockVisible = true
+ this.$nextTick(() => {
+ this.$refs.stock.init()
+ })
+ },
+ //本年农事操作明细
+ farmPlantDetail () {
+ const data = {
+ activeName: "tab2",
+ }
+ this.$router.push({
+ path: `/farmDetail`,
+ query: data,
+ })
+ },
+ stockDetail () {
+ this.$router.push({
+ path: `/stockmanage`,
+ })
+ },
+ //本年农事操作明细--有参
+ farmPlantDetails (item) {
+ console.log(item, 11111)
+ const data = {
+ type: item.value,
+ activeName: "tab2",
+ }
+ this.$router.push({
+ path: `/farmDetail`,
+ query: data,
+ })
+ },
+ //农资库存点击事件
+ stockDetails (item) {
+ var type
+ if (item.name == "化肥") {
+ type = 0
+ }
+ if (item.name == "有机肥") {
+ type = 1
+ }
+ if (item.name == "杀虫剂") {
+ type = 2
+ }
+ if (item.name == "杀菌剂") {
+ type = 3
+ }
+ if (item.name == "饲料") {
+ type = 4
+ }
+ const data = {
+ type: type,
+ }
+ this.$router.push({
+ path: `/stockmanage`,
+ query: data,
+ })
+ },
+ //采收记录
+ recoveryDetail () {
+ const data = {
+ activeName: "tab1",
+ }
+ this.$router.push({
+ path: `/farmDetail`,
+ query: data,
+ })
+ },
},
- handleChange(val) {
- window.console.log(val);
- },
- //获取种植中的种养品
- onLoad() {
- var params = {
- 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;
- });
- },
- //采收
- recovery(data) {
- this.recoveryVisible = true;
- this.$nextTick(() => {
- this.$refs.recovery.init(data);
- });
- },
- //结束种植
- over(id) {
- var that = this;
- this.$confirm("确定结束当前种植的农产品?", {
- confirmButtonText: "确定",
- cancelButtonText: "取消",
- type: "warning",
- })
- .then(() => {
- const data = {
- id: id,
- status: 2,
- };
- return update(data);
- })
- .then(() => {
- that.onLoad();
- this.$message({
- type: "success",
- message: "操作成功!",
- });
- });
- },
- //圈地
- land() {
- this.landVisible = true;
- this.$nextTick(() => {
- this.$refs.land.init();
- });
- },
- //种植
- plant() {
- this.plantVisible = true;
- this.$nextTick(() => {
- this.$refs.plant.init();
- });
- },
- //农事操作
- farming() {
- this.farmingVisible = true;
- this.$nextTick(() => {
- this.$refs.farming.init();
- });
- },
- //农资入库
- stock() {
- this.stockVisible = true;
- this.$nextTick(() => {
- this.$refs.stock.init();
- });
- },
- //本年农事操作明细
- farmPlantDetail() {
- const data = {
- activeName: "tab2",
- };
- this.$router.push({
- path: `/farmDetail`,
- query: data,
- });
- },
- stockDetail() {
- this.$router.push({
- path: `/stockmanage`,
- });
- },
- //本年农事操作明细--有参
- farmPlantDetails(item) {
- console.log(item,11111);
- const data = {
- type:item.value,
- activeName: "tab2",
- };
- this.$router.push({
- path: `/farmDetail`,
- query: data,
- });
- },
- //农资库存点击事件
- stockDetails(item) {
- var type;
- if (item.name=="化肥"){
- type=0
- }
- if (item.name=="有机肥"){
- type=1
- }
- if (item.name=="杀虫剂"){
- type=2
- }
- if (item.name=="杀菌剂"){
- type=3
- }
- if (item.name=="饲料"){
- type=4
- }
- const data = {
- type:type,
- };
- this.$router.push({
- path: `/stockmanage`,
- query: data,
- });
- },
- //采收记录
- recoveryDetail() {
- const data = {
- activeName: "tab1",
- };
- this.$router.push({
- path: `/farmDetail`,
- query: data,
- });
- },
- },
};
</script>
<style lang="scss" scope>
.el-font-size {
- font-size: 14px;
+ font-size: 14px;
}
.home {
- width: 100%;
- // height: 100%;
- display: flex;
- flex-direction: row;
+ width: 100%;
+ // height: 100%;
+ display: flex;
+ flex-direction: row;
- .left {
- margin-left: 1%;
- width: 75%;
- height: 100%;
+ .left {
+ margin-left: 1%;
+ width: 75%;
+ height: 100%;
- .farm-info {
- width: 100%;
- height: 30%;
- background-color: #fff;
- border-radius: 5px;
+ .farm-info {
+ width: 100%;
+ height: 30%;
+ background-color: #fff;
+ border-radius: 5px;
- .farm-title {
- padding-top: 20px;
- height: 30px;
- line-height: 30px;
- font-size: 24px;
- font-weight: 550;
- text-align: center;
- }
-
- .statis {
- width: 100%;
- display: flex;
-
- .echarts-statis {
- width: 20%;
- height: 170px;
- line-height: 170px;
- margin: 0 auto;
- margin-left: 90px;
- // text-align: center;
- padding-top: 30px;
- }
-
- .percentText {
- position: relative;
- left: -16%;
- top: 57px;
- width: 90px;
- font-size: 16px;
- text-align: center;
- }
-
- .avue-statis {
- width: 60%;
- height: 170px;
- padding-top: 50px;
- margin-left: -80px;
- display: flex;
- flex-direction: row;
-
- .land-statis {
- width: 33%;
- margin: 3% 8%;
-
- .land-num {
- margin-top: 20px;
-
- span {
- font-size: 30px;
+ .farm-title {
+ padding-top: 20px;
+ height: 30px;
+ line-height: 30px;
+ font-size: 24px;
font-weight: 550;
- color: #5abf78;
- }
+ text-align: center;
}
- }
+
+ .statis {
+ width: 100%;
+ display: flex;
+
+ .echarts-statis {
+ width: 20%;
+ height: 170px;
+ line-height: 170px;
+ margin: 0 auto;
+ margin-left: 90px;
+ // text-align: center;
+ padding-top: 30px;
+ }
+
+ .percentText {
+ position: relative;
+ left: -16%;
+ top: 57px;
+ width: 90px;
+ font-size: 16px;
+ text-align: center;
+ }
+
+ .avue-statis {
+ width: 60%;
+ height: 170px;
+ padding-top: 50px;
+ margin-left: -80px;
+ display: flex;
+ flex-direction: row;
+
+ .land-statis {
+ width: 33%;
+ margin: 3% 8%;
+
+ .land-num {
+ margin-top: 20px;
+
+ span {
+ font-size: 30px;
+ font-weight: 550;
+ color: #5abf78;
+ }
+ }
+ }
+ }
+
+ .map-view {
+ width: 20%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+
+ img {
+ width: 90px;
+ height: 66px;
+ }
+
+ .title {
+ font-size: 13px;
+ color: #fff;
+ z-index: 999;
+ position: relative;
+ left: -70px;
+ top: 15px;
+ }
+ }
+ }
}
- .map-view {
- width: 20%;
- display: flex;
- justify-content: center;
- align-items: center;
- cursor: pointer;
+ .farm-variety {
+ margin-top: 15px;
+ width: 100%;
+ min-height: 600px;
+ background-color: #fff;
+ border-radius: 5px;
- img {
- width: 90px;
- height: 66px;
- }
+ .title {
+ padding-top: 20px;
+ height: 30px;
+ line-height: 30px;
+ font-size: 24px;
+ font-weight: 550;
+ text-align: center;
+ }
- .title {
- font-size: 13px;
- color: #fff;
- z-index: 999;
- position: relative;
- left: -70px;
- top: 15px;
- }
+ .content {
+ width: 99%;
+ height: 630px;
+ margin: 0 auto;
+
+ word-wrap: break-word;
+ word-break: break-all;
+
+ .farm {
+ width: 168px;
+ height: 277px;
+ background-color: #f7f9fb;
+ border-radius: 5px;
+ margin-left: 30px;
+ margin-top: 30px;
+ float: left;
+
+ .farm-img {
+ width: 168px;
+ height: 168px;
+
+ .img {
+ width: 168px;
+ height: 168px;
+ border-radius: 8px 8px 0px 0px;
+ }
+ }
+
+ .cai {
+ text-align: center;
+ font-size: 18px;
+ font-weight: 550;
+ margin-top: 8px;
+ color: #5abf78;
+ }
+
+ .area {
+ text-align: center;
+ font-size: 14px;
+ margin-top: 5px;
+ color: #333333;
+
+ span {
+ font-size: 15px;
+ color: #333333;
+ }
+ }
+
+ .btn {
+ text-align: center;
+ margin-top: 8px;
+ }
+ }
+ }
}
- }
+
+ .farm-bottom {
+ min-height: 50px;
+ }
}
- .farm-variety {
- margin-top: 15px;
- width: 100%;
- min-height: 600px;
- background-color: #fff;
- border-radius: 5px;
+ .right {
+ width: 22%;
+ height: 100%;
+ margin-left: 1%;
- .title {
- padding-top: 20px;
- height: 30px;
- line-height: 30px;
- font-size: 24px;
- font-weight: 550;
- text-align: center;
- }
+ .production {
+ width: 100%;
+ height: 30%;
+ background-color: #fff;
+ border-radius: 5px;
- .content {
- width: 99%;
- height: 630px;
- margin: 0 auto;
-
- word-wrap: break-word;
- word-break: break-all;
-
- .farm {
- width: 168px;
- height: 277px;
- background-color: #f7f9fb;
- border-radius: 5px;
- margin-left: 30px;
- margin-top: 30px;
- float: left;
-
- .farm-img {
- width: 168px;
- height: 168px;
-
- .img {
- width: 168px;
- height: 168px;
- border-radius: 8px 8px 0px 0px;
+ .title {
+ padding-top: 20px;
+ height: 30px;
+ line-height: 30px;
+ font-size: 24px;
+ font-weight: 550;
+ text-align: center;
}
- }
- .cai {
- text-align: center;
- font-size: 18px;
- font-weight: 550;
- margin-top: 8px;
- color: #5abf78;
- }
+ .btn {
+ width: 88%;
+ margin-left: 7%;
+ padding-top: 20px;
+ height: 200px;
+ word-wrap: break-word;
+ word-break: break-all;
- .area {
- text-align: center;
- font-size: 14px;
- margin-top: 5px;
- color: #333333;
+ // .production-button {
+ // display: flex;
+ // padding-top: 12px;
+ // height: 100px;
- span {
- font-size: 15px;
- color: #333333;
+ .button {
+ margin-left: 10px;
+ margin-top: 10px;
+ display: flex;
+ flex-direction: column;
+ float: left;
+ width: 140px;
+ height: 80px;
+ align-content: center;
+ justify-content: center;
+ border-radius: 3px;
+ cursor: pointer;
+ align-items: center;
+
+ .btn-img {
+ height: 32px;
+ line-height: 32px;
+ border-radius: 3px;
+
+ .img {
+ width: 32px;
+ height: 32px;
+ }
+ }
+
+ .text {
+ font-size: 18px;
+ color: #fff;
+ }
+ }
+ // }
}
- }
-
- .btn {
- text-align: center;
- margin-top: 8px;
- }
}
- }
+
+ .statistics {
+ margin-top: 15px;
+ width: 100%;
+ background-color: #fff;
+ border-radius: 5px;
+ height: auto;
+ // white-space: nowrap;
+
+ .title {
+ padding-top: 20px;
+ height: 30px;
+ line-height: 30px;
+ font-size: 24px;
+ font-weight: 550;
+ text-align: center;
+ }
+
+ .farming-statis {
+ width: 94%;
+ margin: 0 auto;
+ height: 100px;
+ display: flex;
+ flex-direction: row;
+ // background-color: aqua;
+
+ .left {
+ width: 60%;
+ height: 100px;
+
+ .farm-text {
+ font-size: 20px;
+ margin-top: 20px;
+ }
+ .num {
+ font-size: 16px;
+ margin-top: 10px;
+
+ span {
+ font-size: 38px;
+ font-weight: 550;
+ color: #5abf78;
+ }
+ }
+ }
+
+ .right {
+ margin-left: 60px;
+ line-height: 100px;
+ height: 100px;
+ }
+ }
+
+ .farming-divider {
+ width: 94%;
+ margin: 0 auto;
+ }
+
+ .farming-details {
+ margin-top: -10px;
+ width: 100%;
+ height: auto;
+ word-wrap: break-word;
+ word-break: break-all;
+ //自适应高度
+ display: inline-block;
+
+ .detail {
+ background-color: #eff3f8;
+ cursor: pointer;
+ float: left;
+ width: 45%;
+ border-radius: 4px;
+ margin-left: 3%;
+ margin-top: 10px;
+ display: flex;
+ flex-flow: row nowrap;
+ justify-content: space-between;
+ height: 40px;
+ line-height: 40px;
+
+ .detail-title {
+ color: #707070;
+ font-size: 14px;
+ margin-left: 10px;
+ }
+
+ .detail-number {
+ color: #707070;
+ font-size: 14px;
+ margin-right: 15px;
+
+ span {
+ font-size: 18px;
+ font-weight: 550;
+ }
+ }
+ }
+
+ .detail:hover {
+ background: #e3f0ff;
+ }
+ }
+ }
+
+ .repertory {
+ margin-top: 15px;
+ width: 100%;
+ height: auto;
+ background-color: #fff;
+ border-radius: 5px;
+
+ .title {
+ padding-top: 20px;
+ height: 30px;
+ line-height: 30px;
+ text-align: center;
+
+ .repertory-title {
+ font-size: 24px;
+ font-weight: 550;
+ float: left;
+ padding-left: 35%;
+ }
+
+ .detail {
+ }
+ }
+
+ .repertory-centont {
+ width: 94%;
+ margin: 0 auto;
+ height: auto;
+ word-wrap: break-word;
+ word-break: break-all;
+ //自适应高度
+ display: inline-block;
+
+ .detail:hover {
+ background: #e3f0ff;
+ }
+
+ .detail {
+ background-color: #eff3f8;
+ cursor: pointer;
+ float: left;
+ border-radius: 4px;
+ margin-left: 3%;
+ margin-top: 10px;
+ display: flex;
+ flex-flow: row nowrap;
+ justify-content: space-between;
+ height: 50px;
+ line-height: 50px;
+ width: 100%;
+
+ .detail-title {
+ color: #707070;
+ font-size: 16px;
+ margin-left: 10px;
+ }
+
+ .detail-number {
+ color: #707070;
+ font-size: 14px;
+ margin-right: 15px;
+
+ span {
+ font-size: 18px;
+ font-weight: 550;
+ }
+ }
+ }
+ }
+ }
}
- .farm-bottom {
- min-height: 50px;
+ .avue-data-display .count {
+ color: #000 !important;
+ font-size: 28px !important;
}
- }
-
- .right {
- width: 22%;
- height: 100%;
- margin-left: 1%;
-
- .production {
- width: 100%;
- height: 30%;
- background-color: #fff;
- border-radius: 5px;
-
- .title {
- padding-top: 20px;
- height: 30px;
- line-height: 30px;
- font-size: 24px;
- font-weight: 550;
- text-align: center;
- }
-
- .btn {
- width: 88%;
- margin-left: 7%;
- padding-top: 20px;
- height: 200px;
- word-wrap: break-word;
- word-break: break-all;
-
- // .production-button {
- // display: flex;
- // padding-top: 12px;
- // height: 100px;
-
- .button {
- margin-left: 10px;
- margin-top: 10px;
- display: flex;
- flex-direction: column;
- float: left;
- width: 140px;
- height: 80px;
- align-content: center;
- justify-content: center;
- border-radius: 3px;
- cursor: pointer;
- align-items: center;
-
- .btn-img {
- height: 32px;
- line-height: 32px;
- border-radius: 3px;
-
- .img {
- width: 32px;
- height: 32px;
- }
- }
-
- .text {
- font-size: 18px;
- color: #fff;
- }
- }
- // }
- }
- }
-
- .statistics {
- margin-top: 15px;
- width: 100%;
- background-color: #fff;
- border-radius: 5px;
- height: auto;
- // white-space: nowrap;
-
- .title {
- padding-top: 20px;
- height: 30px;
- line-height: 30px;
- font-size: 24px;
- font-weight: 550;
- text-align: center;
- }
-
- .farming-statis {
- width: 94%;
- margin: 0 auto;
- height: 100px;
- display: flex;
- flex-direction: row;
- // background-color: aqua;
-
- .left {
- width: 60%;
- height: 100px;
-
- .farm-text {
- font-size: 20px;
- margin-top: 20px;
- }
- .num {
- font-size: 16px;
- margin-top: 10px;
-
- span {
- font-size: 38px;
- font-weight: 550;
- color: #5abf78;
- }
- }
- }
-
- .right {
- margin-left: 60px;
- line-height: 100px;
- height: 100px;
- }
- }
-
- .farming-divider {
- width: 94%;
- margin: 0 auto;
- }
-
- .farming-details {
- margin-top: -10px;
- width: 100%;
- height: auto;
- word-wrap: break-word;
- word-break: break-all;
- //自适应高度
- display: inline-block;
-
- .detail {
- background-color: #eff3f8;
- cursor: pointer;
- float: left;
- width: 45%;
- border-radius: 4px;
- margin-left: 3%;
- margin-top: 10px;
- display: flex;
- flex-flow: row nowrap;
- justify-content: space-between;
- height: 40px;
- line-height: 40px;
-
- .detail-title {
- color: #707070;
- font-size: 14px;
- margin-left: 10px;
- }
-
- .detail-number {
- color: #707070;
- font-size: 14px;
- margin-right: 15px;
-
- span {
- font-size: 18px;
- font-weight: 550;
- }
- }
- }
-
- .detail:hover {
- background: #e3f0ff;
- }
- }
- }
-
- .repertory {
- margin-top: 15px;
- width: 100%;
- height: auto;
- background-color: #fff;
- border-radius: 5px;
-
- .title {
- padding-top: 20px;
- height: 30px;
- line-height: 30px;
- text-align: center;
-
- .repertory-title {
- font-size: 24px;
- font-weight: 550;
- float: left;
- padding-left: 35%;
- }
-
- .detail {
- }
- }
-
- .repertory-centont {
- width: 94%;
- margin: 0 auto;
- height: auto;
- word-wrap: break-word;
- word-break: break-all;
- //自适应高度
- display: inline-block;
-
- .detail:hover {
- background: #e3f0ff;
- }
-
- .detail {
- background-color: #eff3f8;
- cursor: pointer;
- float: left;
- border-radius: 4px;
- margin-left: 3%;
- margin-top: 10px;
- display: flex;
- flex-flow: row nowrap;
- justify-content: space-between;
- height: 50px;
- line-height: 50px;
- width: 100%;
-
- .detail-title {
- color: #707070;
- font-size: 16px;
- margin-left: 10px;
- }
-
- .detail-number {
- color: #707070;
- font-size: 14px;
- margin-right: 15px;
-
- span {
- font-size: 18px;
- font-weight: 550;
- }
- }
- }
- }
- }
- }
-
- .avue-data-display .count {
- color: #000 !important;
- font-size: 28px !important;
- }
}
</style>
--
Gitblit v1.9.3