更新

src/components/charts/ChartPie.vue

@@ -20,16 +20,21 @@ export default {
     list: {
       type: Array,
       default: () => []
+    },
+    val: {
+      type: Number,
+      default: () => 0
     }
   })
 
   let myChart = null;
 
   const init = () => {
-    let total = props.list.reduce(
-      (prev, item) => prev + item.value,
-      0
-    );
+    let total = props.val;
+    // let total = props.list.reduce(
+    //   (prev, item) => prev + item.value,
+    //   0
+    // );
 
     let clientLabels = [];
     props.list.forEach((item) => {

src/components/headerElement.vue

@@ -4,7 +4,7 @@
       <div class="header_left_flex">
         <iframe
           scrolling="no"
-          :src="'https://tianqiapi.com/api.php?style=tz&skin=pitaya&color=ffffff&fontsize=16&city=' + city"
+          :src="'https://widget.tianqiapi.com/?style=tz&skin=pitaya&color=ffffff&fontsize=16&city=' + city"
           frameborder="0"
           width="100%" height="30"
           style="font-family: 'Biao-ti'"

src/utils/api.js

@@ -482,3 +482,56 @@ export function getHengLuMonthPig(data) {
     data: data
   })
 }
+
+// 横路销售分析
+export function getHengLuSale(data) {
+  return http({
+    url: '/prod-stock/listStockScreenHengluSale',
+    method: 'post',
+    data: data
+  })
+}
+
+// 能耗监测 获取水电表
+export function getEleAndWaterCode(data) {
+  return http({
+    url:'/admin/energyEnvDevice/listDevice',
+    method: 'post',
+    data: data
+  })
+}
+
+// 能耗监测 水表chart
+export function getEnergyWaterChart(data) {
+  return http({
+    url: '/energy-water/listScreen',
+    method: 'post',
+    data: data
+  })
+}
+
+export function getEnergyEleChart(data) {
+  return http({
+    url: '/energy-electricity/listScreen',
+    method: 'post',
+    data: data
+  })
+}
+
+// 生产经营 数据统计
+export function getProInfoList(data) {
+  return http({
+    url: '/prod-production/listScreenProd',
+    method: 'post',
+    data: data
+  })
+}
+
+// 生产情况大屏展示
+export function addScreenProd(data) {
+  return http({
+    url: '/prod-production/addScreenProd',
+    method: 'post',
+    data: data
+  })
+}

src/views/Charge/Charge.vue

@@ -201,8 +201,8 @@ export default {
 
   const initVideo = () => {
     let params = {
-      cameraUuid: "8dac09c0c5144eb2a7653c1fa6bd9403",
-      id: 7640
+      cameraUuid: "1f019fba247e4463843ad080fd385cd1",
+      id: 7922
     }
     getNameVideo(params).then(res => {
       if(res.code === 10000) {

src/views/Charge/charts/ChartEleAndWater.vue

@@ -0,0 +1,151 @@
+<template>
+  <div :id="'chart-ele-water' + id" style="width: 100%; height: 100%"></div>
+</template>
+
+<script>
+export default {
+  name: "ChartEleAndWater"
+}
+</script>
+<script setup>
+  import { getCurrentInstance, onMounted, watch } from "vue";
+  const { proxy } = getCurrentInstance();
+
+  const props = defineProps({
+    id: {
+      type: Number,
+      default: 0
+    },
+    data: {
+      type: Object,
+      default: () => {
+        return {
+          list: [],
+          unit: '',
+          name: ''
+        }
+      }
+    },
+  })
+
+  let myChart = null;
+
+  const init = () => {
+    let time = [];
+    let data = [];
+    if(props.data.list.length > 0) {
+      props.data.list.forEach(item => {
+        time.push(item.date)
+        data.push(item.value)
+      })
+    }
+
+    let options = {
+      color: ['#5796FC'],
+      tooltip: {
+        trigger: "axis",
+      },
+      grid: {
+        left: '3%',
+        top: '15%',
+        right: '3%',
+        bottom: '5%',
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        boundaryGap: true,
+        data: time,
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: "#fff",
+          }
+        },
+        axisLabel: {
+          color: '#fff'
+        }
+      },
+      yAxis: [
+        {
+          type: 'value',
+          name: `单位：${props.data.unit}`,
+          nameTextStyle:{//y轴上方单位的颜色
+            color:'#fff',
+            padding: [0, 40, 0, 0]
+          },
+          boundaryGap: [0, '100%'],
+          axisLine: {       //y轴
+            show: true,
+            color: '#fff'
+          },
+          axisTick: {
+            show: false,
+          },
+          splitLine: {
+            show: true,
+            lineStyle:{
+              type:'dashed'//虚线
+            },
+          },
+          axisLabel: {
+            color: '#fff',
+            textStyle: {
+              color: '#fff',//字体颜色
+              fontSize: 12 //字体大小
+            }
+          },
+          // splitArea: {
+          //   show: true,
+          //   areaStyle: {
+          //     color: '#1D2555'
+          //   }
+          // }
+        },
+      ],
+      series: [
+        {
+          name: `${props.data.name}`,
+          type: 'line',
+          smooth: true,
+          barWidth: 30,
+          showAllSymbol: true,
+          data: data,
+          tooltip: {
+            valueFormatter: function (value) {
+              return value + `${props.data.unit}`;
+            }
+          },
+          itemStyle: {
+            normal: {
+              color: '#009CFF'
+            }
+          },
+          lineStyle: {
+            width: 5,  //阴影宽度
+            shadowColor: 'rgba(0, 156, 255, .4)', //阴影颜色
+            shadowBlur: 6, //阴影模糊系数
+          },
+          // symbol:"circle",
+          // symbolSize:0,
+        },
+      ],
+    }
+
+    myChart.setOption(options)
+  }
+
+  onMounted(() => {
+    myChart = proxy.$echarts.init(document.getElementById('chart-ele-water' + props.id));
+    init()
+  })
+
+  watch(() => props.data.list, () => {
+    myChart.clear()
+    init()
+  })
+</script>
+
+<style scoped>
+
+</style>

src/views/Energy/Energy.vue

@@ -158,74 +158,112 @@
   >
     <div v-if="showModal" class="video_box">
       <div class="video_scroll">
-        <a-table v-if="active === 1" :scroll="{ y: 700 }" :loading="loading" class="black-table" :pagination="false" bordered :dataSource="tableList" :columns="columns">
-          <template #bodyCell="{ column, record }">
-            <template v-if="column.key === 'day1'">
-              <span>{{record.day1}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'day2'">
-              <span>{{record.day2}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'day3'">
-              <span>{{record.day3}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'day4'">
-              <span>{{record.day4}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'week1'">
-              <span>{{record.week1}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'week2'">
-              <span>{{record.week2}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'week3'">
-              <span>{{record.week3}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'month1'">
-              <span>{{record.month1}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'month2'">
-              <span>{{record.month2}}吨</span>
-            </template>
-            <template v-else-if="column.key === 'month3'">
-              <span>{{record.month3}}吨</span>
-            </template>
-          </template>
-        </a-table>
-        <a-table v-else-if="active === 2" :scroll="{ y: 700 }" :loading="loading" class="black-table" :pagination="false" bordered :dataSource="tableList" :columns="columns2">
-          <template #bodyCell="{ column, record }">
-            <template v-if="column.key === 'day1'">
-              <span>{{record.day1}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'day2'">
-              <span>{{record.day2}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'day3'">
-              <span>{{record.day3}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'day4'">
-              <span>{{record.day4}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'week1'">
-              <span>{{record.week1}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'week2'">
-              <span>{{record.week2}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'week3'">
-              <span>{{record.week3}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'month1'">
-              <span>{{record.month1}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'month2'">
-              <span>{{record.month2}}kw/h</span>
-            </template>
-            <template v-else-if="column.key === 'month3'">
-              <span>{{record.month3}}kw/h</span>
-            </template>
-          </template>
-        </a-table>
+<!--        <a-table v-if="active === 1" :scroll="{ y: 700 }" :loading="loading" class="black-table" :pagination="false" bordered :dataSource="tableList" :columns="columns">-->
+<!--          <template #bodyCell="{ column, record }">-->
+<!--            <template v-if="column.key === 'day1'">-->
+<!--              <span>{{record.day1}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'day2'">-->
+<!--              <span>{{record.day2}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'day3'">-->
+<!--              <span>{{record.day3}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'day4'">-->
+<!--              <span>{{record.day4}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'week1'">-->
+<!--              <span>{{record.week1}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'week2'">-->
+<!--              <span>{{record.week2}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'week3'">-->
+<!--              <span>{{record.week3}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'month1'">-->
+<!--              <span>{{record.month1}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'month2'">-->
+<!--              <span>{{record.month2}}吨</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'month3'">-->
+<!--              <span>{{record.month3}}吨</span>-->
+<!--            </template>-->
+<!--          </template>-->
+<!--        </a-table>-->
+<!--        <a-table v-else-if="active === 2" :scroll="{ y: 700 }" :loading="loading" class="black-table" :pagination="false" bordered :dataSource="tableList" :columns="columns2">-->
+<!--          <template #bodyCell="{ column, record }">-->
+<!--            <template v-if="column.key === 'day1'">-->
+<!--              <span>{{record.day1}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'day2'">-->
+<!--              <span>{{record.day2}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'day3'">-->
+<!--              <span>{{record.day3}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'day4'">-->
+<!--              <span>{{record.day4}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'week1'">-->
+<!--              <span>{{record.week1}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'week2'">-->
+<!--              <span>{{record.week2}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'week3'">-->
+<!--              <span>{{record.week3}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'month1'">-->
+<!--              <span>{{record.month1}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'month2'">-->
+<!--              <span>{{record.month2}}kw/h</span>-->
+<!--            </template>-->
+<!--            <template v-else-if="column.key === 'month3'">-->
+<!--              <span>{{record.month3}}kw/h</span>-->
+<!--            </template>-->
+<!--          </template>-->
+<!--        </a-table>-->
+        <div v-if="active === 1">
+          <a-form layout="inline">
+            <a-form-item>
+              <a-select style="width: 200px" v-model:value="waterId" show-search>
+                <a-select-option v-for="item in waterCode" :key="item.id" :value="item.unitId">{{item.unitName}}</a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item>
+              <a-radio-group v-model:value="waterType">
+                <a-radio-button :value="0">近7天</a-radio-button>
+                <a-radio-button :value="1">近6周</a-radio-button>
+                <a-radio-button :value="2">近6月</a-radio-button>
+              </a-radio-group>
+            </a-form-item>
+          </a-form>
+          <div class="chart_content">
+            <chart-ele-and-water :id="0" :data="{ name: '用水量', unit: '吨', list: waterList }"></chart-ele-and-water>
+          </div>
+        </div>
+        <div v-else-if="active === 2">
+          <a-form layout="inline">
+            <a-form-item>
+              <a-select style="width: 200px" v-model:value="eleId" show-search>
+                <a-select-option v-for="item in eleCode" :key="item.id" :value="item.unitId">{{item.unitName}}</a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item>
+              <a-radio-group v-model:value="eleType">
+                <a-radio-button :value="0">近7天</a-radio-button>
+                <a-radio-button :value="1">近6周</a-radio-button>
+                <a-radio-button :value="2">近6月</a-radio-button>
+              </a-radio-group>
+            </a-form-item>
+          </a-form>
+          <div class="chart_content">
+            <chart-ele-and-water :id="0" :data="{ name: '用电量', unit: 'kw/h', list: eleList }"></chart-ele-and-water>
+          </div>
+        </div>
         <a-table v-else-if="active === 3" :scroll="{ y: 700 }" :loading="loading" class="black-table" :pagination="false" bordered :dataSource="[]" :columns="columns3"></a-table>
         <a-table v-else-if="active === 4" :scroll="{ y: 700 }" :loading="loading" class="black-table" :pagination="false" bordered :dataSource="[]" :columns="columns3"></a-table>
       </div>
@@ -249,10 +287,15 @@
     getEnergyList,
     getEnergyWarn,
     getEnergyTable,
-    getEnergyFeed, getDisplayType,
-    getEnergyData
+    getEnergyFeed,
+    getDisplayType,
+    getEnergyData,
+    getEleAndWaterCode,
+    getEnergyWaterChart,
+    getEnergyEleChart
   } from "../../utils/api";
   import XTabs from '../../components/XTabs.vue';
+  import ChartEleAndWater from "../Charge/charts/ChartEleAndWater.vue";
 
   const show = ref(false);
 
@@ -717,7 +760,16 @@
 
   const openTable = (val) => {
     active.value = val;
-    initTable(val)
+    if(val > 2) {
+      initTable(val)
+    } else {
+      showModal.value = true;
+      if(val == 1) {
+        getWaterChart()
+      } else if(val == 2) {
+        getEleChart()
+      }
+    }
   }
 
   watch(active, (newVal) => {
@@ -743,12 +795,86 @@
   let timeInit = null;
 
 
+  // 拿到水电表编号
+  const eleCode = ref([])
+  const waterCode = ref([])
+  const initCode = async () => {
+    await getEleAndWaterCode({ type: 0 }).then(res => {
+      if(res.code === 10000) {
+        eleCode.value = res.data;
+        eleId.value = res.data.length > 0 ? res.data[0].unitId: ''
+      }
+    })
+    await getEleAndWaterCode({ type: 1 }).then(res => {
+      if(res.code === 10000) {
+        waterCode.value = res.data
+        waterId.value = res.data.length > 0 ? res.data[0].unitId: ''
+      }
+    })
+  }
+
+  // 选中水表
+  const waterId = ref('')
+  const waterType = ref(1)
+  const waterList = ref([])
+  const getWaterChart = () => {
+    if(waterId.value === '') {
+      return;
+    }
+    let params = {
+      type: waterType.value,
+      unitId: waterId.value,
+      displayType: displayList.value.waterDisplayType
+    }
+    waterList.value = []
+    getEnergyWaterChart(params).then(res => {
+      if(res.code === 10000) {
+        waterList.value = res.data
+      }
+    })
+  }
+  watch(waterId, () => {
+    getWaterChart()
+  })
+  watch(waterType, () => {
+    getWaterChart()
+  })
+
+  // 选中电表
+  const eleId = ref('')
+  const eleType = ref(1)
+  const eleList = ref([])
+  const getEleChart = () => {
+    if(eleId.value === '') {
+      return;
+    }
+    let params = {
+      type: eleType.value,
+      unitId: eleId.value,
+      displayType: displayList.value.electricityDisplayType
+    }
+    eleList.value = []
+    getEnergyEleChart(params).then(res => {
+      if(res.code === 10000) {
+        eleList.value = res.data
+      }
+    })
+  }
+  watch(eleId, () => {
+    getEleChart()
+  })
+  watch(eleType, () => {
+    getEleChart()
+  })
+
+
 
   onMounted(async () => {
     show.value = true;
     await initDisplay()
     await init()
     await initTotal()
+    await initCode()
     initRank()
     initWarn()
     await initFeed()
@@ -1204,4 +1330,8 @@
     background-color: black; /* 设置背景颜色为黑色 */
     color: white; /* 设置文字颜色为白色，以提高可读性 */
   }
+  .chart_content {
+    width: 100%;
+    height: 800px;
+  }
 </style>

src/views/Pro/Pro.vue

@@ -7,14 +7,17 @@
         leave-active-class="animate__animated animate__fadeOutLeft"
       >
         <div class="energy_box" v-show="show">
-          <div class="box_title">数据统计</div>
+          <div class="box_title">
+            数据统计
+            <span style="float: right; cursor: pointer" @click="openScreen"><FormOutlined style="font-size: 16px; color: #f1f1f1" /></span>
+          </div>
           <div class="chart_vessel_grid">
             <template v-if="farmId == 26">
               <div class="total_box">
                 <div class="total_img pro_img1"></div>
                 <div class="total_number">
-                  <div class="number_title">出栏成活率</div>
-                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="sjtj?.CLCH"></count-to>%</div>
+                  <div class="number_title">今日淘汰数(只)</div>
+                  <div class="number_int"><count-to :startVal="0" :end-val="sjtj?.SWPIG"></count-to></div>
                 </div>
               </div>
               <div class="total_box">
@@ -40,34 +43,34 @@
               </div>
             </template>
             <template v-else>
-              <div class="total_box">
-                <div class="total_img pro_img1"></div>
+              <div v-for="(item, i) in infoList" :key="item.name" class="total_box">
+                <div :class="['total_img', 'pro_img' + (i+1)]"></div>
                 <div class="total_number">
-                  <div class="number_title">保育成活率</div>
-                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="info.bychl"></count-to>%</div>
-                </div>
-              </div>
-              <div class="total_box">
-                <div class="total_img pro_img2"></div>
-                <div class="total_number">
-                  <div class="number_title">育肥成活率</div>
-                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="info.yfchl"></count-to>%</div>
-                </div>
-              </div>
-              <div class="total_box">
-                <div class="total_img pro_img3"></div>
-                <div class="total_number">
-                  <div class="number_title">每日喂料量(只)</div>
-                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="info.mrwll"></count-to>kg</div>
-                </div>
-              </div>
-              <div class="total_box">
-                <div class="total_img pro_img4"></div>
-                <div class="total_number">
-                  <div class="number_title">日增重(只)</div>
-                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="info.rzz"></count-to>kg</div>
+                  <div class="number_title">{{item.name}}</div>
+                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="item.value"></count-to>{{item.unit}}</div>
                 </div>
               </div>
+<!--              <div class="total_box">-->
+<!--                <div class="total_img pro_img2"></div>-->
+<!--                <div class="total_number">-->
+<!--                  <div class="number_title">育肥成活率</div>-->
+<!--                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="info.yfchl"></count-to>%</div>-->
+<!--                </div>-->
+<!--              </div>-->
+<!--              <div class="total_box">-->
+<!--                <div class="total_img pro_img3"></div>-->
+<!--                <div class="total_number">-->
+<!--                  <div class="number_title">每日喂料量(只)</div>-->
+<!--                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="info.mrwll"></count-to>kg</div>-->
+<!--                </div>-->
+<!--              </div>-->
+<!--              <div class="total_box">-->
+<!--                <div class="total_img pro_img4"></div>-->
+<!--                <div class="total_number">-->
+<!--                  <div class="number_title">日增重(只)</div>-->
+<!--                  <div class="number_int"><count-to :startVal="0" :decimals="2"  :end-val="info.rzz"></count-to>kg</div>-->
+<!--                </div>-->
+<!--              </div>-->
             </template>
           </div>
         </div>
@@ -81,12 +84,12 @@
           <div class="box_title">牧场存栏</div>
           <div class="chart_vessel">
             <template v-if="farmId == 26">
-                <chart-pie v-if="mcList.length > 0" :id="1" :list="mcList">
+                <chart-pie v-if="mcList.length > 0" :id="1" :val="mcMaxVal" :list="mcList">
 <!--                <div v-else style="line-height: 150px; text-align: center; color: #fff;">暂无数据</div>-->
               </chart-pie>
             </template>
             <template v-else>
-              <chart-pie :id="0" v-if="stockList.length > 0" :list="stockList"></chart-pie>
+              <chart-pie :id="0" v-if="stockList.length > 0" :val="stockMaxVal" :list="stockList"></chart-pie>
               <div v-else style="line-height: 150px; text-align: center; color: #fff;">暂无数据</div>
             </template>
 <!--            <chart-stock :id="0" :list="stockList"></chart-stock>-->
@@ -203,7 +206,11 @@
         <div class="energy_box" v-show="show">
           <div class="box_title">销售分析</div>
           <div class="chart_vessel">
-            <div class="chart_select">
+            <div class="chart_select" v-if="farmId == 26">
+              <div :class="['default_box', active === 1 ? 'active_box' : '']">月</div>
+              <div :class="['default_box', active === 2 ? 'active_box' : '']">7日</div>
+            </div>
+            <div class="chart_select" v-else>
               <div :class="['default_box', active === 1 ? 'active_box' : '']">月</div>
               <div :class="['default_box', active === 2 ? 'active_box' : '']">年</div>
             </div>
@@ -337,9 +344,63 @@
       </div>
     </div>
   </transition>
+  <a-modal v-model:visible="showScreen" width="800px" title="大屏展示" @ok="handleOk">
+    <a-checkbox-group v-model:value="screenList" style="width: 100%">
+      <a-row>
+        <a-col :span="8">
+          <a-checkbox value="1" :disabled="(screenList.length < 4) || screenList.includes('1') === true ? false : true">产房成活率: {{info.cfchl}}%</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="2" :disabled="screenList.length < 4 || screenList.includes('2') === true ? false : true">保育成活率: {{info.bychl}}%</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="3" :disabled="screenList.length < 4 || screenList.includes('3') === true ? false : true">育肥成活率: {{info.yfchl}}%</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="4" :disabled="screenList.length < 4 || screenList.includes('4') === true ? false : true">肥猪成活率: {{info.fzchl}}%</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="5" :disabled="screenList.length < 4 || screenList.includes('5') === true ? false : true">每日喂料量(只): {{info.mrwll}}kg</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="6" :disabled="screenList.length < 4 || screenList.includes('6') === true ? false : true">日增重(只): {{info.rzz}}kg</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="7" :disabled="screenList.length < 4 || screenList.includes('7') === true ? false : true">7日断配率: {{info.qrdpl}}%</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="8" :disabled="screenList.length < 4 || screenList.includes('8') === true ? false : true">配种分娩率: {{info.pzfml}}%</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="9" :disabled="screenList.length < 4 || screenList.includes('9') === true ? false : true">平均窝产仔数(只): {{info.pjwczs}}</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="10" :disabled="screenList.length < 4 || screenList.includes('10') === true ? false : true">平均窝产活仔数(只): {{info.pjwchzs}}</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="11" :disabled="screenList.length < 4 || screenList.includes('11') === true ? false : true">平均窝产正常仔数(只): {{info.pjwczczs}}</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="12" :disabled="screenList.length < 4 || screenList.includes('12') === true ? false : true">平均窝断奶重: {{info.pjwdnz}}</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="13" :disabled="screenList.length < 4 || screenList.includes('13') === true ? false : true">窝断奶仔猪数: {{info.wdnzzs}}</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="14" :disabled="screenList.length < 4 || screenList.includes('14') === true ? false : true">非生产天数: {{info.fccts}}</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="15" :disabled="screenList.length < 4 || screenList.includes('15') === true ? false : true">年产窝数: {{info.scws}}</a-checkbox>
+        </a-col>
+        <a-col :span="8">
+          <a-checkbox value="16" :disabled="screenList.length < 4 || screenList.includes('16') === true ? false : true">psy: {{info.psy}}</a-checkbox>
+        </a-col>
+      </a-row>
+    </a-checkbox-group>
+  </a-modal>
 </template>
 <script setup>
-  import { CloseCircleOutlined } from "@ant-design/icons-vue";
+  import { CloseCircleOutlined, FormOutlined } from "@ant-design/icons-vue";
   import { ref, onMounted, watch, getCurrentInstance, onBeforeUnmount } from 'vue';
   import { onBeforeRouteLeave } from 'vue-router';
   import {
@@ -351,7 +412,7 @@
     getFarm,
     getDisplayType,
     getProWarn,
-    getHengLuPro, getHengLuInPig, getHengLuMonthPig
+    getHengLuPro, getHengLuInPig, getHengLuMonthPig, getHengLuSale, getProInfoList, addScreenProd
   } from "../../utils/api";
   import { MonthDate } from "../../utils";
   import { CountTo } from 'vue3-count-to';
@@ -362,6 +423,7 @@
   import ChartCl from "./charts/ChartCl.vue";
   import XTabs from '../../components/XTabs.vue';
   import XTable from '../../components/table/XTable.vue'
+  import { message } from "ant-design-vue";
 
 
   const { proxy } = getCurrentInstance()
@@ -370,21 +432,53 @@
 
   // 数据统计
   const info = ref({
-    bychl: 0,
-    mrwll: 0,
-    rzz: 0,
-    yfchl: 0
+    cfchl: '',
+    bychl: '',
+    fzchl: '',
+    qrdpl: '',
+    pzfml: '',
+    pjwczs: '',
+    pjwchzs: '',
+    pjwczczs: '',
+    pjwdnz: '',
+    wdnzzs: '',
+    fccts: '',
+    scws: '',
+    psy: '',
+    yfchl: '',
+    mrwll: '',
+    rzz: '',
   });
 
+  const infoList = ref([]);
+
   const initInfo = () => {
     getProList({}).then(res => {
       if(res.code === 10000) {
         info.value = {
+          cfchl: res.data.cfchl,
           bychl: res.data.bychl,
+          fzchl: res.data.fzchl,
+          qrdpl: res.data.qrdpl,
+          pzfml: res.data.pzfml,
+          pjwczs: res.data.pjwczs,
+          pjwchzs: res.data.pjwchzs,
+          pjwczczs: res.data.pjwczczs,
+          pjwdnz: res.data.pjwdnz,
+          wdnzzs: res.data.wdnzzs,
+          fccts: res.data.fccts,
+          scws: res.data.scws,
+          psy: res.data.psy,
+          yfchl: res.data.yfchl,
           mrwll: res.data.mrwll,
           rzz: res.data.rzz,
-          yfchl: res.data.yfchl
         }
+        screenList.value = res.data.other1 ? res.data.other1.split(','): []
+      }
+    })
+    getProInfoList({}).then(res => {
+      if(res.code === 10000) {
+        infoList.value = res.data
       }
     })
   }
@@ -417,6 +511,7 @@
   ])
   const lineList = ref([]);
 
+  const stockMaxVal = ref(0)
   const initStock = async () => {
     let params = {
       eventType: 3
@@ -430,6 +525,7 @@
         stockList.value[3].value = res.data.prodStock.mzcl;
         stockList.value[4].value = res.data.prodStock.gzcl;
         stockList.value[5].value = res.data.prodStock.hbzcl;
+        stockMaxVal.value = res.data.prodStock.zcl;
         lineList.value = res.data.prodStocks;
       }
     })
@@ -443,23 +539,18 @@
     list: []
   });
   const initSale = async () => {
-    let params2 = {
-      eventType: 4
-    }
-    let result = await getDisplayType(params2);
-    let params = {
-      type: active.value,
-      displayType: result.data.displayType
-    }
-    getSale(params).then(res => {
-      if(res.code === 10000) {
+    if(farmId.value == 26) {
+      let params = {
+        type: active.value,
+      }
+      getHengLuSale(params).then(res => {
         let arr = [];
         res.data.forEach(item => {
           let time = '';
           if(active.value === 1) {
             time = proxy.$moment(item.creatTime).format('YYYY-MM')
           } else {
-            time = proxy.$moment(item.creatTime).format('YYYY')
+            time = proxy.$moment(item.creatTime).format('MM-DD')
           }
           arr.push({
             time: time,
@@ -467,8 +558,36 @@
           });
         })
         saleData.value.list = arr;
+      })
+    } else {
+      let params2 = {
+        eventType: 4
       }
-    })
+      let result = await getDisplayType(params2);
+      let params = {
+        type: active.value,
+        displayType: result.data.displayType
+      }
+      getSale(params).then(res => {
+        if(res.code === 10000) {
+          let arr = [];
+          res.data.forEach(item => {
+            let time = '';
+            if(active.value === 1) {
+              time = proxy.$moment(item.creatTime).format('YYYY-MM')
+            } else {
+              time = proxy.$moment(item.creatTime).format('YYYY')
+            }
+            arr.push({
+              time: time,
+              value: item.saleQuantity
+            });
+          })
+          saleData.value.list = arr;
+        }
+      })
+    }
+
   }
   watch(active, () => {
     initSale()
@@ -624,6 +743,7 @@
   ])
   const clList = ref([])
   const clData = ref({})
+  const mcMaxVal = ref(0)
   const initHengLu = () => {
     getHengLuPro({}).then(res => {
       if(res.code === 10000) {
@@ -633,6 +753,7 @@
         mcList.value[1].value = res.data.MCCL.dong2;
         mcList.value[2].value = res.data.MCCL.dong3;
         mcList.value[3].value = res.data.MCCL.dong4;
+        mcMaxVal.value = res.data.MCCL.zcl;
         clList.value = res.data.CLBD;
       }
     })
@@ -801,11 +922,39 @@
     })
   }
 
+  const showScreen = ref(false)
+  const screenList = ref([])
+  const openScreen = () => {
+    showScreen.value = true
+  }
+
+  const handleOk = () => {
+    if(screenList.value.length < 4) {
+      message.error('请选择4个展示！')
+      return;
+    }
+    let str = screenList.value.join(',');
+    addScreenProd({other1: str}).then(res => {
+      if(res.code === 10000) {
+        message.success(res.message);
+        showScreen.value = false;
+        initInfo()
+      } else {
+        message.error(res.message);
+      }
+    })
+  }
+
   onMounted( async () => {
     show.value = true;
-    initHengLu()
+    if(farmId.value == 26) {
+      initHengLu()
+    } else {
+      await initStock()
+    }
+
+    // initHengLu()
     initFarm()
-    await initStock()
     await initCost()
     initSale()
     initPro()