yanghongwei
/
lg_frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

111

This commit is contained in:
DESKTOP-VMMLSOQ\wangzg 2024-08-06 22:30:41 +08:00
parent 790e9a7ef0
commit 6d2ae6196b
11 changed files with 437 additions and 315 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/smallCommon/CustomTable.vue
View File

@ -2,7 +2,11 @@
<template> <template>
<div class="custom-table"> <div class="custom-table">
<Curd v-bind="$attrs" v-on="$listeners" ref="curd"></Curd> <Curd v-bind="$attrs" v-on="$listeners" ref="curd">
<template slot="search-button" slot-scope="{ search }">
<slot name="search-button" v-bind:search="search"></slot>
</template>
</Curd>
</div> </div>
</template> </template>
<script> <script>
@ -20,6 +24,9 @@ export default {
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.custom-table { .custom-table {
/deep/ .ant-form-item-label > label {
color: #fff !important;
}
/deep/ .ant-table-header { /deep/ .ant-table-header {
background-color: transparent !important; background-color: transparent !important;
border-bottom: 0px ; border-bottom: 0px ;

189
pages/cleanTravel/bangcheng.vue
View File

@ -1,32 +1,33 @@
<template> <template>
<div> <new-bg>
<a-page-header <flex-col>
:ghost="false" <system-title show-back custom-title="磅秤台账"/>
style="border-bottom: 1px solid rgb(235, 237, 240)" <ModuleContent padding="0px 20px 20px">
title="磅秤台账" <flex-col>
@back="() => $router.go(-1)" <Butgroup2 class="type-button">
/> <cus-button :class="['tabs-button',activeTabsButton == null?'active-tabs-button':'']"
<div class="type-button"> @click="tabsChange(null)">
<div :class="['tabs-button',activeTabsButton == null?'active-tabs-button':'']" @click="tabsChange(null)">
全部 全部
</div> </cus-button>
<div :class="['tabs-button',activeTabsButton == 1?'active-tabs-button':'']" @click="tabsChange(1)"> <cus-button :class="['tabs-button',activeTabsButton == 1?'active-tabs-button':'']" @click="tabsChange(1)">
东门 东门
</div> </cus-button>
<div :class="['tabs-button',activeTabsButton == 2?'active-tabs-button':'']" @click="tabsChange(2)"> <cus-button :class="['tabs-button',activeTabsButton == 2?'active-tabs-button':'']" @click="tabsChange(2)">
东门 东门
</div> </cus-button>
<div :class="['tabs-button',activeTabsButton == 3?'active-tabs-button':'']" @click="tabsChange(3)"> <cus-button :class="['tabs-button',activeTabsButton == 3?'active-tabs-button':'']" @click="tabsChange(3)">
东门 东门
</div> </cus-button>
<div :class="['tabs-button',activeTabsButton == 4?'active-tabs-button':'']" @click="tabsChange(4)"> <cus-button :class="['tabs-button',activeTabsButton == 4?'active-tabs-button':'']" @click="tabsChange(4)">
东门 东门
</div> </cus-button>
</div> </Butgroup2>
<Split num="10"></Split>
<ModuleContent2 bg padding="20px">
<a-row :gutter="16">
<a-col :span="18">
<div class="data-info"> <CustomTable
<div class="left-table">
<Curd
hide-action hide-action
hide-search hide-search
hide-button hide-button
@ -38,61 +39,106 @@
> >
<template slot="search-button" slot-scope="{ search }"> <template slot="search-button" slot-scope="{ search }">
<a-button type="primary" @click="exportList(search)">导出历史数据</a-button> <a-button type="primary" @click="exportList(search)">导出历史数据</a-button>
<Split num="10"></Split>
</template> </template>
</Curd> </CustomTable>
</div> </a-col>
<div class="right-details" v-if="isShowInfoDetails"> <a-col :span="6">
<div class="header-title">驾驶人详情</div> <flex-col>
<web3-title>驾驶人详情</web3-title>
<ModuleContent padding="0">
<flex-col>
<img :src="selectedRecord.imgUrl" alt="" class="car-preview">
<butgroup2>
<cus-button2 flex>进出场抓拍图</cus-button2>
<!-- <cus-button2>行驶证-正面</cus-button2>-->
<!-- <cus-button2>行驶证-反面</cus-button2>-->
<!-- <cus-button2>环保清单</cus-button2>-->
</butgroup2>
<ModuleContent padding="20px 27px" class="desc">
<cus-desc :data="selectedRecord" :columns="descColumns"></cus-desc>
</ModuleContent>
</flex-col>
<img src=""/> </ModuleContent>
</flex-col>
<div class="group-button"> </a-col>
<div :class="['_button',activeButton == 1?'active_button':'']" @click="viewImgByType(1)">出入场抓拍图</div> </a-row>
<div :class="['_button',activeButton == 2?'active_button':'']" @click="viewImgByType(2)">行驶证-正面</div> </ModuleContent2>
<div :class="['_button',activeButton == 3?'active_button':'']" @click="viewImgByType(3)">行驶证-反面</div> </flex-col>
<div :class="['_button',activeButton == 4?'active_button':'']" @click="viewImgByType(4)">环保清单</div> </ModuleContent>
</div> </flex-col>
</new-bg>
<div class="details-info">
<div class="details-info-item">
<div class="_title">排放标准：</div>
<div class="_title">国0</div>
</div>
<div class="details-info-item">
<div class="_title">VIN：</div>
<div class="_title">国0</div>
</div>
<div class="details-info-item">
<div class="_title">发动机号：</div>
<div class="_title">国0</div>
</div>
<div class="details-info-item">
<div class="_title">注册日期：</div>
<div class="_title">国0</div>
</div>
</div>
<div class="footer-button">
<Button type="primary" @click="closeDetails">关闭详情</Button>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
import Curd from "../../components/smallCommon/Curd.vue"; import Curd from "../../components/smallCommon/Curd.vue";
import moment from 'moment' import moment from 'moment'
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
import NewBg from "../../components/NewBg.vue";
import FlexCol from "../../components/FlexCol.vue";
import ModuleContent from "../../components/ModuleContent.vue";
import ModuleContent2 from "../../components/smallCommon/ModuleContent2.vue";
import CustomTable from "../../components/smallCommon/CustomTable.vue";
import Split from "../../components/Split.vue";
import Web3Title from "../../components/smallCommon/Web3Title.vue";
import CusDesc from "../../components/smallCommon/CusDesc.vue";
import CusButton2 from "../../components/smallCommon/CusButton2.vue";
import Butgroup2 from "../../components/smallCommon/butgroup2.vue";
import CusButton from "../../components/smallCommon/CusButton4.vue";
export default { export default {
name: "user", name: "user",
layout: "user",
components: { components: {
CusButton,
Butgroup2, CusButton2, CusDesc,
Web3Title,
Split,
CustomTable,
ModuleContent2,
ModuleContent, FlexCol, NewBg, SystemTitle,
Curd Curd
}, },
data() { data() {
return { return {
isEdit: false, isEdit: false,
roles: [], roles: [],
descColumns: [
{
title: '车牌号',
dataIndex: 'carNumber',
width: '100%'
}, {
title: '车牌颜色',
dataIndex: 'carColorString',
width: '100%'
}, {
title: '车辆类型',
dataIndex: 'carType',
width: '100%'
}, {
title: '车辆类型',
dataIndex: 'carType',
width: '100%'
}, {
title: '排放等级',
dataIndex: 'effluent',
width: '100%'
}, {
title: 'VIN',
dataIndex: 'vin',
width: '100%'
}, {
title: '发动机号',
dataIndex: 'entryExitPictureUrl',
width: '100%'
}, {
title: '注册日期',
dataIndex: 'registrationDate',
width: '100%'
}
],
selectedRecord: {},
columns: [ columns: [
{ {
dataIndex: 'outTime', dataIndex: 'outTime',
@ -127,14 +173,7 @@ export default {
dataIndex: 'createDateTime', dataIndex: 'createDateTime',
key: 'createDateTime', key: 'createDateTime',
title: '出厂日期' title: '出厂日期'
}, }
{
title: '操作',
key: 'operation',
scopedSlots: {customRender: 'details'},
fixed: 'right',
width: 100
},
], ],
apiConf: { apiConf: {
listApi: {api: '/api/Ledger/list', method: 'get'}, listApi: {api: '/api/Ledger/list', method: 'get'},
@ -196,12 +235,18 @@ export default {
} }
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.car-preview {
width: 100%;
height: 260px;
}
.desc {
background: rgba(24, 131, 201, 0.2);
border: 1px solid rgba(15, 81, 122, 1);
}
.type-button { .type-button {
margin: 20px 300px; max-width: 70%;
display: flex;
flex-flow: row;
justify-content: space-between;
.tabs-button { .tabs-button {
height: 40px; height: 40px;

8
pages/cleanTravel/home.vue
View File

@ -2,10 +2,9 @@
<template> <template>
<new-bg> <new-bg>
<flex-col> <flex-col>
<system-title /> <system-title custom-title="清洁运输" show-back />
<ModuleContent padding="20px"> <ModuleContent padding="20px">
<flex-col> <flex-col>
<web2-title>清洁运输</web2-title>
<ModuleContent padding="0 20px 20px"> <ModuleContent padding="0 20px 20px">
<BFC> <BFC>
<div class="sou-suo-kuang" slot="right"> <div class="sou-suo-kuang" slot="right">
@ -95,10 +94,9 @@
<cus-button> <cus-button>
<nuxt-link to="/cleanTravel/trend">清洁运输趋势</nuxt-link> <nuxt-link to="/cleanTravel/trend">清洁运输趋势</nuxt-link>
</cus-button> </cus-button>
<!-- <cus-button> <cus-button>
<nuxt-link to="/cleanTravel/bangcheng">磅秤台账</nuxt-link> <nuxt-link to="/cleanTravel/bangcheng">磅秤台账</nuxt-link>
</cus-button> </cus-button>
<cus-button>门禁监控</cus-button>-->
</butgroup> </butgroup>
</flex-col> </flex-col>
</ModuleContent> </ModuleContent>
@ -271,7 +269,7 @@ export default {
this.getDataSource() this.getDataSource()
this.$nextTick(() => { this.$nextTick(() => {
const win = window.top const win = window.top
this.$http.get('http://101.43.201.20:5000/api/Home/view').then(({data}) => { this.$get('http://101.43.201.20:5000/api/Home/view').then(({data}) => {
win.document.title = data.home.title win.document.title = data.home.title
this.setTitle(data.home.title) this.setTitle(data.home.title)
this.setInfo(data) this.setInfo(data)

82
pages/cleanTravel/ledger.vue
View File

@ -1,38 +1,35 @@
<template> <template>
<div> <new-bg>
<a-page-header <flex-col>
:ghost="false" <system-title show-back custom-title="厂区车辆台账" />
style="border-bottom: 1px solid rgb(235, 237, 240)" <ModuleContent padding="0px 20px 20px">
title="厂区车辆台账"
@back="() => $router.go(-1)" <div style="height: 144px;width: 100%;">
/> <ModuleContent2 bg bg-str :border="false">
<a-row :gutter="16"> <butgroup2 style="height: 100%;">
<a-col :span="6"> <ModuleContent2 bg bg-color border>
<a-card title="运输车辆" size="small"> <miaoshu title="运输车辆" :value="headCount.t1" color="rgba(42, 207, 255, 1)"></miaoshu>
<p>{{ headCount.t1 || 0 }}</p> </ModuleContent2>
</a-card>
</a-col> <ModuleContent2 bg bg-color border style="margin-left: 16px;">
<a-col :span="6"> <miaoshu title="国Ⅵ输车辆" :value="headCount.t2" color="rgba(255, 171, 87, 1)"></miaoshu>
<a-card title="国Ⅵ输车辆" size="small"> </ModuleContent2>
<p>{{ headCount.t2 || 0 }}</p>
</a-card> <ModuleContent2 bg bg-color border style="margin-left: 16px;">
</a-col> <miaoshu title="非道路工程机械" :value="headCount.t3" color="rgba(122, 175, 255, 1)"></miaoshu>
<a-col :span="6"> </ModuleContent2>
<a-card title="非道路工程机械" size="small">
<p>{{ headCount.t3 || 0 }}</p> <ModuleContent2 bg bg-color border style="margin-left: 16px;">
</a-card> <miaoshu title="燃油运输车辆" :value="headCount.t4" color="rgba(76, 243, 129, 1)"></miaoshu>
</a-col> </ModuleContent2>
<a-col :span="6"> </butgroup2>
<a-card title="燃油运输车辆" size="small"> </ModuleContent2>
<p>{{ headCount.t4 || 0 }}</p> </div>
</a-card>
</a-col>
</a-row>
<a-divider /> <a-divider />
<Curd <CustomTable
hide-search hide-search
hide-action hide-action
:columns="columns" :columns="columns"
@ -42,17 +39,34 @@
> >
<template slot="search-button" slot-scope="{ search }"> <template slot="search-button" slot-scope="{ search }">
<a-button type="primary" @click="exportList(search)">导出历史数据</a-button> <a-button type="primary" @click="exportList(search)">导出历史数据</a-button>
<Split height="10"></Split>
</template> </template>
</Curd> </CustomTable>
</div> </ModuleContent>
</flex-col>
</new-bg>
</template> </template>
<script> <script>
import Curd from "../../components/smallCommon/Curd.vue"; import Curd from "../../components/smallCommon/Curd.vue";
import moment from 'moment' import moment from 'moment'
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
import NewBg from "../../components/NewBg.vue";
import FlexCol from "../../components/FlexCol.vue";
import ModuleContent from "../../components/ModuleContent.vue";
import CustomTable from "../../components/smallCommon/CustomTable.vue";
import Miaoshu from "../../components/smallCommon/miaoshu.vue";
import ModuleContent2 from "../../components/smallCommon/ModuleContent2.vue";
import Butgroup2 from "../../components/smallCommon/butgroup2.vue";
import Split from "../../components/smallCommon/Split.vue";
export default { export default {
name: "user", name: "user",
layout: "user",
components: { components: {
Split,
Butgroup2, ModuleContent2, Miaoshu,
CustomTable,
ModuleContent,
FlexCol, NewBg, SystemTitle,
Curd Curd
}, },
data () { data () {
@ -162,7 +176,7 @@ export default {
} }
}, },
created() { created() {
this.$http.get('/api/Ledger/HeaderCount').then(({data}) => { this.$get('/api/Ledger/HeaderCount').then(({data}) => {
this.headCount = data || {} this.headCount = data || {}
}) })

61
pages/cleanTravel/trend.vue
View File

@ -1,21 +1,16 @@
<template> <template>
<div> <new-bg>
<a-page-header <flex-col>
:ghost="false" <system-title show-back custom-title="清洁运输+趋势" />
title="清洁运输+趋势" <ModuleContent padding="0px 20px 20px">
@back="() => $router.go(-1)"
/>
<a-divider style="margin-top: 0;" />
<a-row :gutter="16"> <a-row :gutter="16">
<a-col :span="12"> <a-col :span="6">
<a-card>
<div slot="title">
运输总量: {{ yunshuzongliang }}
</div>
<Curd </a-col>
<a-col :span="18">
<CustomTable
hide-action hide-action
hide-search hide-search
hide-button hide-button
@ -23,27 +18,35 @@
:api-conf="apiConf" :api-conf="apiConf"
:form-items="formItems" :form-items="formItems"
> >
</Curd> <template slot="search-button" slot-scope="{ search }">
</a-card> <a-button type="primary" @click="exportList(search)">查询</a-button>
<a-button type="primary" @click="exportList(search)" style="margin-left: 10px;">导出</a-button>
</a-col> <Split height="10"></Split>
<a-col :span="12"> </template>
<a-card title="国Ⅵ输车辆" size="small"> </CustomTable>
<p>card content</p>
</a-card>
</a-col> </a-col>
</a-row> </a-row>
</ModuleContent>
</flex-col>
</new-bg>
</div>
</template> </template>
<script> <script>
import Curd from "../../components/smallCommon/Curd.vue"; import Curd from "../../components/smallCommon/Curd.vue";
import moment from 'moment' import moment from 'moment'
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
import NewBg from "../../components/NewBg.vue";
import FlexCol from "../../components/FlexCol.vue";
import ModuleContent from "../../components/ModuleContent.vue";
import CustomTable from "../../components/smallCommon/CustomTable.vue";
import Split from "../../components/smallCommon/Split.vue";
export default { export default {
name: "user", name: "user",
layout: "user",
components: { components: {
Split,
CustomTable,
ModuleContent, FlexCol, NewBg, SystemTitle,
Curd Curd
}, },
data () { data () {
@ -96,6 +99,18 @@ export default {
computed: { computed: {
formItems () { formItems () {
return [ return [
{
type: 'dateRange',
key: 'time',
label: '日期',
isSearch: true,
hide: true,
placeholder: ['请选择开始日期', '请选择结束日期'],
rules: [
{ required: true, message: '请选择时间范围' }
],
fields: ['startTime', 'endTime']
},
] ]
} }
}, },

16
pages/video/list.vue
View File

@ -1,11 +1,23 @@
<script> <script>
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
import NewBg from "../../components/NewBg.vue";
import FlexCol from "../../components/FlexCol.vue";
import ModuleContent from "../../components/ModuleContent.vue";
export default { export default {
name: "list" name: "list",
components: {ModuleContent, FlexCol, NewBg, SystemTitle}
} }
</script> </script>
<template> <template>
<div class="list"></div> <new-bg>
<flex-col>
<system-title show-back custom-title="视频广场" />
<ModuleContent padding="0px 20px 20px">
</ModuleContent>
</flex-col>
</new-bg>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">

5
pages/wuzuzhi/huanjingzhili.vue
View File

@ -5,11 +5,10 @@
<Map type="middle" @pointClick="pointClick" /> <Map type="middle" @pointClick="pointClick" />
</div> </div>
<flex-col class="main"> <flex-col class="main">
<system-title/> <system-title show-back custom-title="环境治理"/>
<ModuleContent none-event padding="0 20px 20px"> <ModuleContent none-event padding="0 20px 20px">
<BFC> <BFC>
<flex-col slot="left" width="412"> <flex-col slot="left" width="412">
<web2-title>环境治理</web2-title>
<ModuleContent padding="20px 0" height="218"> <ModuleContent padding="20px 0" height="218">
<div class="video"></div> <div class="video"></div>
</ModuleContent> </ModuleContent>
@ -177,7 +176,7 @@ export default {
mounted() { mounted() {
this.$nextTick(() => { this.$nextTick(() => {
const win = window.top const win = window.top
this.$http.get('http://101.43.201.20:5000/api/Home/view').then(({data}) => { this.$get('http://101.43.201.20:5000/api/Home/view').then(({data}) => {
win.document.title = data.home.title win.document.title = data.home.title
this.setTitle(data.home.title) this.setTitle(data.home.title)
this.setInfo(data) this.setInfo(data)

32
pages/wuzuzhi/huanweixunhang.vue
View File

@ -1,38 +1,36 @@
<template> <template><new-bg>
<div class="huanweixunhang"> <flex-col>
<a-page-header <system-title show-back custom-title="环卫巡航" />
:ghost="false" <ModuleContent padding="0px 20px 20px">
style="border-bottom: 1px solid rgb(235, 237, 240)"
title="环卫巡航"
@back="() => $router.go(-1)"
/>
<div class="_map"> <div class="_map">
<Map></Map> <Map></Map>
</div> </div>
</div> </ModuleContent>
</flex-col>
</new-bg>
</template> </template>
<script> <script>
import Map from "../../components/Map.vue"; import Map from "../../components/Map.vue";
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
import NewBg from "../../components/NewBg.vue";
import FlexCol from "../../components/FlexCol.vue";
import ModuleContent from "../../components/ModuleContent.vue";
export default { export default {
name: "huanweixunhang", name: "huanweixunhang",
components: { components: {
ModuleContent,
FlexCol, NewBg, SystemTitle,
Map Map
} }
} }
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.huanweixunhang {
height: 100vh;
display: flex;
flex-flow: column;
._map { ._map {
height: 0; width: 100%;
flex: 1; height: 100%;
position: relative; position: relative;
} }
}
</style> </style>

84
pages/wuzuzhi/paifang.vue
View File

@ -1,34 +1,90 @@
<template> <template>
<div class="paifang"> <new-bg>
<a-page-header <flex-col>
:ghost="false" <system-title show-back custom-title="无组织排放" :btns="btns"/>
style="border-bottom: 1px solid rgb(235, 237, 240)" <ModuleContent padding="0px 20px 20px">
title="无组织排放"
@back="() => $router.go(-1)"
/>
<a-row :gutter="16" style="height: 100%;margin-top: 16px;">
<a-col :span="4" style="height: 100%;">
<div class="con" style="height: 100%;display: flex;flex-direction: column; width: 100%;">
<web3-title>设备数量统计</web3-title>
<Split height="10"></Split>
<ModuleContent2 height="30%">
<cus-desc :data="tongji" :columns="descColumns"></cus-desc>
</ModuleContent2>
<web3-title>报警类型数据分析</web3-title>
<Split height="10"></Split>
<ModuleContent2 >
</ModuleContent2>
</div>
<a-row :gutter="16">
<a-col :span="18">
<Map></Map>
</a-col> </a-col>
<a-col :span="6"> <a-col :span="16" style="height: 100%;">
<div style="height: 100%;position: relative">
<div class="map-cv" style="height: calc(100% - 80px);position: relative">
<Map></Map>
</div>
<butgroup>
<cus-button>
<nuxt-link to="/wuzuzhi/xichejiguanli">洗车机管理</nuxt-link>
</cus-button>
<cus-button>
<nuxt-link to="/wuzuzhi/huanjingzhili">环境治理</nuxt-link>
</cus-button>
<cus-button>
<nuxt-link to="/wuzuzhi/huanweixunhang">环卫巡航</nuxt-link>
</cus-button>
</butgroup>
</div>
</a-col>
<a-col :span="4">
<a-card title="国Ⅵ输车辆" size="small"> <a-card title="国Ⅵ输车辆" size="small">
<p>card content</p> <p>card content</p>
</a-card> </a-card>
</a-col> </a-col>
</a-row> </a-row>
</ModuleContent>
</div> >
</flex-col>
</new-bg>
</template> </template>
<script> <script>
import Map from "../../components/Map.vue"; import Map from "../../components/Map.vue";
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
import NewBg from "../../components/NewBg.vue";
import FlexCol from "../../components/FlexCol.vue";
import ModuleContent from "../../components/ModuleContent.vue";
import Butgroup from "../../components/smallCommon/butgroup.vue";
import CusButton from "../../components/smallCommon/CusButton.vue";
import Web3Title from "../../components/smallCommon/Web3Title.vue";
import ModuleContent2 from "../../components/smallCommon/ModuleContent2.vue";
import Split from "../../components/smallCommon/Split.vue";
import CusDesc from "../../components/smallCommon/CusDesc.vue";
export default { export default {
name: "paifang", name: "paifang",
components: { components: {
CusDesc,
Split,
ModuleContent2,
Web3Title,
CusButton, Butgroup,
ModuleContent,
FlexCol, NewBg, SystemTitle,
Map Map
},
data () {
return {
tongji: {},
descColumns: [
{ title: '设备数量', key: 'total' },
{ title: '运行设备数量', key: 'total' },
{ title: '设备异常数量', key: 'total' },
{ title: '关闭设备数量', key: 'total' },
]
}
} }
} }
</script> </script>

148
pages/wuzuzhi/xichejiguanli.vue
View File

@ -1,14 +1,14 @@
<template> <template>
<div class="xichejiguanli"> <new-bg>
<a-page-header <flex-col>
:ghost="false" <system-title show-back custom-title="洗车机管理" />
style="border-bottom: 1px solid rgb(235, 237, 240)" <ModuleContent padding="0px 20px 20px">
title="洗车机管理" <a-row :gutter="16" style="height: 100%;">
@back="() => $router.go(-1)" <a-col :span="4" style="height: 100%;">
/> <FlexCol>
<div class="_body"> <web3-title>洗车机列表</web3-title>
<div class="left-list"> <Split height="10"></Split>
<ModuleContent2 >
<div :class="['car-washing-machine-tabs',activeCarTabs ==1?'active-car-washing-machine-tabs':'']" <div :class="['car-washing-machine-tabs',activeCarTabs ==1?'active-car-washing-machine-tabs':'']"
@click="carChange(1)"> @click="carChange(1)">
<div class="rank-num">1</div> <div class="rank-num">1</div>
@ -18,32 +18,19 @@
</div> </div>
</div> </div>
</ModuleContent2>
</FlexCol>
<div :class="['car-washing-machine-tabs',activeCarTabs ==2?'active-car-washing-machine-tabs':'']" </a-col>
@click="carChange(2)"> <a-col :span="15" style="height: 100%;">
<div class="rank-num">1</div> <FlexCol>
<div class="car-washing-machine-name">西门洗车</div>
<div class="state-icon">
正常
</div>
</div>
<div :class="['car-washing-machine-tabs',activeCarTabs ==3?'active-car-washing-machine-tabs':'']"
@click="carChange(3)">
<div class="rank-num">1</div>
<div class="car-washing-machine-name">西门洗车</div>
<div class="state-icon">
正常
</div>
</div>
</div>
<div class="center-content">
<div class="map-content"> <div class="map-content">
<Map></Map> <Map></Map>
</div> </div>
<div class="table-content"> <Split height="10"></Split>
<Curd <ModuleContent2 >
<CustomTable
hide-action hide-action
hide-search hide-search
hide-button hide-button
@ -54,52 +41,53 @@
> >
<template slot="search-button" slot-scope="{ search }"> <template slot="search-button" slot-scope="{ search }">
<a-button type="primary" @click="exportList(search)">导出历史数据</a-button> <a-button type="primary" @click="exportList(search)">导出历史数据</a-button>
<Split height="10"></Split>
</template> </template>
</Curd> </CustomTable>
</div> </ModuleContent2>
</div> </FlexCol>
</a-col>
<a-col :span="5" style="height: 100%;">
<FlexCol>
<web3-title>洗车机视频</web3-title>
<Split height="10"></Split>
<ModuleContent2 height="300px">
<div class="right-content"> </ModuleContent2>
<div class="_title">洗车机视频</div> <web3-title>洗车机运行信息</web3-title>
<div class="car-wash-video"> <Split height="10"></Split>
</div> <ModuleContent2>
<div class="_title">洗车机运行信息</div> </ModuleContent2>
<div class="car-run-info"> </FlexCol>
<div class="_title" style="text-align: center;">xxx洗车机</div> </a-col>
</a-row>
<div class="details-info"> </ModuleContent>
<div class="details-info-item"> </flex-col>
<div class="_title">运行状态：</div> </new-bg>
<div class="_title">正常</div>
</div>
<div class="details-info-item">
<div class="_title">冲洗压力：</div>
<div class="_title">500KPA</div>
</div>
<div class="details-info-item">
<div class="_title">冲洗电流：</div>
<div class="_title">50A</div>
</div>
<div class="details-info-item">
<div class="_title">冲洗电压：</div>
<div class="_title">500KV</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
import Map from "../../components/Map.vue"; import Map from "../../components/Map.vue";
import Curd from "../../components/smallCommon/Curd.vue"; import Curd from "../../components/smallCommon/Curd.vue";
import moment from "moment/moment"; import moment from "moment/moment";
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
import NewBg from "../../components/NewBg.vue";
import FlexCol from "../../components/FlexCol.vue";
import ModuleContent from "../../components/ModuleContent.vue";
import Web3Title from "../../components/smallCommon/Web3Title.vue";
import Split from "../../components/smallCommon/Split.vue";
import ModuleContent2 from "../../components/smallCommon/ModuleContent2.vue";
import CustomTable from "../../components/smallCommon/CustomTable.vue";
export default { export default {
name: "xichejiguanli", name: "xichejiguanli",
components: { components: {
CustomTable,
ModuleContent2,
Split,
Web3Title,
ModuleContent,
FlexCol, NewBg, SystemTitle,
Map, Map,
Curd Curd
}, },
@ -166,6 +154,18 @@ export default {
} }
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.map-content {
height: 400px;
width: 100%;
position: relative;
}
.table-content {
flex: 1;
padding-top: 10px;
}
.xichejiguanli { .xichejiguanli {
height: 100vh; height: 100vh;
display: flex; display: flex;
@ -215,25 +215,7 @@ export default {
} }
} }
.center-content {
flex: 1;
margin: 0 10px;
border: 1px solid #e8e8e8;
border-radius: 10px;
display: flex;
flex-flow: column;
.map-content {
height: 400px;
width: 100%;
position: relative;
}
.table-content {
flex: 1;
padding-top: 10px;
}
}
.right-content { .right-content {
width: 300px; width: 300px;

10
pages/youzuzhi/paifang.vue
View File

@ -45,10 +45,6 @@
<cus-button> <cus-button>
<nuxt-link to="/youzuzhi/paifangtongji">环保排放统计</nuxt-link> <nuxt-link to="/youzuzhi/paifangtongji">环保排放统计</nuxt-link>
</cus-button> </cus-button>
<!-- <cus-button>
<nuxt-link to="/cleanTravel/bangcheng">磅秤台账</nuxt-link>
</cus-button>
<cus-button>门禁监控</cus-button>-->
</butgroup> </butgroup>
</div> </div>
</a-col> </a-col>
@ -109,11 +105,11 @@ export default {
this.getData(1) this.getData(1)
}, },
methods: { methods: {
changeTab (tab) { changeTab ({ key }) {
this.getData(tab) this.getData(key)
}, },
getData (deviceType) { getData (deviceType) {
this.$http.get('/api/Organized/listanddevice', { this.$get('/api/Organized/listanddevice', {
organizedType: 1, organizedType: 1,
deviceType: deviceType deviceType: deviceType
}).then(({data}) => { }).then(({data}) => {