10 files modified
2 files added
| | |
| | | |
| | | export const getList = (current, size, params) => { |
| | | return request({ |
| | | url: '/api/farmingRecord/page', |
| | | url: '/farmingRecord/page', |
| | | method: 'get', |
| | | params: { |
| | | ...params, |
| | | current, |
| | | size, |
| | | size |
| | | } |
| | | }) |
| | | } |
| | | |
| | | // 获取农场 |
| | | export const getFarmList = (current, size, params) => { |
| | | return request({ |
| | | url: '/farm/getFarmList', |
| | | method: 'get' |
| | | }) |
| | | } |
| | | |
| | | // 获取地块 |
| | | export const getLandList = (params) => { |
| | | return request({ |
| | | url: '/land/land/getLandList', |
| | | method: 'get', |
| | | params: { |
| | | ...params |
| | | } |
| | | }) |
| | | } |
| | | |
| | | // 获取农事操作记录 |
| | | export const getFarmingRecordList = (params) => { |
| | | return request({ |
| | | url: '/farmingRecord/getFarmingRecordList', |
| | | method: 'get', |
| | | params: { |
| | | ...params |
| | | } |
| | | }) |
| | | } |
| | | |
| | | // 获取种植记录 |
| | | export const getFarmPlantList = (params) => { |
| | | return request({ |
| | | url: '/farmPlant/getFarmPlantList', |
| | | method: 'get', |
| | | params: { |
| | | ...params |
| | | } |
| | | }) |
| | | } |
| | | |
| | | export const remove = (ids) => { |
| | | return request({ |
| | | url: '/api/farmingRecord/remove', |
| | | url: '/farmingRecord/remove', |
| | | method: 'post', |
| | | params: { |
| | | ids, |
| | | ids |
| | | } |
| | | }) |
| | | } |
| | | |
| | | export const save = (row) => { |
| | | return request({ |
| | | url: '/api/farmingRecord/save', |
| | | url: '/farmingRecord/save', |
| | | method: 'post', |
| | | data: row |
| | | }) |
| | |
| | | |
| | | export const update = (row) => { |
| | | return request({ |
| | | url: '/api/farmingRecord/update', |
| | | url: '/farmingRecord/update', |
| | | method: 'post', |
| | | data: row |
| | | }) |
| | |
| | | |
| | | export const getDetail = (id) => { |
| | | return request({ |
| | | url: '/api/farmingRecord/detail', |
| | | url: '/farmingRecord/detail', |
| | | method: 'get', |
| | | params: { |
| | | id |
| | | } |
| | | }) |
| | | } |
| | | |
| | | |
| | | export const getFarmingCount = (deptId) => { |
| | | return request({ |
| New file |
| | |
| | | import request from '@/router/axios' |
| | | |
| | | export const getSourceList = (params) => { |
| | | return request({ |
| | | url: '/traceability/getTraceabilityList', |
| | | method: 'get', |
| | | params: { |
| | | ...params |
| | | } |
| | | }) |
| | | } |
| | |
| | | import request from '@/router/axios'; |
| | | import request from '@/router/axios' |
| | | |
| | | export const getList = (current, size, params) => { |
| | | return request({ |
| | | url: '/api/land/land/page', |
| | | url: '/land/land/page', |
| | | method: 'get', |
| | | params: { |
| | | ...params, |
| | | current, |
| | | size, |
| | | size |
| | | } |
| | | }) |
| | | } |
| | | |
| | | export const getDetail = (id) => { |
| | | return request({ |
| | | url: '/api/land/land/details', |
| | | url: '/land/land/details', |
| | | method: 'get', |
| | | params: { |
| | | id |
| | |
| | | |
| | | export const remove = (ids) => { |
| | | return request({ |
| | | url: '/api/land/land/remove', |
| | | url: '/land/land/remove', |
| | | method: 'post', |
| | | params: { |
| | | ids, |
| | | ids |
| | | } |
| | | }) |
| | | } |
| | | |
| | | export const add = (row) => { |
| | | return request({ |
| | | url: '/api/land/land/save', |
| | | url: '/land/land/save', |
| | | method: 'post', |
| | | data: row |
| | | }) |
| | |
| | | |
| | | export const update = (row) => { |
| | | return request({ |
| | | url: '/api/land/land/submit', |
| | | url: '/land/land/submit', |
| | | method: 'post', |
| | | data: row |
| | | }) |
| | |
| | | |
| | | export const getLandList = (userid) => { |
| | | return request({ |
| | | url: '/api/land/land/selectLandList', |
| | | url: '/land/land/selectLandList', |
| | | method: 'get', |
| | | params: { |
| | | userid |
| | |
| | | <template> |
| | | <div id="viewer-container" style="height: 100%; width: 100%"></div> |
| | | </template> |
| | | |
| | | <script> |
| | | |
| | | var farmRegionLayer = null |
| | | var plotRegionLayer = null |
| | | var farmLogoLayer = null |
| | | var addLayers = [] |
| | | var addPlotLayers = [] |
| | | |
| | | export default { |
| | | name: 'mapBox', |
| | |
| | | } |
| | | } |
| | | }) |
| | | |
| | | farmRegionLayer = new global.DC.VectorLayer('farmRegionLayer') |
| | | global.viewer.addLayer(farmRegionLayer) |
| | | |
| | | plotRegionLayer = new global.DC.VectorLayer('plotRegionLayer') |
| | | global.viewer.addLayer(plotRegionLayer) |
| | | |
| | | farmLogoLayer = new global.DC.HtmlLayer('farmLogoLayer') |
| | | global.viewer.addLayer(farmLogoLayer) |
| | | |
| | | if (global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()) { // 判断是否支持图像渲染像素化处理 |
| | | global.viewer.setOptions({ |
| | |
| | | global.DC.ready(initViewer) |
| | | }, |
| | | methods: { |
| | | addPolygon (positions, item) { |
| | | const that = this |
| | | |
| | | const center = this.getCenter(positions) |
| | | |
| | | const divIcon = new global.DC.DivIcon( |
| | | new global.DC.Position(center[0], center[1], 0), |
| | | ` |
| | | <div class="farm-map-icon"> |
| | | <img src="/img/icon/3858.png" alt=""> |
| | | <div>${item.farmName}</div> |
| | | </div> |
| | | ` |
| | | ) |
| | | divIcon.attrParams = item |
| | | farmLogoLayer.addOverlay(divIcon) |
| | | |
| | | divIcon.on(global.DC.MouseEventType.CLICK, (e) => { |
| | | that.$parent.showDetailPopup(e.overlay.attrParams) |
| | | }) |
| | | |
| | | const polygon = new global.DC.Polygon(positions) |
| | | polygon.setStyle({ |
| | | material: global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 244, 157, 21, |
| | | 200 |
| | | ) |
| | | }) |
| | | farmRegionLayer.addOverlay(polygon) |
| | | addLayers.push({ center, name: item.farmName }) |
| | | }, |
| | | |
| | | addPlotPolygon (positions, item) { |
| | | // const that = this |
| | | |
| | | const center = this.getCenter(positions) |
| | | |
| | | // const divIcon = new global.DC.DivIcon( |
| | | // new global.DC.Position(center[0], center[1], 0), |
| | | // ` |
| | | // <div class="farm-map-icon"> |
| | | // <img src="/img/icon/3858.png" alt=""> |
| | | // // <div>${item.farmName}</div> |
| | | // </div> |
| | | // ` |
| | | // ) |
| | | // divIcon.attrParams = item |
| | | // farmLogoLayer.addOverlay(divIcon) |
| | | |
| | | // divIcon.on(global.DC.MouseEventType.CLICK, (e) => { |
| | | // that.$parent.showDetailPopup(e.overlay.attrParams) |
| | | // }) |
| | | |
| | | const polygon = new global.DC.Polygon(positions) |
| | | polygon.setStyle({ |
| | | material: global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 129, 255, 84, |
| | | 200 |
| | | ) |
| | | }) |
| | | plotRegionLayer.addOverlay(polygon) |
| | | addPlotLayers.push({ center, name: item.landName }) |
| | | }, |
| | | |
| | | setCenter (name) { |
| | | let center |
| | | addLayers.forEach(item => { |
| | | if (name == item.name) { |
| | | center = item.center |
| | | } |
| | | }) |
| | | |
| | | global.viewer.camera.flyTo({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | center[0], center[1], 3000.0 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | setPlotCenter (name) { |
| | | let center |
| | | addPlotLayers.forEach(item => { |
| | | if (name == item.name) { |
| | | center = item.center |
| | | } |
| | | }) |
| | | |
| | | global.viewer.camera.flyTo({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | center[0], center[1], 3000.0 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | // 经纬度测算中心位置 |
| | | getCenter (arr) { |
| | | let centerLonLat = [] |
| | | if (arr.length) { |
| | | const lon = [] |
| | | const lat = [] |
| | | const poly = [] |
| | | for (let i = 0, len = arr.length; i < len; i++) { |
| | | lon.push(arr[i][0]) |
| | | lat.push(arr[i][1]) |
| | | } |
| | | for (let i = 0, len = lon.length; i < len; i++) { |
| | | poly.push({ |
| | | x: parseFloat(lon[i]), |
| | | y: parseFloat(lat[i]), |
| | | z: 0 |
| | | }) |
| | | } |
| | | const sortedLongitudeArray = poly.map(item => item.x).sort() |
| | | const sortedLatitudeArray = poly.map(item => item.y).sort() |
| | | const centerLongitude = ((parseFloat(sortedLongitudeArray[0]) + parseFloat(sortedLongitudeArray[sortedLongitudeArray.length - 1])) / 2).toFixed(14) |
| | | const centerLatitude = ((parseFloat(sortedLatitudeArray[0]) + parseFloat(sortedLatitudeArray[sortedLatitudeArray.length - 1])) / 2).toFixed(14) |
| | | console.log(centerLongitude, centerLatitude) |
| | | centerLonLat = [Number(centerLongitude), Number(centerLatitude)] |
| | | } |
| | | return centerLonLat |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | <template> |
| | | <div ref="publicBox"> |
| | | <div class="current-wrapper" @click="close"> |
| | | <div ref="publicBox" :class="className"> |
| | | <div class="header"> |
| | | <slot name="public-box-header"></slot> |
| | | </div> |
| | | <div class="content"> |
| | | <slot name="public-box-content"></slot> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | |
| | | export default { |
| | | name: 'PublicBox', |
| | | props: ['className'], |
| | | data () { |
| | | return { |
| | | } |
| | |
| | | created () { |
| | | }, |
| | | methods: { |
| | | |
| | | close () { |
| | | this.$parent.closeCurrentPopup() |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped lang='scss'> |
| | | .current-wrapper { |
| | | position: fixed; |
| | | top: 0; |
| | | left: 0; |
| | | width: 100%; |
| | | height: 100%; |
| | | z-index: 99; |
| | | background: rgba(0, 0, 0, 0.5); |
| | | } |
| | | </style> |
| | |
| | | // console.log(window.location); |
| | | // console.log(url); |
| | | // }, 3000); |
| | | window.$apiUrls = 'http://182.106.212.58:8013/api' |
| | | // window.$apiUrls = 'http://localhost:89' |
| | | // window.$apiUrls = 'http://182.106.212.58:8013/api' |
| | | window.$apiUrls = 'http://192.168.0.114:89' |
| | | const service = axios.create({ |
| | | // baseURL: 'http://192.168.0.107:83', |
| | | |
| | |
| | | * @Author: Morpheus |
| | | * @Date: 2021-04-30 14:12:09 |
| | | * @Last Modified by: Morpheus |
| | | * @Last Modified time: 2022-07-08 10:54:29 |
| | | * @Last Modified time: 2022-07-12 19:39:31 |
| | | */ |
| | | |
| | | import Vue from 'vue' |
| | |
| | | border-radius: 0; |
| | | background: rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | |
| | | .div-icon { |
| | | background: transparent !important; |
| | | } |
| | | |
| | | .farm-map-icon { |
| | | font-weight: bold; |
| | | color: rgb(252, 166, 7); |
| | | |
| | | img { |
| | | width: 24px; |
| | | } |
| | | } |
| | |
| | | color: #fff; |
| | | |
| | | .row { |
| | | margin-top: 30px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | |
| | |
| | | align-items: flex-start; |
| | | justify-content: flex-end; |
| | | width: 100px; |
| | | height: 50px; |
| | | height: 24px; |
| | | color: #A9D1D7; |
| | | } |
| | | |
| | | .r { |
| | | display: flex; |
| | | align-items: flex-start; |
| | | align-items: center; |
| | | justify-content: flex-start; |
| | | text-align: left; |
| | | margin-left: 24px; |
| | | flex: 1; |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | .row:first-child { |
| | | margin-top: 0; |
| | | } |
| | | |
| | | } |
| | | |
| | | } |
| | |
| | | * @Author: Morpheus |
| | | * @Date: 2022-05-11 15:00:23 |
| | | * @Last Modified by: Morpheus |
| | | * @Last Modified time: 2022-07-08 20:01:42 |
| | | * @Last Modified time: 2022-07-13 15:45:17 |
| | | * 驾驶舱 |
| | | */ |
| | | <template> |
| | |
| | | <i class="el-icon-back"></i> 返回 |
| | | </span> |
| | | </div> |
| | | <div class="title">古田米庄</div> |
| | | <div class="title">{{currentDetails.farmName}}</div> |
| | | <div class="btn-grounp"> |
| | | <el-button type="primary" icon="el-icon-my-sb">物联网设备总览</el-button> |
| | | <el-button type="primary" icon="el-icon-my-sy" @click="tracePopupFlag = true">农产品溯源</el-button> |
| | |
| | | <div v-show="ncjscz == 'ncjs'" class="detail-box"> |
| | | <div class="item"> |
| | | <div class="name">农场名称:</div> |
| | | <div class="deserve">xx农场</div> |
| | | <div class="deserve">{{this.currentDetails.farmName}}</div> |
| | | </div> |
| | | |
| | | <div class="item"> |
| | | <div class="name">农场名称:</div> |
| | | <div class="deserve">xx农场</div> |
| | | <div class="name">农场地址:</div> |
| | | <div class="deserve">{{this.currentDetails.farmAddress}}</div> |
| | | </div> |
| | | |
| | | <div class="item"> |
| | | <div class="name">土地流转面积:</div> |
| | | <div class="deserve">{{this.currentDetails.farmArea}}亩</div> |
| | | </div> |
| | | |
| | | <div class="item"> |
| | | <div class="name">口号:</div> |
| | | <div class="deserve">{{this.currentDetails.slogan}}</div> |
| | | </div> |
| | | |
| | | <div class="item"> |
| | | <div class="name">农场简介:</div> |
| | | <div class="deserve">{{this.currentDetails.introduce}}</div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div v-show="ncjscz == 'cz'" class="lists-box nscz"> |
| | | <div> |
| | | <div v-for="(item, index) in farmRecordList" :key="index"> |
| | | <div class="t-border"></div> |
| | | <div class="t-item"> |
| | | <div>施肥</div> |
| | | <div>有机肥料、有机肥</div> |
| | | <div>2022-06-31</div> |
| | | <div>{{item.typeName}}</div> |
| | | <div></div> |
| | | <div>{{item.createTime.substr(0,10)}}</div> |
| | | </div> |
| | | <div class="b-item"> |
| | | <div>水稻</div> |
| | | <div>林术</div> |
| | | <div>株良镇田南村5号地块</div> |
| | | <div>{{item.strainName}}</div> |
| | | <div>{{item.realName}}</div> |
| | | <div>{{item.landName}}</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | |
| | | <div v-show="zydksb == 'zy'" class="lists-box dk"> |
| | | <div> |
| | | <div v-for="(item, index) in farmPlantList" :key="index"> |
| | | <div class="title"> |
| | | <img src="/img/icon/list-img.png" alt />水稻 |
| | | <img :src="item.url" alt /> |
| | | {{item.strainName}} |
| | | </div> |
| | | <div class="num-unit"> |
| | | 120 |
| | | <span>亩</span> |
| | | {{item.area}} |
| | | <span>{{item.landUnit == 0 ? '亩' : item.landUnit == 1 ? '分' : '平方米'}}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div v-show="zydksb == 'dk'" class="lists-box dk"> |
| | | <div> |
| | | <div v-for="(item, index) in plotLists" :key="index" @click="setCenter(item)"> |
| | | <div class="title"> |
| | | <img src="/img/icon/jk.png" alt />某某地块 |
| | | <img :src="item.url" alt /> |
| | | {{item.landName}} |
| | | </div> |
| | | <div class="num-unit"> |
| | | 0.24 |
| | | <span>亩</span> |
| | | {{item.landArea}} |
| | | <span>{{item.landUnit == 0 ? '亩' : item.landUnit == 1 ? '分' : '平方米'}}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | </div> |
| | | |
| | | <public-box v-show="tracePopupFlag" class="public-trace-table"> |
| | | <public-box v-show="tracePopupFlag" :className="'public-trace-table'"> |
| | | <template slot="public-box-header"> |
| | | <div class="logo"></div> |
| | | <div class="title">农产品溯源码</div> |
| | | <img |
| | | @click="tracePopupFlag = false" |
| | | src="/img/icon/public-close.png" |
| | | alt |
| | | class="close" |
| | | /> |
| | | <img @click="closeCurrentPopup" src="/img/icon/public-close.png" alt class="close" /> |
| | | </template> |
| | | <template slot="public-box-content"> |
| | | <div class="action-bar"> |
| | |
| | | class="search-input" |
| | | size="small" |
| | | prefix-icon="el-icon-search" |
| | | placeholder="请输入内容" |
| | | v-model="input1" |
| | | placeholder="请输入溯源码编号" |
| | | v-model="sourceCode" |
| | | ></el-input> |
| | | </div> |
| | | <div class="btn-grounp"> |
| | |
| | | <div>操作</div> |
| | | </div> |
| | | <div class="t-body"> |
| | | <div class="table-list"> |
| | | <div class="table-list" v-for="(item, index) in sourceList" :key="index"> |
| | | <div class="sym-style"> |
| | | <div class="l"> |
| | | <img src="/img/icon/sym.png" alt /> |
| | |
| | | <div class="unit">5cm*3cm</div> |
| | | </div> |
| | | </div> |
| | | <div>193500000030</div> |
| | | <div>1/1</div> |
| | | <div>2022-06-10 15:50</div> |
| | | <div>{{item.code}}</div> |
| | | <div>{{item.bind == 0 ? 1 : 0}}/1</div> |
| | | <div>{{item.createTime}}</div> |
| | | <div> |
| | | <el-button |
| | | @click="openPopup('/img/icon/sym.png')" |
| | |
| | | |
| | | <script> |
| | | |
| | | import { getSourceList } from '@/api/farm/source' |
| | | import { |
| | | getLandList, |
| | | getFarmingRecordList, |
| | | getFarmPlantList |
| | | } from '@/api/farm/farmingrecord' |
| | | |
| | | export default { |
| | | data () { |
| | | return { |
| | | currentDetails: null, |
| | | ncjscz: 'cz', |
| | | zydksb: 'sb', |
| | | dialogVisible: false, |
| | | currentUrl: '', |
| | | tracePopupFlag: false |
| | | tracePopupFlag: false, |
| | | sourceList: [], |
| | | farmRecordList: [], |
| | | farmPlantList: [], |
| | | plotLists: [], |
| | | // 溯源码编号 |
| | | sourceCode: '' |
| | | } |
| | | }, |
| | | created () { |
| | | |
| | | this.getParams() |
| | | }, |
| | | mounted () { |
| | | this.$nextTick(() => { |
| | | this.setView() |
| | | this.getSourceList() |
| | | this.getFarmingRecordList() |
| | | this.getFarmPlantList() |
| | | this.getLandList() |
| | | }) |
| | | }, |
| | | methods: { |
| | | // 关闭弹框 |
| | | closeCurrentPopup () { |
| | | this.tracePopupFlag = false |
| | | }, |
| | | setCenter (item) { |
| | | this.ncListShow = false |
| | | this.$refs.modalForm.setPlotCenter(item.landName) |
| | | }, |
| | | |
| | | prev () { |
| | | this.$router.go(-1) |
| | | }, |
| | | |
| | | openPopup (url) { |
| | | this.currentUrl = url |
| | | this.dialogVisible = true |
| | | }, |
| | | |
| | | getParams () { |
| | | this.currentDetails = this.$route.query |
| | | }, |
| | | |
| | | setView () { |
| | | let position |
| | | |
| | | position = this.currentDetails.position.replace(/POLYGON\(\(/g, '') |
| | | position = position.replace(/\)\)/g, '') |
| | | |
| | | const arr = position.split(',') |
| | | var brr = [] |
| | | |
| | | arr.forEach(it => { |
| | | brr.push(it.split(' ')) |
| | | }) |
| | | |
| | | this.$refs.modalForm.addPolygon(brr, this.currentDetails) |
| | | |
| | | this.$refs.modalForm.setCenter(this.currentDetails.farmName) |
| | | }, |
| | | |
| | | getSourceList () { |
| | | getSourceList({ farmId: this.currentDetails.id }).then(res => { |
| | | this.sourceList = res.data.data |
| | | }) |
| | | }, |
| | | |
| | | getFarmingRecordList () { |
| | | getFarmingRecordList({ farmId: this.currentDetails.id }).then(res => { |
| | | this.farmRecordList = res.data.data |
| | | }) |
| | | }, |
| | | |
| | | getFarmPlantList () { |
| | | getFarmPlantList({ farmId: this.currentDetails.id }).then(res => { |
| | | this.farmPlantList = res.data.data |
| | | }) |
| | | }, |
| | | |
| | | getLandList () { |
| | | getLandList({ farmId: this.currentDetails.id }).then(res => { |
| | | res.data.data.forEach(item => { |
| | | if (item.landRange != '' || item.landRange != null) { |
| | | item.landRange = item.landRange.replace(/POLYGON\(\(/g, '') |
| | | item.landRange = item.landRange.replace(/\)\)/g, '') |
| | | |
| | | const arr = item.landRange.split(',') |
| | | var brr = [] |
| | | arr.forEach(it => { |
| | | brr.push(it.split(' ')) |
| | | }) |
| | | |
| | | console.log(brr, 5555) |
| | | this.$refs.modalForm.addPlotPolygon(brr, item) |
| | | } |
| | | }) |
| | | this.plotLists = res.data.data |
| | | }) |
| | | } |
| | | } |
| | | } |
| | |
| | | width: 440px; |
| | | height: 640px; |
| | | background: #06344e; |
| | | border-radius: 30px 30px 30px 30px; |
| | | |
| | | .tab-btn { |
| | | display: flex; |
| | |
| | | align-items: center; |
| | | margin-top: 14px; |
| | | padding: 0 20px; |
| | | height: 56px; |
| | | background: #081e36; |
| | | font-size: 16px; |
| | | color: #84c3d2; |
| | | |
| | | .name { |
| | | margin-right: 8px; |
| | | height: 56px; |
| | | line-height: 56px; |
| | | font-weight: bold; |
| | | color: #abebf7; |
| | | } |
| | | |
| | | .deserve { |
| | | flex: 1; |
| | | text-align: left; |
| | | line-height: 32px; |
| | | } |
| | | } |
| | | |
| | |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | |
| | | & > div { |
| | | flex: 1; |
| | | } |
| | | |
| | | & > div:first-child { |
| | | text-align: left; |
| | | font-weight: bold; |
| | | color: #66dde9; |
| | | } |
| | | |
| | | & > div:last-child { |
| | | text-align: right; |
| | | } |
| | | } |
| | | |
| | |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | |
| | | & > div { |
| | | flex: 1; |
| | | } |
| | | |
| | | & > div:first-child { |
| | | text-align: left; |
| | | color: #fff; |
| | | } |
| | | |
| | | & > div:last-child { |
| | | text-align: right; |
| | | } |
| | | } |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | .dk.lists-box { |
| | | & > div { |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | |
| | | .zy.lists-box { |
| | | & > div { |
| | | height: 80px; |
| | |
| | | |
| | | .border-box { |
| | | position: absolute; |
| | | width: 72px; |
| | | height: 56px; |
| | | width: 18px; |
| | | height: 18px; |
| | | z-index: 0; |
| | | } |
| | | |
| | |
| | | left: -2px; |
| | | border-top: 3px solid #09e2ef; |
| | | border-left: 3px solid #09e2ef; |
| | | border-top-left-radius: 30px; |
| | | } |
| | | .t-r-border { |
| | | top: -2px; |
| | | right: -2px; |
| | | border-top: 3px solid #09e2ef; |
| | | border-right: 3px solid #09e2ef; |
| | | border-top-right-radius: 30px; |
| | | } |
| | | .b-l-border { |
| | | bottom: -2px; |
| | | left: -2px; |
| | | border-bottom: 3px solid #09e2ef; |
| | | border-left: 3px solid #09e2ef; |
| | | border-bottom-left-radius: 30px; |
| | | } |
| | | .b-r-border { |
| | | bottom: -2px; |
| | | right: -2px; |
| | | border-bottom: 3px solid #09e2ef; |
| | | border-right: 3px solid #09e2ef; |
| | | border-bottom-right-radius: 30px; |
| | | } |
| | | } |
| | | |
| | |
| | | * @Author: Morpheus |
| | | * @Date: 2022-05-11 15:00:23 |
| | | * @Last Modified by: Morpheus |
| | | * @Last Modified time: 2022-07-08 10:58:39 |
| | | * @Last Modified time: 2022-07-13 09:28:02 |
| | | * 驾驶舱 |
| | | */ |
| | | <template> |
| | |
| | | </div> |
| | | |
| | | <div class="down-menu"> |
| | | <div class="nc" @click="farmProfiles = true"> |
| | | <div class="nc" @click="ncListShow = !ncListShow"> |
| | | <span>农场</span> |
| | | <i class="el-icon-caret-bottom"></i> |
| | | </div> |
| | |
| | | <div class="jc"> |
| | | <span>监测设备</span> |
| | | <i class="el-icon-caret-bottom"></i> |
| | | </div> |
| | | |
| | | <div v-show="ncListShow" class="nc-list"> |
| | | <div class="title" @click="ncListShow = false"> |
| | | 农场 |
| | | <i class="el-icon-caret-top"></i> |
| | | </div> |
| | | <div |
| | | v-for="(item, index) in farmNumArray" |
| | | :key="index" |
| | | class="box" |
| | | :class="{first: index == 0}" |
| | | @click="setCenter(item)" |
| | | >{{item.farmName}}</div> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | <template slot="public-box-header"> |
| | | <div class="logo"></div> |
| | | <div class="title">市场流通</div> |
| | | <img |
| | | @click="cityShow = false" |
| | | src="/img/icon/public-close.png" |
| | | alt |
| | | class="close" |
| | | /> |
| | | <img @click="cityShow = false" src="/img/icon/public-close.png" alt class="close" /> |
| | | </template> |
| | | <template slot="public-box-content"> |
| | | <div class="market-title"> |
| | | <el-select placeholder="请选择农场"> |
| | | </el-select> |
| | | <el-select placeholder="请选择农场"></el-select> |
| | | <div class="date"> |
| | | <el-date-picker |
| | | v-model="value1" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始时间" |
| | | end-placeholder="结束时间"> |
| | | </el-date-picker> |
| | | end-placeholder="结束时间" |
| | | ></el-date-picker> |
| | | </div> |
| | | <div class="query-button"> |
| | | <el-button type="primary" icon="el-icon-search">查询</el-button> |
| | |
| | | <div class="market-content"> |
| | | <div id="marketChartQx" class="market-chart"></div> |
| | | <div class="market-list"> |
| | | <div class="market-list-item" v-for="(item,index) in marketDistrict" :key="index"> |
| | | <div |
| | | class="market-list-item" |
| | | v-for="(item,index) in marketDistrict" |
| | | :key="index" |
| | | > |
| | | <div> |
| | | <div class="t-border"></div> |
| | | <div class="t-item"> |
| | |
| | | <public-box v-if="farmProfiles" class="public-org-nav-bar"> |
| | | <template slot="public-box-header"> |
| | | <div class="logo"></div> |
| | | <div class="title">123</div> |
| | | <div class="title">{{this.farmDetails.farmName}}</div> |
| | | <img |
| | | @click="farmProfiles = false" |
| | | src="/img/icon/public-close.png" |
| | |
| | | <template slot="public-box-content"> |
| | | <div class="farm-profiles"> |
| | | <div class="btn-grounp"> |
| | | <div class="details" @click="goPath('/farmDetails')"> |
| | | <div class="details" @click="goPath"> |
| | | 进入农场 |
| | | <i class="el-icon-arrow-right"></i> |
| | | </div> |
| | |
| | | |
| | | <div class="farm-content"> |
| | | <div class="row"> |
| | | <div class="l">土地面积</div> |
| | | <div class="r">农场介绍</div> |
| | | <div class="l">地址</div> |
| | | <div class="r">{{this.farmDetails.farmAddress}}</div> |
| | | </div> |
| | | <div class="row"> |
| | | <div class="l">土地面积</div> |
| | | <div class="r">农场介绍</div> |
| | | <div class="l">土地流转面积</div> |
| | | <div class="r">{{this.farmDetails.farmArea}}</div> |
| | | </div> |
| | | <div class="row"> |
| | | <div class="l">土地面积</div> |
| | | <div class="r">农场介绍</div> |
| | | <div class="l">口号</div> |
| | | <div class="r">{{this.farmDetails.slogan}}</div> |
| | | </div> |
| | | <div class="row"> |
| | | <div class="l">土地面积</div> |
| | | <div class="r">农场介绍</div> |
| | | <div class="l">农场介绍</div> |
| | | <div class="r" style="line-height: 32px;">{{this.farmDetails.introduce}}</div> |
| | | </div> |
| | | <div class="row"> |
| | | <div class="l">土地面积</div> |
| | | <div class="l">环境图片</div> |
| | | <div class="r"> |
| | | <img src="/img/icon/yx.jpg" alt/> |
| | | <img src="/img/icon/yx.jpg" alt/> |
| | | <img src="/img/icon/yx.jpg" alt/> |
| | | <img src="/img/icon/yx.jpg" alt/> |
| | | <img :src="this.farmDetails.picture" alt /> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | SelectCount, |
| | | selctSaletCount, |
| | | selctSaletZ, |
| | | selectMarketDistrict |
| | | selectMarketDistrict, |
| | | getFarmList, |
| | | getLandList |
| | | } from '@/api/farm/farmingrecord' |
| | | // eslint-disable-next-line no-unused-vars |
| | | import { selectXCount } from '@/api/land/land' |
| | |
| | | salaNumY: [], |
| | | // 市场流通 |
| | | marketDistrict: [], |
| | | farmProfiles: false |
| | | ncListShow: false, |
| | | farmProfiles: false, |
| | | farmNumArray: [], |
| | | plotNumArray: [], |
| | | farmDetails: null |
| | | } |
| | | }, |
| | | created () { |
| | |
| | | this.selctSaletCount() |
| | | this.selctSaletZ() |
| | | this.selectMarketDistrict() |
| | | |
| | | this.getFarmList() |
| | | this.getLandList() |
| | | }, |
| | | mounted () { |
| | | this.initRightPie('EquipmentEcharts') |
| | | }, |
| | | methods: { |
| | | showDetailPopup (params) { |
| | | console.log(params) |
| | | this.farmDetails = params |
| | | this.farmProfiles = true |
| | | }, |
| | | |
| | | setCenter (item) { |
| | | this.ncListShow = false |
| | | this.$refs.modalForm.setCenter(item.farmName) |
| | | }, |
| | | |
| | | getFarmList () { |
| | | getFarmList().then(res => { |
| | | res.data.data.forEach(item => { |
| | | item.position = item.position.replace(/POLYGON\(\(/g, '') |
| | | item.position = item.position.replace(/\)\)/g, '') |
| | | |
| | | const arr = item.position.split(',') |
| | | var brr = [] |
| | | arr.forEach(it => { |
| | | brr.push(it.split(' ')) |
| | | }) |
| | | this.$refs.modalForm.addPolygon(brr, item) |
| | | }) |
| | | this.farmNumArray = res.data.data |
| | | }) |
| | | }, |
| | | |
| | | getLandList () { |
| | | getLandList().then(res => { |
| | | console.log(res.data.data, 456) |
| | | |
| | | res.data.data.forEach(item => { |
| | | if (item.landRange != '' || item.landRange != null) { |
| | | item.landRange = item.landRange.replace(/POLYGON\(\(/g, '') |
| | | item.landRange = item.landRange.replace(/\)\)/g, '') |
| | | |
| | | const arr = item.landRange.split(',') |
| | | var brr = [] |
| | | arr.forEach(it => { |
| | | brr.push(it.split(' ')) |
| | | }) |
| | | |
| | | console.log(brr, 5555) |
| | | this.$refs.modalForm.addPlotPolygon(brr, item) |
| | | } |
| | | }) |
| | | this.plotNumArray = res.data.data |
| | | }) |
| | | }, |
| | | |
| | | initPie (dom, val) { |
| | | const chartDom = document.getElementById(dom) |
| | | const myChart = this.$echarts.init(chartDom) |
| | |
| | | |
| | | getFarmingCount(deptId).then((res) => { |
| | | that.total = res.data.data |
| | | console.log(that.total, res.data.data) |
| | | // that.total = 0; |
| | | if (that.total > 0) { |
| | | that.isFarmingDetail = true |
| | |
| | | this.cityShow = true |
| | | this.setMarketChart('marketChartQx') |
| | | }, |
| | | goPath (path) { |
| | | this.$router.push(path) |
| | | goPath () { |
| | | this.$router.push({ |
| | | path: '/farmDetails', |
| | | query: { |
| | | ...this.farmDetails |
| | | } |
| | | }) |
| | | }, |
| | | setMarketChart (dom) { |
| | | const chartDom = document.getElementById(dom) |
| | |
| | | box-sizing: border-box; |
| | | font-size: 18px; |
| | | color: #6de9f3; |
| | | cursor: pointer; |
| | | |
| | | i { |
| | | font-size: 12px; |
| | | } |
| | | } |
| | | |
| | | .nc-list { |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: flex-start; |
| | | position: absolute; |
| | | top: 0; |
| | | left: 172px; |
| | | width: 144px; |
| | | height: 224px; |
| | | overflow-x: hidden; |
| | | overflow-y: auto; |
| | | background: rgba(6, 28, 29, 0.8); |
| | | border-radius: 8px 8px 8px 8px; |
| | | border: 1px solid #69e2ed; |
| | | box-sizing: border-box; |
| | | |
| | | .title { |
| | | width: 100%; |
| | | height: 46px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | font-size: 20px; |
| | | } |
| | | |
| | | .box { |
| | | margin-top: 16px; |
| | | padding-left: 20px; |
| | | width: 100%; |
| | | height: 24px; |
| | | text-align: left; |
| | | } |
| | | |
| | | .box.first { |
| | | margin-top: 0 !important; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .city-flow { |