This commit is contained in:
parent
ccd5595032
commit
fc51e54c32
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
<template>
|
||||
<div style="text-align: left">
|
||||
<div class="table-search">
|
||||
<div class="table-search" v-if="searchItems.length > 0">
|
||||
<a-form class="ant-advanced-search-form" :form="form" @submit="handleSearch" layout="inline" @change="handleSearchFormChange">
|
||||
<a-form-item v-for="menuItem in searchItems" :key="menuItem.key" :label="menuItem.label">
|
||||
<a-input
|
||||
|
|
@ -21,18 +21,19 @@
|
|||
:placeholder="menuItem.placeholder || ''" v-decorator="[menuItem.key]" v-else-if="menuItem.type === 'dateRange'" format="YYYY-MM-DD" />
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button type="primary" html-type="submit">查询</a-button>
|
||||
<a-button :style="{ marginLeft: '8px' }" @click="reset">重置</a-button>
|
||||
<a-button type="primary" html-type="submit" v-if="!hideSearch">查询</a-button>
|
||||
<a-button :style="{ marginLeft: '8px' }" @click="reset" v-if="!hideSearch">重置</a-button>
|
||||
<slot name="search-button" v-bind:search="form.getFieldsValue()"></slot>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
<a-divider />
|
||||
<div class="table-operations">
|
||||
<a-divider v-if="!hideButton && searchItems.length > 0" />
|
||||
<div class="table-operations" v-if="!hideButton">
|
||||
<a-button @click="addRow" type="primary">
|
||||
添加
|
||||
</a-button>
|
||||
</div>
|
||||
<a-table :row-key="primaryKey" :columns="realColumns" :data-source="tableDataSource" @change="handleChange" >
|
||||
<a-table v-bind="tableProps" :pagination="page" :row-key="primaryKey" :columns="realColumns" :data-source="tableDataSource" @change="handleChange" >
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a-button type="danger" size="small" @click="deleteRow(record)">删除</a-button>
|
||||
<a-divider type="vertical" />
|
||||
|
|
@ -99,12 +100,29 @@ export default {
|
|||
selectRow: null,
|
||||
page: {
|
||||
pageSize: 10,
|
||||
pageNo: 1
|
||||
current: 1,
|
||||
total: 0
|
||||
},
|
||||
searchFormModel: {}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
tableProps: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
hideSearch: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
hideAction: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
hideButton: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 表单内容配置
|
||||
formItems: {
|
||||
type: Array,
|
||||
|
|
@ -130,6 +148,7 @@ export default {
|
|||
return this.formItems.filter(item => !!item.isSearch)
|
||||
},
|
||||
realColumns () {
|
||||
if (this.hideAction) return [ ...this.columns ]
|
||||
return [
|
||||
...this.columns,
|
||||
{
|
||||
|
|
@ -188,12 +207,14 @@ export default {
|
|||
},
|
||||
deleteRow(row) {
|
||||
const self = this
|
||||
if (!self.apiConf.deleteApi) return
|
||||
this.$confirm({
|
||||
title: '确认要删除么?',
|
||||
okText: '确认',
|
||||
okType: 'danger',
|
||||
cancelText: '再想想',
|
||||
onOk() {
|
||||
|
||||
const { api,deleteKey, paramsType, method } = self.apiConf.deleteApi
|
||||
let params = {}
|
||||
if (paramsType === 'Array') {
|
||||
|
|
@ -210,9 +231,9 @@ export default {
|
|||
|
||||
|
||||
},
|
||||
handleChange ({ pageSize, pageNo }) {
|
||||
handleChange ({ pageSize, current }) {
|
||||
this.page.pageSize = pageSize
|
||||
this.page.pageNo = pageNo
|
||||
this.page.current = current
|
||||
this.handleSearch()
|
||||
},
|
||||
reset() {
|
||||
|
|
@ -225,11 +246,13 @@ export default {
|
|||
const { data } = await this[`$${method}`](api, {
|
||||
...values,
|
||||
pageSize: this.page.pageSize,
|
||||
current: this.page.pageNo,
|
||||
current: this.page.current,
|
||||
})
|
||||
if (noPage) {
|
||||
this.page = false
|
||||
this.tableDataSource = data
|
||||
} else {
|
||||
this.page.total = data.total || 0
|
||||
this.tableDataSource = data.items
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,46 @@
|
|||
|
||||
|
||||
<template>
|
||||
<div class="custom-table">
|
||||
<Curd v-bind="$attrs" v-on="$listeners"></Curd>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Curd from "./Curd.vue";
|
||||
|
||||
export default {
|
||||
name: "CustomTable",
|
||||
components: {Curd}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.custom-table {
|
||||
/deep/ .ant-table-thead > tr > th {
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
/deep/ .ant-table {
|
||||
background: rgba(255, 255, 255, 0.01);
|
||||
color: #FFFFFF;
|
||||
}
|
||||
/deep/ .ant-table-tbody > tr > td {
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid rgba(16, 40, 73, 0.3);
|
||||
border-top: 1px solid rgba(16, 40, 73, 0.3);
|
||||
}
|
||||
|
||||
/deep/ .ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
|
||||
/deep/ .ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
|
||||
/deep/ .ant-table-thead > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
|
||||
/deep/ .ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td {
|
||||
background: rgba(255, 255, 255, 0.01);
|
||||
color: #FFFFFF;
|
||||
}
|
||||
/deep/ .selected {
|
||||
background: linear-gradient(90deg, rgba(16, 40, 73, 0) 0%, rgba(16, 40, 73, 1) 51.3%, rgba(16, 40, 73, 0) 100%);
|
||||
border-bottom: 1px solid rgba(18, 45, 79, 0.8);
|
||||
border-top: 1px solid rgba(18, 45, 79, 0.8);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,62 +1,68 @@
|
|||
<template>
|
||||
<a-layout id="components-layout-demo-fixed-sider">
|
||||
<a-layout-sider :trigger="null" v-model="collapsed" collapsible>
|
||||
<div class="logo">
|
||||
欢迎
|
||||
</div>
|
||||
<a-menu theme="dark" mode="inline" v-model="selectedKeys">
|
||||
<a-menu-item key="1" v-for="item in menus" :key="item.key">
|
||||
<a-icon :type="item.icon"/>
|
||||
<span class="nav-text">{{ item.title }}</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-layout-sider>
|
||||
<a-layout>
|
||||
<a-layout-header
|
||||
style="background: #fff; padding: 0"
|
||||
ref="header"
|
||||
:title="pageTitle"
|
||||
:breadcrumb="{ props: { routes } }"
|
||||
>
|
||||
<div class="header-con">
|
||||
<a-locale-provider :locale="zh_CN">
|
||||
<a-layout id="components-layout-demo-fixed-sider">
|
||||
<a-layout-sider :trigger="null" v-model="collapsed" collapsible>
|
||||
<div class="logo">
|
||||
欢迎
|
||||
</div>
|
||||
<a-menu theme="dark" mode="inline" v-model="selectedKeys">
|
||||
<a-menu-item key="1" v-for="item in menus" :key="item.key">
|
||||
<a-icon :type="item.icon"/>
|
||||
<span class="nav-text">{{ item.title }}</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-layout-sider>
|
||||
<a-layout>
|
||||
<a-layout-header
|
||||
style="background: #fff; padding: 0"
|
||||
ref="header"
|
||||
:title="pageTitle"
|
||||
:breadcrumb="{ props: { routes } }"
|
||||
>
|
||||
<div class="header-con">
|
||||
|
||||
<a-icon
|
||||
class="trigger"
|
||||
:type="collapsed ? 'menu-unfold' : 'menu-fold'"
|
||||
@click="() => (collapsed = !collapsed)"
|
||||
/>
|
||||
<a-menu class="cus-menu">
|
||||
<a-sub-menu>
|
||||
<a-icon
|
||||
class="trigger"
|
||||
:type="collapsed ? 'menu-unfold' : 'menu-fold'"
|
||||
@click="() => (collapsed = !collapsed)"
|
||||
/>
|
||||
<a-menu class="cus-menu">
|
||||
<a-sub-menu>
|
||||
<span slot="title" class="submenu-title-wrapper">
|
||||
<a-icon type="setting"/>
|
||||
操作
|
||||
</span>
|
||||
<a-menu-item key="setting:2">修改密码</a-menu-item>
|
||||
<a-menu-item key="setting:1">退出</a-menu-item>
|
||||
</a-sub-menu>
|
||||
</a-menu>
|
||||
<a-menu-item key="setting:2">修改密码</a-menu-item>
|
||||
<a-menu-item key="setting:1">退出</a-menu-item>
|
||||
</a-sub-menu>
|
||||
</a-menu>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</a-layout-header>
|
||||
<a-layout-content :style="contentStyle">
|
||||
<div :style="containerStyle">
|
||||
<nuxt/>
|
||||
</div>
|
||||
</a-layout-content>
|
||||
<!-- <a-layout-footer :style="{ textAlign: 'center' }" ref="footer">
|
||||
Ant Design ©2018 Created by Ant UED
|
||||
</a-layout-footer>-->
|
||||
</a-layout-header>
|
||||
<a-layout-content :style="contentStyle">
|
||||
<div :style="containerStyle">
|
||||
<nuxt/>
|
||||
</div>
|
||||
</a-layout-content>
|
||||
<!-- <a-layout-footer :style="{ textAlign: 'center' }" ref="footer">
|
||||
Ant Design ©2018 Created by Ant UED
|
||||
</a-layout-footer>-->
|
||||
</a-layout>
|
||||
</a-layout>
|
||||
</a-layout>
|
||||
</a-locale-provider>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import zh_CN from 'ant-design-vue/lib/locale-provider/zh_CN';
|
||||
import 'moment/locale/zh-cn';
|
||||
|
||||
export default {
|
||||
name: "manager",
|
||||
data() {
|
||||
return {
|
||||
zh_CN,
|
||||
collapsed: false,
|
||||
headerHeight: 0,
|
||||
footerHeight: 0,
|
||||
|
|
@ -85,6 +91,12 @@ export default {
|
|||
title: '菜单管理',
|
||||
icon: 'link',
|
||||
key: 'manager-menu'
|
||||
},
|
||||
{
|
||||
link: '/manager/device',
|
||||
title: '设备管理',
|
||||
icon: 'video-camera',
|
||||
key: 'manager-device'
|
||||
}
|
||||
],
|
||||
selectedKeys: []
|
||||
|
|
@ -93,12 +105,12 @@ export default {
|
|||
watch: {
|
||||
'$route': {
|
||||
immediate: true,
|
||||
handler (to) {
|
||||
handler(to) {
|
||||
this.selectedKeys = [to.name]
|
||||
}
|
||||
},
|
||||
selectedKeys ([key]) {
|
||||
this.$router.push({ name: key })
|
||||
selectedKeys([key]) {
|
||||
this.$router.push({name: key})
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -136,6 +148,7 @@ export default {
|
|||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#components-layout-demo-fixed-sider {
|
||||
.header-con {
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
|
||||
<template>
|
||||
<a-card :bordered="false" :bodyStyle="{ padding: '0px 16px' }">
|
||||
<nuxt />
|
||||
</a-card>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "user"
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,438 @@
|
|||
<!--峰煤监控系统-->
|
||||
<template>
|
||||
<new-bg>
|
||||
<flex-col>
|
||||
<system-title/>
|
||||
<ModuleContent padding="20px">
|
||||
<flex-col>
|
||||
<web2-title>清洁运输</web2-title>
|
||||
<ModuleContent padding="0 20px 20px">
|
||||
<BFC>
|
||||
<div class="sou-suo-kuang" slot="right">
|
||||
<ModuleContent2 bg padding="20px">
|
||||
<flex-col>
|
||||
<div class="search">
|
||||
<BFC>
|
||||
<span slot="left"> 车牌号:</span>
|
||||
<div slot="center" class="input">
|
||||
<a-input v-model="searchCarNum" placeholder="请输入"/>
|
||||
</div>
|
||||
</BFC>
|
||||
</div>
|
||||
<ModuleContent padding="0">
|
||||
<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>
|
||||
|
||||
</ModuleContent>
|
||||
</flex-col>
|
||||
|
||||
</ModuleContent>
|
||||
</flex-col>
|
||||
</ModuleContent2>
|
||||
</div>
|
||||
<div class="liebiao" slot="center">
|
||||
<flex-col>
|
||||
<div style="height: 144px;width: 100%;">
|
||||
<ModuleContent2 bg bg-str :border="false">
|
||||
<butgroup2 style="height: 100%;">
|
||||
<ModuleContent2 bg bg-color border>
|
||||
<miaoshu title="进场车辆" :value="count.comeCount" color="rgba(42, 207, 255, 1)"></miaoshu>
|
||||
</ModuleContent2>
|
||||
|
||||
<ModuleContent2 bg bg-color border style="margin-left: 16px;">
|
||||
<miaoshu title="出场车辆" :value="count.outCount" color="rgba(255, 171, 87, 1)"></miaoshu>
|
||||
</ModuleContent2>
|
||||
|
||||
<ModuleContent2 bg bg-color border style="margin-left: 16px;">
|
||||
<miaoshu title="在场车辆" :value="count.inCount" color="rgba(122, 175, 255, 1)"></miaoshu>
|
||||
</ModuleContent2>
|
||||
|
||||
<ModuleContent2 bg bg-color border style="margin-left: 16px;">
|
||||
<miaoshu title="新增车辆" :value="count.addCount" color="rgba(76, 243, 129, 1)"></miaoshu>
|
||||
</ModuleContent2>
|
||||
</butgroup2>
|
||||
</ModuleContent2>
|
||||
</div>
|
||||
<web3-title>门禁监控</web3-title>
|
||||
<ModuleContent padding="20px 0" ref="module">
|
||||
<div class="table-content">
|
||||
<PeakCustomTable
|
||||
hide-action
|
||||
hide-search
|
||||
hide-button
|
||||
:columns="columns"
|
||||
:api-conf="apiConf"
|
||||
:tableProps="tableProps"
|
||||
/>
|
||||
|
||||
</div>
|
||||
</ModuleContent>
|
||||
</flex-col>
|
||||
|
||||
|
||||
</div>
|
||||
</BFC>
|
||||
</ModuleContent>
|
||||
<butgroup>
|
||||
<cus-button>厂区车辆台账</cus-button>
|
||||
<cus-button>清洁运输趋势</cus-button>
|
||||
<cus-button>磅秤台账</cus-button>
|
||||
<cus-button>门禁监控</cus-button>
|
||||
</butgroup>
|
||||
</flex-col>
|
||||
</ModuleContent>
|
||||
</flex-col>
|
||||
</new-bg>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapActions, mapState} from "vuex";
|
||||
import SystemTitle from "../../components/smallCommon/SystemTitle.vue";
|
||||
import FlexCol from "../../components/FlexCol.vue";
|
||||
import ModuleContent from "../../components/ModuleContent.vue";
|
||||
import Web2Title from "../../components/smallCommon/Web2Title.vue";
|
||||
import NewBg from "../../components/NewBg.vue";
|
||||
import BFC from "../../components/BFC.vue";
|
||||
import Butgroup from "../../components/smallCommon/butgroup.vue";
|
||||
import CusButton from "../../components/smallCommon/CusButton.vue";
|
||||
import Web3Title from "../../components/smallCommon/Web3Title.vue";
|
||||
import CusButton2 from "../../components/smallCommon/CusButton2.vue";
|
||||
import Butgroup2 from "../../components/smallCommon/butgroup2.vue";
|
||||
import CusDesc from "../../components/smallCommon/CusDesc.vue";
|
||||
import ModuleContent2 from "../../components/smallCommon/ModuleContent2.vue";
|
||||
import Miaoshu from "../../components/smallCommon/miaoshu.vue";
|
||||
import bgStr from '../../assets/images/new/矩形 17.png'
|
||||
import PeakCustomTable from "@/components/smallCommon/CustomTable";
|
||||
import Curd from "../../components/smallCommon/Curd.vue";
|
||||
|
||||
export default {
|
||||
name: "PeakCoalMonitoring",
|
||||
components: {
|
||||
Curd,
|
||||
Miaoshu,
|
||||
ModuleContent2,
|
||||
CusDesc,
|
||||
Butgroup2,
|
||||
CusButton2,
|
||||
Web3Title,
|
||||
CusButton,
|
||||
Butgroup,
|
||||
BFC,
|
||||
Web2Title,
|
||||
NewBg,
|
||||
ModuleContent,
|
||||
FlexCol,
|
||||
SystemTitle,
|
||||
PeakCustomTable
|
||||
},
|
||||
data() {
|
||||
const self = this
|
||||
return {
|
||||
tableProps: {
|
||||
customRow (record) {
|
||||
return {
|
||||
on: {
|
||||
click: (event) => {
|
||||
self.selectedRecord = record
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
rowClassName (record, index) {
|
||||
if (record.id === self.selectedRecord.id) return 'selected'
|
||||
return ''
|
||||
}
|
||||
},
|
||||
apiConf: {
|
||||
listApi: { api: '/api/Transport/list', method: 'get' },
|
||||
},
|
||||
selectedRecord: {},
|
||||
bgStr,
|
||||
searchCarNum: '',
|
||||
tableH: 513,
|
||||
count: {
|
||||
addCount: 0,
|
||||
comeCount: 1,
|
||||
inCount: 1,
|
||||
outCount: 0,
|
||||
},
|
||||
dataSource: [],
|
||||
descColumns: [
|
||||
{
|
||||
title: '设备掉线',
|
||||
dataIndex: 'deviceName',
|
||||
width: '33.333%'
|
||||
},
|
||||
{
|
||||
title: '故障异常',
|
||||
dataIndex: 'errorName',
|
||||
width: '33.333%'
|
||||
},
|
||||
{
|
||||
title: '异常报警',
|
||||
dataIndex: 'errorImg',
|
||||
width: '33.333%'
|
||||
}
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
dataIndex: 'carNumber',
|
||||
key: 'carNumber',
|
||||
title: '车牌号'
|
||||
},
|
||||
{
|
||||
dataIndex: 'transportType',
|
||||
key: 'transportType',
|
||||
title: '类型',
|
||||
customRender(transportType) {
|
||||
if (transportType === 1) return '进厂'
|
||||
return '出厂'
|
||||
}
|
||||
},
|
||||
{
|
||||
dataIndex: 'address',
|
||||
key: 'address',
|
||||
title: '进出厂位置'
|
||||
},
|
||||
{
|
||||
dataIndex: 'registered',
|
||||
key: 'registered',
|
||||
title: '出/入厂位置'
|
||||
},
|
||||
{
|
||||
dataIndex: 'goods',
|
||||
key: 'goods',
|
||||
title: '物料类型'
|
||||
},
|
||||
{
|
||||
dataIndex: 'effluent',
|
||||
key: 'effluent',
|
||||
title: '排放标准'
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
title: state => state.system.title,
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
this.getCount()
|
||||
this.getDataSource()
|
||||
this.$nextTick(() => {
|
||||
const win = window.top
|
||||
this.$http.get('http://101.43.201.20:5000/api/Home/view').then(({data}) => {
|
||||
win.document.title = data.home.title
|
||||
this.setTitle(data.home.title)
|
||||
this.setInfo(data)
|
||||
})
|
||||
|
||||
if (this.$refs.module) {
|
||||
const offsetHeight = this.$refs.module.$el.offsetHeight - 40
|
||||
this.tableH = offsetHeight
|
||||
}
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
...mapActions('system', ['setTitle', 'setInfo']),
|
||||
getCount() {
|
||||
this.$get('/api/Transport/count').then(({data}) => {
|
||||
this.count = data
|
||||
})
|
||||
},
|
||||
|
||||
getDataSource () {
|
||||
this.$get('/api/Transport/list').then(({data}) => {
|
||||
this.dataSource = data
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 图层构造器
|
||||
* @param { object } props
|
||||
* @param { 'cems' | 'sdjcy' | 'zkz' | 'gbz' | 'ssc' | 'shisc' | 'wz' | 'jkd' } props.layerType 图层类型 jkd(监控点) wz(微站) sdjcy(深度检测仪) zkz（质控站） gbz(国标站) ssc(洒水车) shisc(湿扫车) cems（CEMS）
|
||||
* @param { object } props.data 图层类型
|
||||
*/
|
||||
pointClick({layerType, data}) {
|
||||
// todo
|
||||
if (layerType == 'wz') {
|
||||
this.$open(WZDialog, {
|
||||
type: 'middle'
|
||||
}, {
|
||||
screenType: 'middle',
|
||||
title: '微站',
|
||||
width: 1100,
|
||||
onClose() {
|
||||
console.log(1);
|
||||
}
|
||||
})
|
||||
} else if (layerType === 'sdjcy') {
|
||||
this.$open(SDJCYDialog, {
|
||||
type: 'middle'
|
||||
}, {
|
||||
screenType: 'custommiddle',
|
||||
title: '深度检测仪',
|
||||
width: 1100,
|
||||
onClose() {
|
||||
console.log(1);
|
||||
}
|
||||
})
|
||||
} else if (layerType === 'zkz') {
|
||||
this.$open(ZKZDialog, {
|
||||
type: 'middle'
|
||||
}, {
|
||||
screenType: 'custommiddle',
|
||||
title: '质控站',
|
||||
width: 1100,
|
||||
onClose() {
|
||||
console.log(1);
|
||||
}
|
||||
})
|
||||
} else if (layerType === 'gbz') {
|
||||
this.$open(GBZDialog, {
|
||||
type: 'middle'
|
||||
}, {
|
||||
screenType: 'custommiddle',
|
||||
title: '国标站',
|
||||
width: 1100,
|
||||
onClose() {
|
||||
console.log(1);
|
||||
}
|
||||
})
|
||||
} else if (layerType === 'cems') {
|
||||
this.$open(CEMSDialog, {
|
||||
type: 'middle'
|
||||
}, {
|
||||
screenType: 'custommiddle',
|
||||
title: 'CEMS',
|
||||
width: 1100,
|
||||
onClose() {
|
||||
console.log(1);
|
||||
}
|
||||
})
|
||||
} else if (layerType === 'jkd') {
|
||||
this.$open(pointDialog, {
|
||||
type: 'middle'
|
||||
}, {
|
||||
screenType: 'custommiddle',
|
||||
title: '监控点',
|
||||
width: 1100,
|
||||
onClose() {
|
||||
console.log(1);
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
body, html, #__nuxt, #__layout {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #09151F;
|
||||
}
|
||||
|
||||
.list-enter-active, .list-leave-active {
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
.list-enter, .list-leave-to
|
||||
/* .list-leave-active for below version 2.1.8 */
|
||||
{
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped lang="less">
|
||||
@import "../../assets/styles/mixin";
|
||||
|
||||
.sou-suo-kuang {
|
||||
height: 100%;
|
||||
width: 580px;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
pointer-events: auto;
|
||||
|
||||
|
||||
.search {
|
||||
/deep/ .ant-input {
|
||||
color: #fff;
|
||||
background: rgba(5, 38, 93, 1);
|
||||
border: 1.28px solid rgba(35, 209, 232, 1);
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
background: rgba(5, 38, 93, 1);
|
||||
border: 1.28px solid rgba(35, 209, 232, 1);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
box-sizing: border-box;
|
||||
padding: 28px 16px;
|
||||
|
||||
background: rgba(24, 131, 201, 0.2);
|
||||
|
||||
|
||||
/** 文本1 */
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0px;
|
||||
line-height: 23.17px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
line-height: 32px;
|
||||
|
||||
.input {
|
||||
margin-left: 10px;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.liebiao {
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
.car-preview {
|
||||
width: 100%;
|
||||
height: 260px;
|
||||
}
|
||||
|
||||
.desc {
|
||||
background: rgba(24, 131, 201, 0.2);
|
||||
border: 1px solid rgba(15, 81, 122, 1);
|
||||
}
|
||||
|
||||
.table-content {
|
||||
padding-top: 20px;
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<a-page-header
|
||||
:ghost="false"
|
||||
style="border-bottom: 1px solid rgb(235, 237, 240)"
|
||||
title="厂区车辆台账"
|
||||
@back="() => $router.go(-1)"
|
||||
/>
|
||||
<a-row :gutter="16">
|
||||
<a-col :span="6">
|
||||
<a-card title="运输车辆" size="small">
|
||||
<p>card content</p>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-card title="国Ⅵ输车辆" size="small">
|
||||
<p>card content</p>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-card title="非道路工程机械" size="small">
|
||||
<p>card content</p>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-card title="燃油运输车辆" size="small">
|
||||
<p>card content</p>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-divider />
|
||||
<Curd
|
||||
hide-action
|
||||
hide-search
|
||||
hide-button
|
||||
:columns="columns"
|
||||
:api-conf="apiConf"
|
||||
:form-items="formItems"
|
||||
@edit="editHandler"
|
||||
>
|
||||
<template slot="search-button" slot-scope="{ search }">
|
||||
<a-button type="primary" @click="exportList(search)">导出历史数据</a-button>
|
||||
</template>
|
||||
</Curd>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Curd from "../../components/smallCommon/Curd.vue";
|
||||
import moment from 'moment'
|
||||
export default {
|
||||
name: "user",
|
||||
layout: "user",
|
||||
components: {
|
||||
Curd
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
isEdit: false,
|
||||
roles: [],
|
||||
columns: [
|
||||
{
|
||||
dataIndex: 'outTime',
|
||||
key: 'outTime',
|
||||
title: '日期'
|
||||
},
|
||||
{
|
||||
dataIndex: 'carNum',
|
||||
key: 'carNum',
|
||||
title: '车牌号'
|
||||
},
|
||||
{
|
||||
dataIndex: 'carModel',
|
||||
key: 'carModel',
|
||||
title: '车型'
|
||||
},
|
||||
{
|
||||
dataIndex: 'newCar',
|
||||
key: 'newCar',
|
||||
title: '新能源',
|
||||
customRender (text) {
|
||||
if (text) return '是'
|
||||
return '否'
|
||||
}
|
||||
},
|
||||
{
|
||||
dataIndex: 'emissions',
|
||||
key: 'emissions',
|
||||
title: '燃油车'
|
||||
},
|
||||
{
|
||||
dataIndex: 'createDateTime',
|
||||
key: 'createDateTime',
|
||||
title: '出厂日期'
|
||||
}
|
||||
],
|
||||
apiConf: {
|
||||
listApi: { api: '/api/Ledger/list', method: 'get' },
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
formItems () {
|
||||
return [
|
||||
{
|
||||
type: 'dateRange',
|
||||
key: 'time',
|
||||
label: '日期',
|
||||
isSearch: true,
|
||||
placeholder: ['请选择开始日期', '请选择结束日期'],
|
||||
rules: [
|
||||
{ required: true, message: '请选择时间范围' }
|
||||
],
|
||||
fields: ['startTime', 'endTime']
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
|
||||
methods: {
|
||||
editHandler (isEdit) {
|
||||
this.isEdit = isEdit
|
||||
},
|
||||
exportList ({ time }) {
|
||||
const [ start, end ] = time
|
||||
const fmt = 'YYYY-MM-DD'
|
||||
window.open(`http://101.43.201.20:5000/api/Ledger/export?start=${moment(start).format(fmt)}&end=${moment(end).format(fmt)}`, '_blank')
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,126 @@
|
|||
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<a-page-header
|
||||
:ghost="false"
|
||||
title="清洁运输+趋势"
|
||||
@back="() => $router.go(-1)"
|
||||
/>
|
||||
<a-divider style="margin-top: 0;" />
|
||||
<a-row :gutter="16">
|
||||
<a-col :span="12">
|
||||
<a-card>
|
||||
<div slot="title">
|
||||
运输总量: {{ yunshuzongliang }}
|
||||
</div>
|
||||
|
||||
<Curd
|
||||
hide-action
|
||||
hide-search
|
||||
hide-button
|
||||
:columns="columns"
|
||||
:api-conf="apiConf"
|
||||
:form-items="formItems"
|
||||
>
|
||||
</Curd>
|
||||
</a-card>
|
||||
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-card title="国Ⅵ输车辆" size="small">
|
||||
<p>card content</p>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Curd from "../../components/smallCommon/Curd.vue";
|
||||
import moment from 'moment'
|
||||
export default {
|
||||
name: "user",
|
||||
layout: "user",
|
||||
components: {
|
||||
Curd
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
yunshuzongliang: 0,
|
||||
isEdit: false,
|
||||
roles: [],
|
||||
columns: [
|
||||
{
|
||||
dataIndex: 'outTime',
|
||||
key: 'outTime',
|
||||
title: '日期'
|
||||
},
|
||||
{
|
||||
dataIndex: 'carNum',
|
||||
key: 'carNum',
|
||||
title: '车牌号'
|
||||
},
|
||||
{
|
||||
dataIndex: 'carModel',
|
||||
key: 'carModel',
|
||||
title: '车型'
|
||||
},
|
||||
{
|
||||
dataIndex: 'newCar',
|
||||
key: 'newCar',
|
||||
title: '新能源',
|
||||
customRender (text) {
|
||||
if (text) return '是'
|
||||
return '否'
|
||||
}
|
||||
},
|
||||
{
|
||||
dataIndex: 'emissions',
|
||||
key: 'emissions',
|
||||
title: '燃油车'
|
||||
},
|
||||
{
|
||||
dataIndex: 'createDateTime',
|
||||
key: 'createDateTime',
|
||||
title: '出厂日期'
|
||||
}
|
||||
],
|
||||
apiConf: {
|
||||
listApi: { api: '/api/Transport/list', method: 'get' },
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
formItems () {
|
||||
return [
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getyunshuzongliang()
|
||||
},
|
||||
|
||||
methods: {
|
||||
getyunshuzongliang () {
|
||||
/*this.$get('/api/Transport/count').then(({ data }) => {
|
||||
this.yunshuzongliang = data
|
||||
})*/
|
||||
},
|
||||
editHandler (isEdit) {
|
||||
this.isEdit = isEdit
|
||||
},
|
||||
exportList ({ time }) {
|
||||
const [ start, end ] = time
|
||||
const fmt = 'YYYY-MM-DD'
|
||||
window.open(`http://101.43.201.20:5000/api/Ledger/export?start=${moment(start).format(fmt)}&end=${moment(end).format(fmt)}`, '_blank')
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
|
||||
</style>
|
||||
|
|
@ -66,7 +66,7 @@ export default {
|
|||
{
|
||||
type: 'input',
|
||||
key: 'deviceMN',
|
||||
label: '编码',
|
||||
label: 'MN编码',
|
||||
isSearch: true,
|
||||
placeholder: '请输入编码',
|
||||
rules: [
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ export default {
|
|||
Curd
|
||||
},
|
||||
data () {
|
||||
const self = this
|
||||
return {
|
||||
isEdit: false,
|
||||
roles: [],
|
||||
|
|
@ -43,7 +44,11 @@ export default {
|
|||
{
|
||||
dataIndex: 'roleId',
|
||||
key: 'roleId',
|
||||
title: '角色'
|
||||
title: '角色',
|
||||
customRender (text) {
|
||||
const item = (self.roles || []).find(item => item.value === text)
|
||||
return item && item.label || ''
|
||||
}
|
||||
}
|
||||
],
|
||||
apiConf: {
|
||||
|
|
|
|||
|
|
@ -5,6 +5,10 @@ module.exports = {
|
|||
scale: 0.5,
|
||||
ignore: [
|
||||
'manager',
|
||||
'video',
|
||||
'youzuzhi',
|
||||
'wuzuzhi',
|
||||
'cleanTravel',
|
||||
'node_modules',
|
||||
'peak-coal-monitoring',
|
||||
'web',
|
||||
|
|
|
|||
Loading…
Reference in New Issue