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

1211

This commit is contained in:
DESKTOP-VMMLSOQ\wangzg 2024-07-01 22:53:31 +08:00
parent fc51e54c32
commit 461ffa19e0
8 changed files with 285 additions and 396 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
README.md
View File

@ -37,3 +37,32 @@ vue混入代码，主要是自适应相关的代码
## 组件库文档地址
https://1x.antdv.com/components/icon/
## 路由说明
登录页 /login
### 管理页
用户管理 /manager/user
角色管理 /manager/role
菜单管理 /manager/menu
设备管理 /manager/device
工序管理 /manager/organized
### 用户端
首页 /home
#### 有组织
有组织
#### 无组织
#### 清洁运输
清洁运输 /cleanTravel/home
厂区车辆台账 /cleanTravel/ledger
清洁运输趋势 /cleanTravel/trend
磅秤台账 /cleanTravel/bangcheng
#### 视频广场

6
layouts/manager.vue
View File

@ -97,6 +97,12 @@ export default {
title: '设备管理',
icon: 'video-camera',
key: 'manager-device'
},
{
link: '/manager/organized',
title: '工序管理',
icon: 'video-camera',
key: 'manager-organized'
}
],
selectedKeys: []

140
pages/cleanTravel/bangcheng.vue Normal file
View File

@ -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
pages/web1/index.vue → pages/home/index.vue
View File

96
pages/manager/organized.vue Normal file
View File

@ -0,0 +1,96 @@
<template>
<div>
<Curd
:columns="columns"
:api-conf="apiConf"
:form-items="formItems"
/>
</div>
</template>
<script>
import base from "~/templates/base";
import Curd from "../../components/smallCommon/Curd.vue";
export default {
name: "organized",
extends: base,
components: {
Curd
},
data() {
return {
deviceTypes: [],
columns: [
{
dataIndex: 'name',
key: 'name',
title: '工序名称'
},
{
dataIndex: 'organizedType',
key: 'organizedType',
title: '工序类型'
},
{
dataIndex: 'order',
key: 'order',
title: '排序'
}
],
apiConf: {
listApi: {api: '/api/Organized/list', method: 'get', noPage: true},
deleteApi: {api: '/api/Organized/remove', method: 'delete', paramsType: 'Array'},
editApi: {api: '/api/Organized/update', method: 'put'},
addApi: {api: '/api/Organized/add', method: 'post',}
}
}
},
computed: {
formItems() {
const self = this
return [
{
type: 'input',
key: 'name',
label: '工序名称',
isSearch: true,
placeholder: '请输入工序名称',
rules: [
{required: true, message: '请输入工序名称'}
]
},
{
type: 'select',
key: 'organizedType',
label: '工序类型',
children: []
},
{
type: 'input',
key: 'order',
label: '排序'
}
]
}
},
created() {
this.getMenus()
},
methods: {
getMenus() {
this.$get('/api/Device/GetDeviceTypes').then(({data}) => {
this.deviceTypes = Object.keys(data).map(item => ({
label: data[item],
value: item
}))
})
}
}
}
</script>
<style scoped lang="less">
</style>

396
pages/web2/index.vue
View File

@ -1,396 +0,0 @@
<!--峰煤监控系统-->
<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 placeholder="请输入"/>
</div>
</BFC>
</div>
<ModuleContent padding="0">
<flex-col>
<web3-title>门禁详情</web3-title>
<ModuleContent padding="0">
<flex-col>
<img src="" 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 :columns="columns"></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="111" color="rgba(42, 207, 255, 1)"></miaoshu>
</ModuleContent2>
<ModuleContent2 bg bg-color border style="margin-left: 16px;">
<miaoshu title="出场车辆" value="111" color="rgba(255, 171, 87, 1)"></miaoshu>
</ModuleContent2>
<ModuleContent2 bg bg-color border style="margin-left: 16px;">
<miaoshu title="在场车辆" value="111" color="rgba(122, 175, 255, 1)"></miaoshu>
</ModuleContent2>
<ModuleContent2 bg bg-color border style="margin-left: 16px;">
<miaoshu title="新增车辆" value="111" 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">
<peak-custom-table :table-title="columnsForTable" :data-source="dataSource" :limit-move-num="11"/>
</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/peak-coal-monitoring/PeakCustomTable2";
export default {
name: "PeakCoalMonitoring",
components: {
Miaoshu,
ModuleContent2,
CusDesc,
Butgroup2,
CusButton2,
Web3Title,
CusButton,
Butgroup,
BFC,
Web2Title,
NewBg,
ModuleContent,
FlexCol,
SystemTitle,
PeakCustomTable
},
data() {
return {
bgStr,
tableH: 513,
dataSource: [
{
deviceName: '高炉',
errorName: '异常',
errorImg: '红灯'
},
{
deviceName: '高炉',
errorName: '异常',
errorImg: '红灯'
},
{
deviceName: '高炉',
errorName: '异常',
errorImg: '红灯'
},
{
deviceName: '高炉',
errorName: '异常',
errorImg: '红灯'
},
{
deviceName: '高炉',
errorName: '异常',
errorImg: '红灯'
},
{
deviceName: '高炉',
errorName: '异常',
errorImg: '红灯'
}
],
columnsForTable: [
{
title: '设备掉线',
dataIndex: 'deviceName',
width: '33.333%'
},
{
title: '故障异常',
dataIndex: 'errorName',
width: '33.333%'
},
{
title: '异常报警',
dataIndex: 'errorImg',
width: '33.333%'
}
],
columns: [
{
title: '排放标准',
key: 'bz',
},
{
title: 'VIN',
key: 'vin',
},
{
title: '发动机号',
key: 'fdjh',
},
{
title: '注册日期',
key: 'zcr',
}
]
}
},
computed: {
...mapState({
title: state => state.system.title,
})
},
mounted() {
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']),
/**
* 图层构造器
* @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;
.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;
}
}
}
.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>

13
pages/wuzuzhi/list.vue Normal file
View File

@ -0,0 +1,13 @@
<script>
export default {
name: "list"
}
</script>
<template>
</template>
<style scoped lang="less">
</style>

1
postcss.config.js
View File

@ -5,6 +5,7 @@ module.exports = {
scale: 0.5,
ignore: [
'manager',
'home',
'video',
'youzuzhi',
'wuzuzhi',