| | |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: 'PublicBox', |
|---|
| | | props: ['className'], |
|---|
| | | props: ['className', 'closeFlag'], |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | } |
|---|
| | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | close () { |
|---|
| | | this.$parent.closeCurrentPopup() |
|---|
| | | this.$parent[this.closeFlag] = false |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | * @Author: Morpheus |
|---|
| | | * @Date: 2022-05-11 15:00:23 |
|---|
| | | * @Last Modified by: Morpheus |
|---|
| | | * @Last Modified time: 2022-07-13 15:45:17 |
|---|
| | | * @Last Modified time: 2022-07-13 16:05:48 |
|---|
| | | * 驾驶舱 |
|---|
| | | */ |
|---|
| | | <template> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <public-box v-show="tracePopupFlag" :className="'public-trace-table'"> |
|---|
| | | <public-box |
|---|
| | | v-show="tracePopupFlag" |
|---|
| | | :closeFlag="'tracePopupFlag'" |
|---|
| | | :className="'public-trace-table'" |
|---|
| | | > |
|---|
| | | <template slot="public-box-header"> |
|---|
| | | <div class="logo"></div> |
|---|
| | | <div class="title">农产品溯源码</div> |
|---|
| | | <img @click="closeCurrentPopup" src="/img/icon/public-close.png" alt class="close" /> |
|---|
| | | <img |
|---|
| | | @click="tracePopupFlag = false" |
|---|
| | | src="/img/icon/public-close.png" |
|---|
| | | alt |
|---|
| | | class="close" |
|---|
| | | /> |
|---|
| | | </template> |
|---|
| | | <template slot="public-box-content"> |
|---|
| | | <div class="action-bar"> |
|---|
| | |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // 关闭弹框 |
|---|
| | | closeCurrentPopup () { |
|---|
| | | this.tracePopupFlag = false |
|---|
| | | }, |
|---|
| | | setCenter (item) { |
|---|
| | | this.ncListShow = false |
|---|
| | | this.$refs.modalForm.setPlotCenter(item.landName) |
|---|
| | |
|---|
| | | * @Author: Morpheus |
|---|
| | | * @Date: 2022-05-11 15:00:23 |
|---|
| | | * @Last Modified by: Morpheus |
|---|
| | | * @Last Modified time: 2022-07-13 09:28:02 |
|---|
| | | * @Last Modified time: 2022-07-13 16:03:19 |
|---|
| | | * 驾驶舱 |
|---|
| | | */ |
|---|
| | | <template> |
|---|
| | |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <public-box v-show="cityShow" class="public-org-market-bar"> |
|---|
| | | <public-box v-show="cityShow" :closeFlag="'cityShow'" :className="'public-org-market-bar'"> |
|---|
| | | <template slot="public-box-header"> |
|---|
| | | <div class="logo"></div> |
|---|
| | | <div class="title">市场流通</div> |
|---|
| | |
|---|
| | | </template> |
|---|
| | | </public-box> |
|---|
| | | |
|---|
| | | <public-box v-if="farmProfiles" class="public-org-nav-bar"> |
|---|
| | | <public-box |
|---|
| | | v-if="farmProfiles" |
|---|
| | | :closeFlag="'farmProfiles'" |
|---|
| | | :className="'public-org-nav-bar'" |
|---|
| | | > |
|---|
| | | <template slot="public-box-header"> |
|---|
| | | <div class="logo"></div> |
|---|
| | | <div class="title">{{this.farmDetails.farmName}}</div> |
|---|
| | |
|---|
| | | /* |
|---|
| | | * @Author: Morpheus |
|---|
| | | * @Date: 2022-05-11 15:00:23 |
|---|
| | | * @Last Modified by: Morpheus |
|---|
| | | * @Last Modified time: 2022-07-01 12:00:07 |
|---|
| | | * @Last Modified by: Morpheus |
|---|
| | | * @Last Modified time: 2022-07-13 16:05:01 |
|---|
| | | * 经营主体监管 |
|---|
| | | */ |
|---|
| | | <template> |
|---|
| | |
|---|
| | | <div class="main-content"> |
|---|
| | | <div class="t"> |
|---|
| | | <statistics-num |
|---|
| | | :className="'td'" |
|---|
| | | :totalRegion="znum" |
|---|
| | | :imgUrl="'/img/icon/mj.png'" |
|---|
| | | :unit="'亩'" |
|---|
| | | :title="'土地面积'" |
|---|
| | | :subOneTitle="'使用面积'" |
|---|
| | | :subOneNum="landsnum" |
|---|
| | | :subTwoTitle="'未使用面积'" |
|---|
| | | :subTwoNum="landwnum" |
|---|
| | | :className="'td'" |
|---|
| | | :totalRegion="znum" |
|---|
| | | :imgUrl="'/img/icon/mj.png'" |
|---|
| | | :unit="'亩'" |
|---|
| | | :title="'土地面积'" |
|---|
| | | :subOneTitle="'使用面积'" |
|---|
| | | :subOneNum="landsnum" |
|---|
| | | :subTwoTitle="'未使用面积'" |
|---|
| | | :subTwoNum="landwnum" |
|---|
| | | ></statistics-num> |
|---|
| | | <statistics-num |
|---|
| | | :className="'kc'" |
|---|
| | | :totalRegion="stockTj" |
|---|
| | | :imgUrl="'/img/icon/kc.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'库存数量'" |
|---|
| | | :subOneTitle="'农产品'" |
|---|
| | | :subOneNum="stockNCP" |
|---|
| | | :subTwoTitle="'加工产品'" |
|---|
| | | :subTwoNum="stockJG" |
|---|
| | | :className="'kc'" |
|---|
| | | :totalRegion="stockTj" |
|---|
| | | :imgUrl="'/img/icon/kc.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'库存数量'" |
|---|
| | | :subOneTitle="'农产品'" |
|---|
| | | :subOneNum="stockNCP" |
|---|
| | | :subTwoTitle="'加工产品'" |
|---|
| | | :subTwoNum="stockJG" |
|---|
| | | ></statistics-num> |
|---|
| | | <statistics-num |
|---|
| | | :className="'nz'" |
|---|
| | | :totalRegion="jnStock" |
|---|
| | | :imgUrl="'/img/icon/syl.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'农资年使用量'" |
|---|
| | | :subOneTitle="'去年使用'" |
|---|
| | | :subOneNum="qnStock" |
|---|
| | | :subTwoTitle="'本月使用'" |
|---|
| | | :subTwoNum="byStock" |
|---|
| | | :className="'nz'" |
|---|
| | | :totalRegion="jnStock" |
|---|
| | | :imgUrl="'/img/icon/syl.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'农资年使用量'" |
|---|
| | | :subOneTitle="'去年使用'" |
|---|
| | | :subOneNum="qnStock" |
|---|
| | | :subTwoTitle="'本月使用'" |
|---|
| | | :subTwoNum="byStock" |
|---|
| | | ></statistics-num> |
|---|
| | | <statistics-num |
|---|
| | | :className="'cl'" |
|---|
| | | :totalRegion="yieldTj" |
|---|
| | | :imgUrl="'/img/icon/ncl.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'年产量'" |
|---|
| | | :subOneTitle="'农产品'" |
|---|
| | | :subOneNum="yieldNCP" |
|---|
| | | :subTwoTitle="'加工产品'" |
|---|
| | | :subTwoNum="yieldJG" |
|---|
| | | :className="'cl'" |
|---|
| | | :totalRegion="yieldTj" |
|---|
| | | :imgUrl="'/img/icon/ncl.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'年产量'" |
|---|
| | | :subOneTitle="'农产品'" |
|---|
| | | :subOneNum="yieldNCP" |
|---|
| | | :subTwoTitle="'加工产品'" |
|---|
| | | :subTwoNum="yieldJG" |
|---|
| | | ></statistics-num> |
|---|
| | | <statistics-num |
|---|
| | | :className="'lt'" |
|---|
| | | :totalRegion="salaNumBN" |
|---|
| | | :imgUrl="'/img/icon/lt.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'市场流通量'" |
|---|
| | | :subOneTitle="'去年流通量'" |
|---|
| | | :subOneNum="salaNumQN" |
|---|
| | | :subTwoTitle="'本月流通量'" |
|---|
| | | :subTwoNum="salaNumBY" |
|---|
| | | :className="'lt'" |
|---|
| | | :totalRegion="salaNumBN" |
|---|
| | | :imgUrl="'/img/icon/lt.png'" |
|---|
| | | :unit="'公斤'" |
|---|
| | | :title="'市场流通量'" |
|---|
| | | :subOneTitle="'去年流通量'" |
|---|
| | | :subOneNum="salaNumQN" |
|---|
| | | :subTwoTitle="'本月流通量'" |
|---|
| | | :subTwoNum="salaNumBY" |
|---|
| | | ></statistics-num> |
|---|
| | | </div> |
|---|
| | | <div class="c"> |
|---|
| | | <div class="time-box"> |
|---|
| | | <time-box |
|---|
| | | :imgUrl="'/img/icon/current.png'" |
|---|
| | | :title="'溯源次数'" |
|---|
| | | :currentNum="sweepList['todayNum']" |
|---|
| | | :subTitle="'昨日溯源次数对比'" |
|---|
| | | :contrast="sweepList['yesterdayNum']" |
|---|
| | | :upDown="sweepList['todayNum'] > sweepList['yesterdayNum'] ? 'up' : 'down'" |
|---|
| | | :imgUrl="'/img/icon/current.png'" |
|---|
| | | :title="'溯源次数'" |
|---|
| | | :currentNum="sweepList['todayNum']" |
|---|
| | | :subTitle="'昨日溯源次数对比'" |
|---|
| | | :contrast="sweepList['yesterdayNum']" |
|---|
| | | :upDown="sweepList['todayNum'] > sweepList['yesterdayNum'] ? 'up' : 'down'" |
|---|
| | | ></time-box> |
|---|
| | | <time-box |
|---|
| | | :imgUrl="'/img/icon/week.png'" |
|---|
| | | :title="'溯源次数'" |
|---|
| | | :currentNum="sweepList['thisWeekNum']" |
|---|
| | | :subTitle="'上周溯源次数对比'" |
|---|
| | | :contrast="sweepList['lastWeekNum']" |
|---|
| | | :upDown="sweepList['thisWeekNum'] > sweepList['lastWeekNum'] ? 'up' : 'down'" |
|---|
| | | :imgUrl="'/img/icon/week.png'" |
|---|
| | | :title="'溯源次数'" |
|---|
| | | :currentNum="sweepList['thisWeekNum']" |
|---|
| | | :subTitle="'上周溯源次数对比'" |
|---|
| | | :contrast="sweepList['lastWeekNum']" |
|---|
| | | :upDown="sweepList['thisWeekNum'] > sweepList['lastWeekNum'] ? 'up' : 'down'" |
|---|
| | | ></time-box> |
|---|
| | | <time-box |
|---|
| | | :imgUrl="'/img/icon/month.png'" |
|---|
| | | :title="'溯源次数'" |
|---|
| | | :currentNum="sweepList['thisMonthNum']" |
|---|
| | | :subTitle="'上月溯源次数对比'" |
|---|
| | | :contrast="sweepList['lastMonthNum']" |
|---|
| | | :upDown="sweepList['thisMonthNum'] > sweepList['lastMonthNum'] ? 'up' : 'down'" |
|---|
| | | :imgUrl="'/img/icon/month.png'" |
|---|
| | | :title="'溯源次数'" |
|---|
| | | :currentNum="sweepList['thisMonthNum']" |
|---|
| | | :subTitle="'上月溯源次数对比'" |
|---|
| | | :contrast="sweepList['lastMonthNum']" |
|---|
| | | :upDown="sweepList['thisMonthNum'] > sweepList['lastMonthNum'] ? 'up' : 'down'" |
|---|
| | | ></time-box> |
|---|
| | | </div> |
|---|
| | | <div class="task-box"> |
|---|
| | |
|---|
| | | |
|---|
| | | <div class="more" @click="popDetailedSupervise"> |
|---|
| | | 明细 |
|---|
| | | <img src="/img/icon/more.png" alt/> |
|---|
| | | <img src="/img/icon/more.png" alt /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | <div class="more" @click="popDetailedFarming"> |
|---|
| | | 更多 |
|---|
| | | <img src="/img/icon/more.png" alt/> |
|---|
| | | <img src="/img/icon/more.png" alt /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <public-box v-show="trpPopupFlag" class="public-trace-table"> |
|---|
| | | <public-box v-show="trpPopupFlag" :closeFlag="'trpPopupFlag'" class="'public-trace-table'"> |
|---|
| | | <template slot="public-box-header"> |
|---|
| | | <div class="logo"></div> |
|---|
| | | <div class="title">投入品监管明细</div> |
|---|
| | | <img |
|---|
| | | @click="trpPopupFlag = false" |
|---|
| | | src="/img/icon/public-close.png" |
|---|
| | | alt |
|---|
| | | class="close" |
|---|
| | | @click="trpPopupFlag = false" |
|---|
| | | src="/img/icon/public-close.png" |
|---|
| | | alt |
|---|
| | | class="close" |
|---|
| | | /> |
|---|
| | | </template> |
|---|
| | | <template slot="public-box-content"> |
|---|
| | | <div class="action-bar"> |
|---|
| | | <div class="search"> |
|---|
| | | <el-input |
|---|
| | | class="search-input" |
|---|
| | | size="small" |
|---|
| | | prefix-icon="el-icon-search" |
|---|
| | | placeholder="请输入内容" |
|---|
| | | v-model="input1" |
|---|
| | | class="search-input" |
|---|
| | | size="small" |
|---|
| | | prefix-icon="el-icon-search" |
|---|
| | | placeholder="请输入内容" |
|---|
| | | v-model="input1" |
|---|
| | | ></el-input> |
|---|
| | | </div> |
|---|
| | | <div class="btn-grounp"> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | class="search" |
|---|
| | | type="primary" |
|---|
| | | icon="el-icon-search" |
|---|
| | | size="small" |
|---|
| | | class="search" |
|---|
| | | type="primary" |
|---|
| | | icon="el-icon-search" |
|---|
| | | >查询</el-button> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | class="reset" |
|---|
| | | type="info" |
|---|
| | | icon="el-icon-refresh-right" |
|---|
| | | size="small" |
|---|
| | | class="reset" |
|---|
| | | type="info" |
|---|
| | | icon="el-icon-refresh-right" |
|---|
| | | >重置</el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div>42袋</div> |
|---|
| | | <div> |
|---|
| | | <el-button |
|---|
| | | @click="openPopup('/img/icon/sym.png')" |
|---|
| | | size="small" |
|---|
| | | class="look" |
|---|
| | | type="info" |
|---|
| | | @click="openPopup('/img/icon/sym.png')" |
|---|
| | | size="small" |
|---|
| | | class="look" |
|---|
| | | type="info" |
|---|
| | | >查看</el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | </template> |
|---|
| | | </public-box> |
|---|
| | | |
|---|
| | | <public-box v-show="nsjlPopupFlag" class="public-trace-table"> |
|---|
| | | <public-box |
|---|
| | | v-show="nsjlPopupFlag" |
|---|
| | | :closeFlag="'nsjlPopupFlag'" |
|---|
| | | :className="'public-trace-table'" |
|---|
| | | > |
|---|
| | | <template slot="public-box-header"> |
|---|
| | | <div class="logo"></div> |
|---|
| | | <div class="title">农事记录</div> |
|---|
| | | <img |
|---|
| | | @click="nsjlPopupFlag = false" |
|---|
| | | src="/img/icon/public-close.png" |
|---|
| | | alt |
|---|
| | | class="close" |
|---|
| | | @click="nsjlPopupFlag = false" |
|---|
| | | src="/img/icon/public-close.png" |
|---|
| | | alt |
|---|
| | | class="close" |
|---|
| | | /> |
|---|
| | | </template> |
|---|
| | | <template slot="public-box-content"> |
|---|
| | | <div class="action-bar"> |
|---|
| | | <div class="search"> |
|---|
| | | <el-input |
|---|
| | | class="search-input" |
|---|
| | | size="small" |
|---|
| | | prefix-icon="el-icon-search" |
|---|
| | | placeholder="请输入内容" |
|---|
| | | v-model="input1" |
|---|
| | | class="search-input" |
|---|
| | | size="small" |
|---|
| | | prefix-icon="el-icon-search" |
|---|
| | | placeholder="请输入内容" |
|---|
| | | v-model="input1" |
|---|
| | | ></el-input> |
|---|
| | | </div> |
|---|
| | | <div class="btn-grounp"> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | class="search" |
|---|
| | | type="primary" |
|---|
| | | icon="el-icon-search" |
|---|
| | | size="small" |
|---|
| | | class="search" |
|---|
| | | type="primary" |
|---|
| | | icon="el-icon-search" |
|---|
| | | >查询</el-button> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | class="reset" |
|---|
| | | type="info" |
|---|
| | | icon="el-icon-refresh-right" |
|---|
| | | size="small" |
|---|
| | | class="reset" |
|---|
| | | type="info" |
|---|
| | | icon="el-icon-refresh-right" |
|---|
| | | >重置</el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div>人工</div> |
|---|
| | | <div> |
|---|
| | | <el-button |
|---|
| | | @click="openPopup('/img/icon/sym.png')" |
|---|
| | | size="small" |
|---|
| | | class="look" |
|---|
| | | type="info" |
|---|
| | | @click="openPopup('/img/icon/sym.png')" |
|---|
| | | size="small" |
|---|
| | | class="look" |
|---|
| | | type="info" |
|---|
| | | >查看</el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </public-box> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import { selectXCount } from '@/api/land/land' |
|---|
| | | // eslint-disable-next-line no-unused-vars |
|---|
| | | import { |
|---|
| | | page, |
|---|
| | | getStockCount, |
|---|
| | | pagePalnt, |
|---|
| | | statisticsStockAndYield, |
|---|
| | | pageCount, |
|---|
| | | pageCountNz, |
|---|
| | | selectMarketCirculate, |
|---|
| | | countTaskNum, |
|---|
| | | farmingRecords, |
|---|
| | | statisticsStockMonth, |
|---|
| | | productsSupervise, |
|---|
| | | pageCountNzCrk, |
|---|
| | | getSweepRecordStatistics, |
|---|
| | | getSweepRecordStatisticsByDayOrMonthOrYear |
|---|
| | | } from '@/api/farm/farmingrecord' |
|---|
| | | import { selectXCount } from '@/api/land/land' |
|---|
| | | // eslint-disable-next-line no-unused-vars |
|---|
| | | import { |
|---|
| | | page, |
|---|
| | | getStockCount, |
|---|
| | | pagePalnt, |
|---|
| | | statisticsStockAndYield, |
|---|
| | | pageCount, |
|---|
| | | pageCountNz, |
|---|
| | | selectMarketCirculate, |
|---|
| | | countTaskNum, |
|---|
| | | farmingRecords, |
|---|
| | | statisticsStockMonth, |
|---|
| | | productsSupervise, |
|---|
| | | pageCountNzCrk, |
|---|
| | | getSweepRecordStatistics, |
|---|
| | | getSweepRecordStatisticsByDayOrMonthOrYear |
|---|
| | | } from '@/api/farm/farmingrecord' |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | landsnum: 0, |
|---|
| | | landwnum: 0, |
|---|
| | | znum: 0, |
|---|
| | | jnStock: 0, |
|---|
| | | qnStock: 0, |
|---|
| | | byStock: 0, |
|---|
| | | farmPlanList: [], |
|---|
| | | // 库存数量统计 |
|---|
| | | stockTj: 0, |
|---|
| | | // 农产品数量统计 |
|---|
| | | stockNCP: 0, |
|---|
| | | // 加工产品数量统计 |
|---|
| | | stockJG: 0, |
|---|
| | | // 产量按月统计 |
|---|
| | | yieldMonth: [], |
|---|
| | | // 年产量统计 |
|---|
| | | yieldTj: 0, |
|---|
| | | // 农产品年产量统计 |
|---|
| | | yieldNCP: 0, |
|---|
| | | // 加工产品年产量统计 |
|---|
| | | yieldJG: 0, |
|---|
| | | // 农产品投入 |
|---|
| | | ncptr: [], |
|---|
| | | nztr: [], |
|---|
| | | // 统计市场流通/去年流通量/本月流通量 |
|---|
| | | salaNumBN: [], |
|---|
| | | salaNumBY: [], |
|---|
| | | salaNumQN: [], |
|---|
| | | // 统计任务总数 |
|---|
| | | taskNum: [], |
|---|
| | | // 农事记录 |
|---|
| | | farminList: [], |
|---|
| | | // 农资出入库记录 |
|---|
| | | stockrecordList: [], |
|---|
| | | // 农产品监管 |
|---|
| | | NcpJg: [], |
|---|
| | | // 溯源次数 |
|---|
| | | sweepList: {}, |
|---|
| | | // 溯源趋势 |
|---|
| | | sweepTrend: [], |
|---|
| | | nzOrNcp: 'ncp', |
|---|
| | | trpOrNcp: 'trp', |
|---|
| | | nsjlOrnz: 'nsjl', |
|---|
| | | cltjOrsym: 'cltj', |
|---|
| | | // 投入品监管窗体控制 |
|---|
| | | trpPopupFlag: false, |
|---|
| | | // 农事记录 |
|---|
| | | nsjlPopupFlag: false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | created () { |
|---|
| | | this.selectXCount() |
|---|
| | | this.getStockCount() |
|---|
| | | this.page() |
|---|
| | | // 年产量与库存数量 |
|---|
| | | this.statisticsStockAndYield() |
|---|
| | | // 按月统计产量 |
|---|
| | | this.statisticsStockMonth('2022-07') |
|---|
| | | export default { |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | landsnum: 0, |
|---|
| | | landwnum: 0, |
|---|
| | | znum: 0, |
|---|
| | | jnStock: 0, |
|---|
| | | qnStock: 0, |
|---|
| | | byStock: 0, |
|---|
| | | farmPlanList: [], |
|---|
| | | // 库存数量统计 |
|---|
| | | stockTj: 0, |
|---|
| | | // 农产品数量统计 |
|---|
| | | stockNCP: 0, |
|---|
| | | // 加工产品数量统计 |
|---|
| | | stockJG: 0, |
|---|
| | | // 产量按月统计 |
|---|
| | | yieldMonth: [], |
|---|
| | | // 年产量统计 |
|---|
| | | yieldTj: 0, |
|---|
| | | // 农产品年产量统计 |
|---|
| | | yieldNCP: 0, |
|---|
| | | // 加工产品年产量统计 |
|---|
| | | yieldJG: 0, |
|---|
| | | // 农产品投入 |
|---|
| | | this.pageCount('2022-07') |
|---|
| | | // 农资投入 |
|---|
| | | this.pageCountNz('2022-07') |
|---|
| | | ncptr: [], |
|---|
| | | nztr: [], |
|---|
| | | // 统计市场流通/去年流通量/本月流通量 |
|---|
| | | this.selectMarketCirculate() |
|---|
| | | salaNumBN: [], |
|---|
| | | salaNumBY: [], |
|---|
| | | salaNumQN: [], |
|---|
| | | // 统计任务总数 |
|---|
| | | this.countTaskNum('2022-07') |
|---|
| | | // 溯源趋势统计 |
|---|
| | | this.getSweepRecordStatisticsByDayOrMonthOrYear('2022-07') |
|---|
| | | // 农事操作 |
|---|
| | | this.farmingRecords() |
|---|
| | | // 农产品监管 |
|---|
| | | this.productsSupervise() |
|---|
| | | taskNum: [], |
|---|
| | | // 农事记录 |
|---|
| | | farminList: [], |
|---|
| | | // 农资出入库记录 |
|---|
| | | this.pageCountNzCrk() |
|---|
| | | // 溯源次数统计 |
|---|
| | | this.getSweepRecordStatistics() |
|---|
| | | }, |
|---|
| | | mounted () { |
|---|
| | | stockrecordList: [], |
|---|
| | | // 农产品监管 |
|---|
| | | NcpJg: [], |
|---|
| | | // 溯源次数 |
|---|
| | | sweepList: {}, |
|---|
| | | // 溯源趋势 |
|---|
| | | sweepTrend: [], |
|---|
| | | nzOrNcp: 'ncp', |
|---|
| | | trpOrNcp: 'trp', |
|---|
| | | nsjlOrnz: 'nsjl', |
|---|
| | | cltjOrsym: 'cltj', |
|---|
| | | // 投入品监管窗体控制 |
|---|
| | | trpPopupFlag: false, |
|---|
| | | // 农事记录 |
|---|
| | | nsjlPopupFlag: false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | created () { |
|---|
| | | this.selectXCount() |
|---|
| | | this.getStockCount() |
|---|
| | | this.page() |
|---|
| | | // 年产量与库存数量 |
|---|
| | | this.statisticsStockAndYield() |
|---|
| | | // 按月统计产量 |
|---|
| | | this.statisticsStockMonth('2022-07') |
|---|
| | | // 农产品投入 |
|---|
| | | this.pageCount('2022-07') |
|---|
| | | // 农资投入 |
|---|
| | | this.pageCountNz('2022-07') |
|---|
| | | // 统计市场流通/去年流通量/本月流通量 |
|---|
| | | this.selectMarketCirculate() |
|---|
| | | // 统计任务总数 |
|---|
| | | this.countTaskNum('2022-07') |
|---|
| | | // 溯源趋势统计 |
|---|
| | | this.getSweepRecordStatisticsByDayOrMonthOrYear('2022-07') |
|---|
| | | // 农事操作 |
|---|
| | | this.farmingRecords() |
|---|
| | | // 农产品监管 |
|---|
| | | this.productsSupervise() |
|---|
| | | // 农资出入库记录 |
|---|
| | | this.pageCountNzCrk() |
|---|
| | | // 溯源次数统计 |
|---|
| | | this.getSweepRecordStatistics() |
|---|
| | | }, |
|---|
| | | mounted () { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // 投入品监管明细弹窗 |
|---|
| | | popDetailedSupervise () { |
|---|
| | | this.trpPopupFlag = true |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // 投入品监管明细弹窗 |
|---|
| | | popDetailedSupervise () { |
|---|
| | | this.trpPopupFlag = true |
|---|
| | | }, |
|---|
| | | // 农事记录明细弹窗 |
|---|
| | | popDetailedFarming () { |
|---|
| | | this.nsjlPopupFlag = true |
|---|
| | | }, |
|---|
| | | // 任务总数时间查询 |
|---|
| | | getTaskTime (e) { |
|---|
| | | this.countTaskNum(e) |
|---|
| | | }, |
|---|
| | | // 农产品投入时间查询 |
|---|
| | | getNcptrTime (e) { |
|---|
| | | this.pageCount(e) |
|---|
| | | }, |
|---|
| | | // 农资投入时间查询 |
|---|
| | | getNztrTime (e) { |
|---|
| | | this.pageCountNz(e) |
|---|
| | | }, |
|---|
| | | // 产量统计时间查询 |
|---|
| | | getCltjTime (e) { |
|---|
| | | this.statisticsStockMonth(e) |
|---|
| | | }, |
|---|
| | | // 溯源趋势时间查询 |
|---|
| | | getSymTime (e) { |
|---|
| | | this.getSweepRecordStatisticsByDayOrMonthOrYear(e) |
|---|
| | | }, |
|---|
| | | initBar (dom) { |
|---|
| | | const that = this |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | var y = [] |
|---|
| | | for (let i = 0; i < that.taskNum.length; i++) { |
|---|
| | | y.push(that.taskNum[i].count) |
|---|
| | | } |
|---|
| | | // 农事记录明细弹窗 |
|---|
| | | popDetailedFarming () { |
|---|
| | | this.nsjlPopupFlag = true |
|---|
| | | }, |
|---|
| | | // 任务总数时间查询 |
|---|
| | | getTaskTime (e) { |
|---|
| | | this.countTaskNum(e) |
|---|
| | | }, |
|---|
| | | // 农产品投入时间查询 |
|---|
| | | getNcptrTime (e) { |
|---|
| | | this.pageCount(e) |
|---|
| | | }, |
|---|
| | | // 农资投入时间查询 |
|---|
| | | getNztrTime (e) { |
|---|
| | | this.pageCountNz(e) |
|---|
| | | }, |
|---|
| | | // 产量统计时间查询 |
|---|
| | | getCltjTime (e) { |
|---|
| | | this.statisticsStockMonth(e) |
|---|
| | | }, |
|---|
| | | // 溯源趋势时间查询 |
|---|
| | | getSymTime (e) { |
|---|
| | | this.getSweepRecordStatisticsByDayOrMonthOrYear(e) |
|---|
| | | }, |
|---|
| | | initBar (dom) { |
|---|
| | | const that = this |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | var y = [] |
|---|
| | | for (let i = 0; i < that.taskNum.length; i++) { |
|---|
| | | y.push(that.taskNum[i].count) |
|---|
| | | } |
|---|
| | | |
|---|
| | | const option = { |
|---|
| | | grid: { |
|---|
| | | top: '14%', |
|---|
| | | left: '2%', |
|---|
| | | right: '2%', |
|---|
| | | bottom: '2%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | data: ['已完成', '未完成', '超期完成'], |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(153,153,153,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)', |
|---|
| | | rotate: 0 |
|---|
| | | const option = { |
|---|
| | | grid: { |
|---|
| | | top: '14%', |
|---|
| | | left: '2%', |
|---|
| | | right: '2%', |
|---|
| | | bottom: '2%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | data: ['已完成', '未完成', '超期完成'], |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(153,153,153,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: { |
|---|
| | | name: '（次）', |
|---|
| | | nameTextStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: '#657CA8' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)', |
|---|
| | | rotate: 0 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: { |
|---|
| | | name: '（次）', |
|---|
| | | nameTextStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: '#657CA8' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 32, |
|---|
| | | data: y, |
|---|
| | | label: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | position: 'top', |
|---|
| | | textStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 32, |
|---|
| | | data: y, |
|---|
| | | label: { |
|---|
| | | show: true, |
|---|
| | | position: 'top', |
|---|
| | | textStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: |
|---|
| | | |
|---|
| | | function (params) { |
|---|
| | | var colorList = [ |
|---|
| | | ['#24A5DF', '#01E2D2'], |
|---|
| | | ['#E59438', '#FEF880 '], |
|---|
| | | ['#E34C4C', '#E6945E'] |
|---|
| | | ] |
|---|
| | | var index = params.dataIndex |
|---|
| | | if (params.dataIndex >= colorList.length) { |
|---|
| | | index = params.dataIndex - colorList.length |
|---|
| | | } |
|---|
| | | return new that.$echarts.graphic.LinearGradient(0, 0, 0, 1, [ |
|---|
| | | { |
|---|
| | | offset: 0, |
|---|
| | | color: colorList[index][0] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | offset: 0.5, |
|---|
| | | color: colorList[index][0] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | offset: 1, |
|---|
| | | color: colorList[index][1] |
|---|
| | | } |
|---|
| | | ]) |
|---|
| | | function (params) { |
|---|
| | | var colorList = [ |
|---|
| | | ['#24A5DF', '#01E2D2'], |
|---|
| | | ['#E59438', '#FEF880 '], |
|---|
| | | ['#E34C4C', '#E6945E'] |
|---|
| | | ] |
|---|
| | | var index = params.dataIndex |
|---|
| | | if (params.dataIndex >= colorList.length) { |
|---|
| | | index = params.dataIndex - colorList.length |
|---|
| | | } |
|---|
| | | return new that.$echarts.graphic.LinearGradient(0, 0, 0, 1, [ |
|---|
| | | { |
|---|
| | | offset: 0, |
|---|
| | | color: colorList[index][0] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | offset: 0.5, |
|---|
| | | color: colorList[index][0] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | offset: 1, |
|---|
| | | color: colorList[index][1] |
|---|
| | | } |
|---|
| | | ]) |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | initTrpBar (dom) { |
|---|
| | | const that = this |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | var nztrData = this.nztr |
|---|
| | | var nztrX = [] |
|---|
| | | var nztrY = [] |
|---|
| | | for (let i = 0; i < nztrData.length; i++) { |
|---|
| | | nztrX.push(nztrData[i].agrname) |
|---|
| | | nztrY.push(nztrData[i].cnum) |
|---|
| | | } |
|---|
| | | const option = { |
|---|
| | | grid: { |
|---|
| | | top: '14%', |
|---|
| | | left: '2%', |
|---|
| | | right: '2%', |
|---|
| | | bottom: '2%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | data: nztrX, |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(153,153,153,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)', |
|---|
| | | rotate: 0 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: { |
|---|
| | | max: 600, |
|---|
| | | name: '（公斤）', |
|---|
| | | nameTextStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: '#657CA8' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 32, |
|---|
| | | data: nztrY, |
|---|
| | | label: { |
|---|
| | | show: true, |
|---|
| | | position: 'top', |
|---|
| | | textStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: |
|---|
| | | |
|---|
| | | new that.$echarts.graphic.LinearGradient( |
|---|
| | | // 前四个参数用于配置渐变色的起止位置，这四个参数依次对应 右下左上 四个方位。也就是从右边开始顺时针方向。 |
|---|
| | | // 通过修改前4个参数，可以实现不同的渐变方向 |
|---|
| | | /* 第五个参数则是一个数组，用于配置颜色的渐变过程。 |
|---|
| | | 每项为一个对象，包含offset和color两个参数 |
|---|
| | | */ |
|---|
| | | 0, 0, 0, 1, [{ // 代表渐变色从正上方开始 |
|---|
| | | offset: 0, // offset范围是0~1，用于表示位置，0是指0%处的颜色 |
|---|
| | | color: '#24A5DF' |
|---|
| | | }, // 柱图渐变色 |
|---|
| | | { |
|---|
| | | offset: 1, // 指100%处的颜色 |
|---|
| | | color: '#01E2D2' |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | ) |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | initNcpBar (dom) { |
|---|
| | | const that = this |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | |
|---|
| | | var data = that.NcpJg |
|---|
| | | var dj = ['一等品', '二等品', '三等品', '四等品', '五等品'] |
|---|
| | | var echartData = [] |
|---|
| | | var sum = 0 |
|---|
| | | for (var i = 0; i < 5; i++) { |
|---|
| | | sum += Number(data[i]) |
|---|
| | | echartData.push({ |
|---|
| | | name: dj[i], |
|---|
| | | value: data[i] |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | const option = { |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item' |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | top: '5%', |
|---|
| | | padding: [50, 100, 0, 0], |
|---|
| | | orient: 'vertical', |
|---|
| | | left: 'right' |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '品质', |
|---|
| | | type: 'pie', |
|---|
| | | radius: ['40%', '70%'], |
|---|
| | | avoidLabelOverlap: false, |
|---|
| | | label: { |
|---|
| | | normal: { |
|---|
| | | show: true, |
|---|
| | | formatter: '产品总数\n\n' + sum, |
|---|
| | | position: 'center', |
|---|
| | | lineHight: 30 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | data: echartData |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | initClSyBar (dom) { |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | var data = [] |
|---|
| | | var data1 = [ |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0' |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | var data2 = [] |
|---|
| | | var ncp = this.yieldMonth |
|---|
| | | for (let i = 0; i < ncp.length; i++) { |
|---|
| | | data.push(ncp[i].time) |
|---|
| | | data2.push(ncp[i].num) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | const option = { |
|---|
| | | grid: { |
|---|
| | | top: '10%', |
|---|
| | | right: '0%', |
|---|
| | | left: '0%', |
|---|
| | | bottom: '0%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | initTrpBar (dom) { |
|---|
| | | const that = this |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | var nztrData = this.nztr |
|---|
| | | var nztrX = [] |
|---|
| | | var nztrY = [] |
|---|
| | | for (let i = 0; i < nztrData.length; i++) { |
|---|
| | | nztrX.push(nztrData[i].agrname) |
|---|
| | | nztrY.push(nztrData[i].cnum) |
|---|
| | | } |
|---|
| | | const option = { |
|---|
| | | grid: { |
|---|
| | | top: '14%', |
|---|
| | | left: '2%', |
|---|
| | | right: '2%', |
|---|
| | | bottom: '2%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | data: nztrX, |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(153,153,153,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | left: 'center', |
|---|
| | | data: ['加工产品', '农产品'], |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)', |
|---|
| | | rotate: 0 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: { |
|---|
| | | max: 600, |
|---|
| | | name: '（公斤）', |
|---|
| | | nameTextStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: '#657CA8' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 32, |
|---|
| | | data: nztrY, |
|---|
| | | label: { |
|---|
| | | show: true, |
|---|
| | | position: 'top', |
|---|
| | | textStyle: { |
|---|
| | | color: 'rgba(255,255,255,.4)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: |
|---|
| | | |
|---|
| | | new that.$echarts.graphic.LinearGradient( |
|---|
| | | // 前四个参数用于配置渐变色的起止位置，这四个参数依次对应 右下左上 四个方位。也就是从右边开始顺时针方向。 |
|---|
| | | // 通过修改前4个参数，可以实现不同的渐变方向 |
|---|
| | | /* 第五个参数则是一个数组，用于配置颜色的渐变过程。 |
|---|
| | | 每项为一个对象，包含offset和color两个参数 |
|---|
| | | */ |
|---|
| | | 0, 0, 0, 1, [{ // 代表渐变色从正上方开始 |
|---|
| | | offset: 0, // offset范围是0~1，用于表示位置，0是指0%处的颜色 |
|---|
| | | color: '#24A5DF' |
|---|
| | | }, // 柱图渐变色 |
|---|
| | | { |
|---|
| | | offset: 1, // 指100%处的颜色 |
|---|
| | | color: '#01E2D2' |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | ) |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | initNcpBar (dom) { |
|---|
| | | const that = this |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | |
|---|
| | | var data = that.NcpJg |
|---|
| | | var dj = ['一等品', '二等品', '三等品', '四等品', '五等品'] |
|---|
| | | var echartData = [] |
|---|
| | | var sum = 0 |
|---|
| | | for (var i = 0; i < 5; i++) { |
|---|
| | | sum += Number(data[i]) |
|---|
| | | echartData.push({ |
|---|
| | | name: dj[i], |
|---|
| | | value: data[i] |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | const option = { |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item' |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | top: '5%', |
|---|
| | | padding: [50, 100, 0, 0], |
|---|
| | | orient: 'vertical', |
|---|
| | | left: 'right' |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '品质', |
|---|
| | | type: 'pie', |
|---|
| | | radius: ['40%', '70%'], |
|---|
| | | avoidLabelOverlap: false, |
|---|
| | | label: { |
|---|
| | | normal: { |
|---|
| | | show: true, |
|---|
| | | formatter: '产品总数\n\n' + sum, |
|---|
| | | position: 'center', |
|---|
| | | lineHight: 30 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | data: echartData |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | initClSyBar (dom) { |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | var data = [] |
|---|
| | | var data1 = [ |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0', |
|---|
| | | '0' |
|---|
| | | ] |
|---|
| | | var data2 = [] |
|---|
| | | var ncp = this.yieldMonth |
|---|
| | | for (let i = 0; i < ncp.length; i++) { |
|---|
| | | data.push(ncp[i].time) |
|---|
| | | data2.push(ncp[i].num) |
|---|
| | | } |
|---|
| | | |
|---|
| | | const option = { |
|---|
| | | grid: { |
|---|
| | | top: '10%', |
|---|
| | | right: '0%', |
|---|
| | | left: '0%', |
|---|
| | | bottom: '0%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | left: 'center', |
|---|
| | | data: ['加工产品', '农产品'], |
|---|
| | | textStyle: { |
|---|
| | | color: '#A9D1D7' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | data: data, |
|---|
| | | axisLabel: { |
|---|
| | | interval: 0, |
|---|
| | | show: true, |
|---|
| | | textStyle: { |
|---|
| | | color: '#A9D1D7' |
|---|
| | | color: 'rgba(255,255,255,0.6)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | data: data, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#697B89', |
|---|
| | | width: 1 |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | min: 0, |
|---|
| | | type: 'value', |
|---|
| | | axisLabel: { |
|---|
| | | interval: 0, |
|---|
| | | show: true, |
|---|
| | | textStyle: { |
|---|
| | | color: 'rgba(255,255,255,0.6)' |
|---|
| | | color: '#B4B5BE' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | |
|---|
| | | color: '#697B89', |
|---|
| | | width: 1 |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | min: 0, |
|---|
| | | type: 'value', |
|---|
| | | axisLabel: { |
|---|
| | | interval: 0, |
|---|
| | | show: true, |
|---|
| | | textStyle: { |
|---|
| | | color: '#B4B5BE' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#697B89', |
|---|
| | | width: 1 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '加工产品', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 14, |
|---|
| | | silent: true, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: '#E29646' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data: data1 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: '农产品', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 14, |
|---|
| | | silent: true, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: '#6AE081' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data: data2 |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | initSymyBar (dom) { |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | |
|---|
| | | var data = this.sweepTrend |
|---|
| | | var x = [] |
|---|
| | | var y = [] |
|---|
| | | for (var i = 0; i < data.length; i++) { |
|---|
| | | y.push(data[i].num) |
|---|
| | | x.push(data[i].time) |
|---|
| | | } |
|---|
| | | |
|---|
| | | var option = { |
|---|
| | | grid: { |
|---|
| | | top: '10%', |
|---|
| | | right: '0%', |
|---|
| | | left: '0%', |
|---|
| | | bottom: '0%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | boundaryGap: false, |
|---|
| | | data: x |
|---|
| | | }, |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | min: 0, |
|---|
| | | type: 'value', |
|---|
| | | axisLabel: { |
|---|
| | | interval: 0, |
|---|
| | | show: true, |
|---|
| | | textStyle: { |
|---|
| | | color: '#B4B5BE' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#697B89', |
|---|
| | | width: 1 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | splitLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | data: y, |
|---|
| | | type: 'line', |
|---|
| | | smooth: true, |
|---|
| | | areaStyle: {} |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | // 农场使用率 |
|---|
| | | selectXCount () { |
|---|
| | | // eslint-disable-next-line no-unused-vars |
|---|
| | | var that = this |
|---|
| | | var deptId = '1123598813738675201' |
|---|
| | | selectXCount(deptId).then((res) => { |
|---|
| | | that.landsnum = res.data.data.snum.toFixed(0) |
|---|
| | | that.landwnum = res.data.data.wnum.toFixed(0) |
|---|
| | | that.znum = res.data.data.num.toFixed(0) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农资使用概况 |
|---|
| | | getStockCount () { |
|---|
| | | var that = this |
|---|
| | | var deptId = '1123598813738675201' |
|---|
| | | getStockCount(deptId).then((res) => { |
|---|
| | | that.jnStock = res.data.data.jn.toFixed(0) |
|---|
| | | that.qnStock = res.data.data.qn.toFixed(0) |
|---|
| | | that.byStock = res.data.data.by.toFixed(0) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农事记录 |
|---|
| | | page () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | page(1, 10, Object.assign(params)).then((res) => { |
|---|
| | | this.farmPlanList = res.data.data.records |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 大屏经营概况库存数量与年产量 |
|---|
| | | statisticsStockAndYield () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = '2022' |
|---|
| | | statisticsStockAndYield(Object.assign(params)).then((res) => { |
|---|
| | | this.stockNCP = res.data.data.sum |
|---|
| | | this.stockJG = res.data.data.jgsum |
|---|
| | | this.stockTj = res.data.data.jgsum + res.data.data.sum |
|---|
| | | |
|---|
| | | this.yieldNCP = res.data.data.ncpNcl |
|---|
| | | this.yieldJG = res.data.data.jgNcl |
|---|
| | | this.yieldTj = res.data.data.ncpNcl + res.data.data.jgNcl |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 按月统计产量 |
|---|
| | | statisticsStockMonth (e) { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = e |
|---|
| | | statisticsStockMonth(Object.assign(params)).then((res) => { |
|---|
| | | this.yieldMonth = res.data.data |
|---|
| | | this.initClSyBar('ClSyEcharts') |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农产品监管 |
|---|
| | | productsSupervise () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = '2022' |
|---|
| | | productsSupervise(Object.assign(params)).then((res) => { |
|---|
| | | this.NcpJg = res.data.data |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农产品投入 |
|---|
| | | pageCount (e) { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = e |
|---|
| | | params.status = '1' |
|---|
| | | pageCount(Object.assign(params)).then((res) => { |
|---|
| | | this.ncptr = res.data.data |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农资投入 |
|---|
| | | pageCountNz (e) { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = e |
|---|
| | | pageCountNz(Object.assign(params)).then((res) => { |
|---|
| | | this.nztr = res.data.data.records |
|---|
| | | // 投入品监管图表 |
|---|
| | | this.initTrpBar('TrpEcharts') |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 统计市场流通/去年流通量/本月流通量 |
|---|
| | | selectMarketCirculate () { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = '2022' |
|---|
| | | selectMarketCirculate(Object.assign(params)).then((res) => { |
|---|
| | | this.salaNumBN = res.data.data[0].num |
|---|
| | | this.salaNumQN = res.data.data[1].num |
|---|
| | | this.salaNumBY = res.data.data[2].num |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 统计任务总数 |
|---|
| | | countTaskNum (year) { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = year |
|---|
| | | countTaskNum(Object.assign(params)).then((res) => { |
|---|
| | | this.taskNum = res.data.data |
|---|
| | | this.initBar('TaskNumEcharts') |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农事记录 |
|---|
| | | farmingRecords () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.current = '1' |
|---|
| | | params.size = '3' |
|---|
| | | farmingRecords(Object.assign(params)).then((res) => { |
|---|
| | | this.farminList = res.data.data.records |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农资出入库记录 |
|---|
| | | pageCountNzCrk () { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.current = '1' |
|---|
| | | params.size = '3' |
|---|
| | | pageCountNzCrk(Object.assign(params)).then((res) => { |
|---|
| | | this.stockrecordList = res.data.data.records |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 溯源次数统计 |
|---|
| | | getSweepRecordStatistics () { |
|---|
| | | var params = {} |
|---|
| | | // 农场id |
|---|
| | | params.farmId = '1' |
|---|
| | | getSweepRecordStatistics(Object.assign(params)).then((res) => { |
|---|
| | | this.sweepList = res.data.data |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 溯源趋势统计 |
|---|
| | | getSweepRecordStatisticsByDayOrMonthOrYear (year) { |
|---|
| | | var params = {} |
|---|
| | | // 农场id |
|---|
| | | params.farmId = '1' |
|---|
| | | params.time = year |
|---|
| | | getSweepRecordStatisticsByDayOrMonthOrYear(Object.assign(params)).then((res) => { |
|---|
| | | this.sweepTrend = res.data.data |
|---|
| | | if (this.cltjOrsym == 'sym') { |
|---|
| | | this.initSymyBar('ClSyEcharts') |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 监管图表切换 |
|---|
| | | trpOrNcpChange (item) { |
|---|
| | | var that = this |
|---|
| | | that.trpOrNcp = item |
|---|
| | | if (item == 'trp') { |
|---|
| | | that.initTrpBar('TrpEcharts') |
|---|
| | | } else { |
|---|
| | | // 农产品监管 |
|---|
| | | that.initNcpBar('TrpEcharts') |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // 产量统计图表切换 |
|---|
| | | cltjOrSymChange (item) { |
|---|
| | | var that = this |
|---|
| | | that.cltjOrsym = item |
|---|
| | | if (item == 'cltj') { |
|---|
| | | this.initClSyBar('ClSyEcharts') |
|---|
| | | } else { |
|---|
| | | // 溯源码 |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '加工产品', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 14, |
|---|
| | | silent: true, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: '#E29646' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data: data1 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: '农产品', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: 14, |
|---|
| | | silent: true, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: '#6AE081' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data: data2 |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | initSymyBar (dom) { |
|---|
| | | const chartDom = document.getElementById(dom) |
|---|
| | | const myChart = this.$echarts.init(chartDom) |
|---|
| | | myChart.clear() |
|---|
| | | |
|---|
| | | var data = this.sweepTrend |
|---|
| | | var x = [] |
|---|
| | | var y = [] |
|---|
| | | for (var i = 0; i < data.length; i++) { |
|---|
| | | y.push(data[i].num) |
|---|
| | | x.push(data[i].time) |
|---|
| | | } |
|---|
| | | |
|---|
| | | var option = { |
|---|
| | | grid: { |
|---|
| | | top: '10%', |
|---|
| | | right: '0%', |
|---|
| | | left: '0%', |
|---|
| | | bottom: '0%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | boundaryGap: false, |
|---|
| | | data: x |
|---|
| | | }, |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | min: 0, |
|---|
| | | type: 'value', |
|---|
| | | axisLabel: { |
|---|
| | | interval: 0, |
|---|
| | | show: true, |
|---|
| | | textStyle: { |
|---|
| | | color: '#B4B5BE' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#697B89', |
|---|
| | | width: 1 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgba(62,81,97, .5)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | data: y, |
|---|
| | | type: 'line', |
|---|
| | | smooth: true, |
|---|
| | | areaStyle: {} |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | option && myChart.setOption(option) |
|---|
| | | }, |
|---|
| | | // 农场使用率 |
|---|
| | | selectXCount () { |
|---|
| | | // eslint-disable-next-line no-unused-vars |
|---|
| | | var that = this |
|---|
| | | var deptId = '1123598813738675201' |
|---|
| | | selectXCount(deptId).then((res) => { |
|---|
| | | that.landsnum = res.data.data.snum.toFixed(0) |
|---|
| | | that.landwnum = res.data.data.wnum.toFixed(0) |
|---|
| | | that.znum = res.data.data.num.toFixed(0) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农资使用概况 |
|---|
| | | getStockCount () { |
|---|
| | | var that = this |
|---|
| | | var deptId = '1123598813738675201' |
|---|
| | | getStockCount(deptId).then((res) => { |
|---|
| | | that.jnStock = res.data.data.jn.toFixed(0) |
|---|
| | | that.qnStock = res.data.data.qn.toFixed(0) |
|---|
| | | that.byStock = res.data.data.by.toFixed(0) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农事记录 |
|---|
| | | page () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | page(1, 10, Object.assign(params)).then((res) => { |
|---|
| | | this.farmPlanList = res.data.data.records |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 大屏经营概况库存数量与年产量 |
|---|
| | | statisticsStockAndYield () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = '2022' |
|---|
| | | statisticsStockAndYield(Object.assign(params)).then((res) => { |
|---|
| | | this.stockNCP = res.data.data.sum |
|---|
| | | this.stockJG = res.data.data.jgsum |
|---|
| | | this.stockTj = res.data.data.jgsum + res.data.data.sum |
|---|
| | | |
|---|
| | | this.yieldNCP = res.data.data.ncpNcl |
|---|
| | | this.yieldJG = res.data.data.jgNcl |
|---|
| | | this.yieldTj = res.data.data.ncpNcl + res.data.data.jgNcl |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 按月统计产量 |
|---|
| | | statisticsStockMonth (e) { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = e |
|---|
| | | statisticsStockMonth(Object.assign(params)).then((res) => { |
|---|
| | | this.yieldMonth = res.data.data |
|---|
| | | this.initClSyBar('ClSyEcharts') |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农产品监管 |
|---|
| | | productsSupervise () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = '2022' |
|---|
| | | productsSupervise(Object.assign(params)).then((res) => { |
|---|
| | | this.NcpJg = res.data.data |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农产品投入 |
|---|
| | | pageCount (e) { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = e |
|---|
| | | params.status = '1' |
|---|
| | | pageCount(Object.assign(params)).then((res) => { |
|---|
| | | this.ncptr = res.data.data |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农资投入 |
|---|
| | | pageCountNz (e) { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = e |
|---|
| | | pageCountNz(Object.assign(params)).then((res) => { |
|---|
| | | this.nztr = res.data.data.records |
|---|
| | | // 投入品监管图表 |
|---|
| | | this.initTrpBar('TrpEcharts') |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 统计市场流通/去年流通量/本月流通量 |
|---|
| | | selectMarketCirculate () { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = '2022' |
|---|
| | | selectMarketCirculate(Object.assign(params)).then((res) => { |
|---|
| | | this.salaNumBN = res.data.data[0].num |
|---|
| | | this.salaNumQN = res.data.data[1].num |
|---|
| | | this.salaNumBY = res.data.data[2].num |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 统计任务总数 |
|---|
| | | countTaskNum (year) { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.year = year |
|---|
| | | countTaskNum(Object.assign(params)).then((res) => { |
|---|
| | | this.taskNum = res.data.data |
|---|
| | | this.initBar('TaskNumEcharts') |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农事记录 |
|---|
| | | farmingRecords () { |
|---|
| | | var params = {} |
|---|
| | | params.tenantId = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.current = '1' |
|---|
| | | params.size = '3' |
|---|
| | | farmingRecords(Object.assign(params)).then((res) => { |
|---|
| | | this.farminList = res.data.data.records |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 农资出入库记录 |
|---|
| | | pageCountNzCrk () { |
|---|
| | | var params = {} |
|---|
| | | params.codes = '000000' |
|---|
| | | params.deptId = '1123598813738675201' |
|---|
| | | params.current = '1' |
|---|
| | | params.size = '3' |
|---|
| | | pageCountNzCrk(Object.assign(params)).then((res) => { |
|---|
| | | this.stockrecordList = res.data.data.records |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 溯源次数统计 |
|---|
| | | getSweepRecordStatistics () { |
|---|
| | | var params = {} |
|---|
| | | // 农场id |
|---|
| | | params.farmId = '1' |
|---|
| | | getSweepRecordStatistics(Object.assign(params)).then((res) => { |
|---|
| | | this.sweepList = res.data.data |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 溯源趋势统计 |
|---|
| | | getSweepRecordStatisticsByDayOrMonthOrYear (year) { |
|---|
| | | var params = {} |
|---|
| | | // 农场id |
|---|
| | | params.farmId = '1' |
|---|
| | | params.time = year |
|---|
| | | getSweepRecordStatisticsByDayOrMonthOrYear(Object.assign(params)).then((res) => { |
|---|
| | | this.sweepTrend = res.data.data |
|---|
| | | if (this.cltjOrsym == 'sym') { |
|---|
| | | this.initSymyBar('ClSyEcharts') |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 监管图表切换 |
|---|
| | | trpOrNcpChange (item) { |
|---|
| | | var that = this |
|---|
| | | that.trpOrNcp = item |
|---|
| | | if (item == 'trp') { |
|---|
| | | that.initTrpBar('TrpEcharts') |
|---|
| | | } else { |
|---|
| | | // 农产品监管 |
|---|
| | | that.initNcpBar('TrpEcharts') |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // 产量统计图表切换 |
|---|
| | | cltjOrSymChange (item) { |
|---|
| | | var that = this |
|---|
| | | that.cltjOrsym = item |
|---|
| | | if (item == 'cltj') { |
|---|
| | | this.initClSyBar('ClSyEcharts') |
|---|
| | | } else { |
|---|
| | | // 溯源码 |
|---|
| | | this.initSymyBar('ClSyEcharts') |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="scss"> |
|---|
| | | .container { |
|---|
| | | padding: 20px; |
|---|
| | | position: relative; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | background: #08192e; |
|---|
| | | box-sizing: border-box; |
|---|
| | | .container { |
|---|
| | | padding: 20px; |
|---|
| | | position: relative; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | background: #08192e; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .toggle-plot { |
|---|
| | | text-align: left; |
|---|
| | | height: 36px; |
|---|
| | | line-height: 36px; |
|---|
| | | font-size: 24px; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #fff; |
|---|
| | | .toggle-plot { |
|---|
| | | text-align: left; |
|---|
| | | height: 36px; |
|---|
| | | line-height: 36px; |
|---|
| | | font-size: 24px; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #fff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .main-content { |
|---|
| | | margin-top: 10px; |
|---|
| | | height: calc(100% - 46px); |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | |
|---|
| | | .t { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .main-content { |
|---|
| | | margin-top: 10px; |
|---|
| | | height: calc(100% - 46px); |
|---|
| | | .c { |
|---|
| | | margin-top: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | .t { |
|---|
| | | & > div { |
|---|
| | | margin-left: 20px; |
|---|
| | | width: calc((100% - 80px) / 5); |
|---|
| | | height: 346px; |
|---|
| | | border-radius: 8px 8px 8px 8px; |
|---|
| | | background: rgba(0, 52, 85, 0.4); |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | width: calc((100% - 80px) / 5 * 2 + 20px); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .time-box { |
|---|
| | | padding: 0 25px; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 0; |
|---|
| | | & > div:last-child { |
|---|
| | | border: none; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .c { |
|---|
| | | margin-top: 20px; |
|---|
| | | .task-box { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | margin-left: 20px; |
|---|
| | | width: calc((100% - 80px) / 5); |
|---|
| | | height: 346px; |
|---|
| | | border-radius: 8px 8px 8px 8px; |
|---|
| | | background: rgba(0, 52, 85, 0.4); |
|---|
| | | .title { |
|---|
| | | text-align: left; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 0; |
|---|
| | | .echarts-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | width: calc((100% - 80px) / 5 * 2 + 20px); |
|---|
| | | } |
|---|
| | | .nz-ncp { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .time-box { |
|---|
| | | padding: 0 25px; |
|---|
| | | .title-box { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | border: none; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .task-box { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | text-align: left; |
|---|
| | | font-size: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .echarts-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .nz-ncp { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title-box { |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .title { |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .lists-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | overflow-y: auto; |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(even) { |
|---|
| | | background: rgba(102, 221, 233, 0.1); |
|---|
| | | .lists-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | overflow-y: auto; |
|---|
| | | |
|---|
| | | & > div:nth-child(even) { |
|---|
| | | background: rgba(102, 221, 233, 0.1); |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: space-between; |
|---|
| | | line-height: 48px; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 16px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | & > div:last-child { |
|---|
| | | margin-right: 18px; |
|---|
| | | color: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .trp-ncp { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title-box { |
|---|
| | | position: relative; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .more { |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: auto; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | margin: auto; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | font-size: 16px; |
|---|
| | | |
|---|
| | | img { |
|---|
| | | margin-left: 6px; |
|---|
| | | vertical-align: middle; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .echarts-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .b { |
|---|
| | | margin-top: 20px; |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | margin-left: 20px; |
|---|
| | | border-radius: 8px 8px 8px 8px; |
|---|
| | | background: rgba(0, 52, 85, 0.4); |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 0; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | width: 444px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .cl-sy { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title-box { |
|---|
| | | height: 34px; |
|---|
| | | position: relative; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .date { |
|---|
| | | position: absolute; |
|---|
| | | top: -20px; |
|---|
| | | left: auto; |
|---|
| | | right: 0; |
|---|
| | | bottom: auto; |
|---|
| | | margin: auto; |
|---|
| | | width: 320px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .echarts-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ns-nz { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title-box { |
|---|
| | | position: relative; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .more { |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: auto; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | margin: auto; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | font-size: 16px; |
|---|
| | | |
|---|
| | | img { |
|---|
| | | margin-left: 6px; |
|---|
| | | vertical-align: middle; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .lists-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | position: relative; |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 10px; |
|---|
| | | padding: 10px 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | background: rgba(102, 221, 233, 0.1); |
|---|
| | | border-radius: 8px; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | & > .t-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: space-between; |
|---|
| | | line-height: 48px; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 16px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | margin-right: 18px; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .trp-ncp { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title-box { |
|---|
| | | position: relative; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .more { |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: auto; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | margin: auto; |
|---|
| | | & > .b-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | font-size: 16px; |
|---|
| | | |
|---|
| | | img { |
|---|
| | | margin-left: 6px; |
|---|
| | | vertical-align: middle; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .echarts-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .b { |
|---|
| | | margin-top: 20px; |
|---|
| | | flex: 1; |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | margin-left: 20px; |
|---|
| | | border-radius: 8px 8px 8px 8px; |
|---|
| | | background: rgba(0, 52, 85, 0.4); |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-left: 0; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:last-child { |
|---|
| | | width: 444px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .cl-sy { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title-box { |
|---|
| | | height: 34px; |
|---|
| | | position: relative; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .date { |
|---|
| | | position: absolute; |
|---|
| | | top: -20px; |
|---|
| | | left: auto; |
|---|
| | | right: 0; |
|---|
| | | bottom: auto; |
|---|
| | | margin: auto; |
|---|
| | | width: 320px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .echarts-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ns-nz { |
|---|
| | | padding: 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | .title-box { |
|---|
| | | position: relative; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | display: flex; |
|---|
| | | align-items: flex-start; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | .title { |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .on { |
|---|
| | | position: relative; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #7ccfd6; |
|---|
| | | |
|---|
| | | span { |
|---|
| | | position: absolute; |
|---|
| | | bottom: -8px; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 3px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:nth-child(2) { |
|---|
| | | margin-left: 60px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .more { |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: auto; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | margin: auto; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | font-size: 16px; |
|---|
| | | |
|---|
| | | img { |
|---|
| | | margin-left: 6px; |
|---|
| | | vertical-align: middle; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .lists-box { |
|---|
| | | margin-top: 16px; |
|---|
| | | flex: 1; |
|---|
| | | |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | |
|---|
| | | & > div { |
|---|
| | | position: relative; |
|---|
| | | flex: 1; |
|---|
| | | margin-top: 10px; |
|---|
| | | padding: 10px 20px; |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | background: rgba(102, 221, 233, 0.1); |
|---|
| | | border-radius: 8px; |
|---|
| | | font-size: 18px; |
|---|
| | | color: #a9d1d7; |
|---|
| | | |
|---|
| | | & > .t-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | font-weight: bold; |
|---|
| | | color: #66dde9; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .b-item { |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: space-between; |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | color: #fff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-border { |
|---|
| | | top: 0; |
|---|
| | | bottom: auto; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .b-border { |
|---|
| | | top: auto; |
|---|
| | | bottom: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-border, |
|---|
| | | .b-border { |
|---|
| | | position: absolute; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | margin: auto; |
|---|
| | | width: 80%; |
|---|
| | | height: 1px; |
|---|
| | | background: linear-gradient( |
|---|
| | | 89deg, |
|---|
| | | rgba(102, 221, 233, 0) 0%, |
|---|
| | | #66dde9 51%, |
|---|
| | | rgba(102, 221, 233, 0) 100% |
|---|
| | | ); |
|---|
| | | & > div:first-child { |
|---|
| | | color: #fff; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-top: 10px; |
|---|
| | | .t-border { |
|---|
| | | top: 0; |
|---|
| | | bottom: auto; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .b-border { |
|---|
| | | top: auto; |
|---|
| | | bottom: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .t-border, |
|---|
| | | .b-border { |
|---|
| | | position: absolute; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | margin: auto; |
|---|
| | | width: 80%; |
|---|
| | | height: 1px; |
|---|
| | | background: linear-gradient( |
|---|
| | | 89deg, |
|---|
| | | rgba(102, 221, 233, 0) 0%, |
|---|
| | | #66dde9 51%, |
|---|
| | | rgba(102, 221, 233, 0) 100% |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > div:first-child { |
|---|
| | | margin-top: 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
