fix: 多页面样式调整

This commit is contained in:
caoqianming 2024-02-27 18:21:54 +08:00
parent 7eff5872f6
commit b5c5507564
6 changed files with 76 additions and 43 deletions

View File

@ -23,17 +23,17 @@
</el-select> </el-select>
<el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search" <el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search"
placeholder="设备名称/设备编号"></el-input> placeholder="设备名称/设备编号"></el-input>
<el-button @click="handleQuery">查询</el-button> <el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
</div> </div>
</el-header> </el-header>
<el-main> <el-main>
<scTable :apiObj="apiObj" size="large" :params="params" :query="query"> <scTable :apiObj="apiObj" size="large" :params="params" :query="query">
<el-table-column prop="index" label="序号"></el-table-column> <el-table-column type="index" width="50" />
<el-table-column prop="number" label="设备编号"></el-table-column> <el-table-column prop="number" label="设备编号"></el-table-column>
<el-table-column prop="level" label="设备名称"></el-table-column> <el-table-column prop="level" label="设备名称"></el-table-column>
<el-table-column prop="mgroup" label="设备类型"></el-table-column> <el-table-column prop="type" label="设备类型"></el-table-column>
<el-table-column prop="eqpment" label="所属工序"></el-table-column> <el-table-column prop="mgroup_name" label="所属工序"></el-table-column>
<el-table-column prop="mgroup" label="当前状态"></el-table-column> <el-table-column prop="running_state" label="运行状态"></el-table-column>
<el-table-column label="PM2.5" align="center"> <el-table-column label="PM2.5" align="center">
<el-table-column prop="mgroup" label="实测值"></el-table-column> <el-table-column prop="mgroup" label="实测值"></el-table-column>
<el-table-column prop="mgroup" label="预警值"></el-table-column> <el-table-column prop="mgroup" label="预警值"></el-table-column>

View File

@ -36,13 +36,13 @@
</el-select> </el-select>
<el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search" <el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search"
placeholder="设备名称/设备编号"></el-input> placeholder="设备名称/设备编号"></el-input>
<el-button @click="handleQuery">查询</el-button> <el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
</div> </div>
</el-header> </el-header>
<el-main> <el-main>
<scTable ref="table" :data="tableData" :apiObj="apiObj" :params="params" :query="query" size="large" <scTable ref="table" :data="tableData" :apiObj="apiObj" :params="params" :query="query" size="large"
style="" @row-click="rowClick"> style="" @row-click="rowClick">
<el-table-column prop="index" label="序号"></el-table-column> <el-table-column type="index" width="50" />
<el-table-column prop="number" label="设备编号"></el-table-column> <el-table-column prop="number" label="设备编号"></el-table-column>
<el-table-column prop="name" label="设备名称"></el-table-column> <el-table-column prop="name" label="设备名称"></el-table-column>
<el-table-column prop="type" label="设备类型"> <el-table-column prop="type" label="设备类型">
@ -50,9 +50,9 @@
{{ type_[scope.row.type] }} {{ type_[scope.row.type] }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="mgroup" label="所属工序"></el-table-column> <el-table-column prop="mgroup_name" label="所属工序"></el-table-column>
<el-table-column prop="state" label="当前状态"></el-table-column> <el-table-column prop="state" label="设备状态"></el-table-column>
<el-table-column prop="description" label="备信息"></el-table-column> <el-table-column prop="description" label="信息"></el-table-column>
</scTable> </scTable>
</el-main> </el-main>
</el-container> </el-container>

View File

@ -5,19 +5,16 @@
厂内清洁 厂内清洁
</div> </div>
<div class="right-panel"> <div class="right-panel">
<div class="backMap" @click="backtoMap"> <el-button type="primary" @click="backtoMap"> 返回地图 </el-button>
切换地图
<el-icon>
<Switch />
</el-icon>
</div>
</div> </div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding">
<el-container> <el-container>
<el-header class="searchWrap"> <el-header class="searchWrap">
<div class="left-panel"> <div class="left-panel">
车辆总数<span class="totalNumber">0</span> <div style="font-size: 1.8vh;">
车辆总数<span class="totalNumber">{{ count }}</span>
</div>
</div> </div>
<div class="right-panel"> <div class="right-panel">
<el-select v-model="query.cate" placeholder="车辆分类" @change="handleQuery" clearable> <el-select v-model="query.cate" placeholder="车辆分类" @change="handleQuery" clearable>
@ -26,7 +23,7 @@
</el-select> </el-select>
<el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search" <el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search"
placeholder=""></el-input> placeholder=""></el-input>
<el-button @click="handleQuery">查询</el-button> <el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
</div> </div>
</el-header> </el-header>
<el-main> <el-main>
@ -52,6 +49,7 @@
export default { export default {
data() { data() {
return { return {
count: 0,
query: {}, query: {},
params: { type: 30, tags: 'carwash' }, params: { type: 30, tags: 'carwash' },
cateOptions: [ cateOptions: [
@ -67,7 +65,10 @@ export default {
methods: { methods: {
handleQuery() { handleQuery() {
this.$refs.table.queryData(this.query); this.$refs.table.queryData(this.query);
} },
backtoMap() {
this.$emit('close')
},
} }
} }
</script> </script>

View File

@ -22,19 +22,20 @@
</div> </div>
</div> </div>
<div class="right-panel"> <div class="right-panel">
<el-select v-model="query.area" placeholder="" style="width:7vw"> <el-select v-model="query.level" placeholder="排口等级" style="width:10vw" clearable
@change="handleQuery">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option> </el-option>
</el-select> </el-select>
<el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search" <!-- <el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search"
placeholder=""></el-input> placeholder=""></el-input>
<el-button @click="handleQuery">查询</el-button> <el-button @click="handleQuery">查询</el-button> -->
</div> </div>
</el-header> </el-header>
<el-main> <el-main>
<scTable :data="tableData" :apiObj="apiObj" :params="params" size="large" style="" @row-click="rowClick" <scTable ref="table" :apiObj="apiObj" :params="params" size="large" style="" @row-click="rowClick"
@dataChange="updateCount"> :query="query" @dataChange="updateCount">
<el-table-column prop="index" label="序号"></el-table-column> <el-table-column type="index" width="50" />
<el-table-column prop="number" label="排放口编号"></el-table-column> <el-table-column prop="number" label="排放口编号"></el-table-column>
<el-table-column prop="name" label="排放口名称"></el-table-column> <el-table-column prop="name" label="排放口名称"></el-table-column>
<el-table-column prop="level" label="排放口等级"> <el-table-column prop="level" label="排放口等级">
@ -239,9 +240,11 @@ export default {
count: 0, count: 0,
apiObj: this.$API.enp.drain.list, apiObj: this.$API.enp.drain.list,
params: { type: 10 }, params: { type: 10 },
options: [], options: [
{ value: '10', label: '主要排放口' },
{ value: '20', label: '次要排放口' }
],
query: { query: {
area: '',
search: '' search: ''
}, },
searchInputStyle: { searchInputStyle: {
@ -309,6 +312,9 @@ export default {
} }
}, },
methods: { methods: {
handleQuery() {
this.$refs.table.queryData(this.query);
},
updateCount(res, tableData) { updateCount(res, tableData) {
this.count = res.count this.count = res.count
}, },

View File

@ -9,6 +9,11 @@
<el-container> <el-container>
<el-header class="searchWrap"> <el-header class="searchWrap">
<div class="left-panel"> <div class="left-panel">
<div style="font-size: 1.8vh;">
全厂污染源<span class="totalNumber">{{ count }}</span>
</div>
</div>
<div class="right-panel">
<el-select v-model="query.cate" placeholder="污染源分类" @change="handleQuery" clearable> <el-select v-model="query.cate" placeholder="污染源分类" @change="handleQuery" clearable>
<el-option v-for="item in cateOptions" :key="item.id" :label="item.name" <el-option v-for="item in cateOptions" :key="item.id" :label="item.name"
:value="item.id"></el-option> :value="item.id"></el-option>
@ -17,7 +22,8 @@
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding">
<scTable ref="table" :data="tableData" style="width: 100%;" size="large" :apiObj="apiObj" <scTable ref="table" :data="tableData" style="width: 100%;" size="large" :apiObj="apiObj"
row-key="id" :params="params" :query="query" hidePagination @row-click="rowClick"> row-key="id" :params="params" :query="query" @row-click="rowClick"
@dataChange="updateCount">
<el-table-column type="index" width="50" /> <el-table-column type="index" width="50" />
<el-table-column prop="number" label="污染源编号" width="180" /> <el-table-column prop="number" label="污染源编号" width="180" />
<el-table-column prop="name" label="污染源名称" /> <el-table-column prop="name" label="污染源名称" />
@ -215,6 +221,7 @@ import * as echarts from "echarts";
export default { export default {
data() { data() {
return { return {
count: 0,
eqs: {}, eqs: {},
eqc: {}, eqc: {},
eqz: {}, eqz: {},
@ -277,6 +284,9 @@ export default {
} }
}, },
methods: { methods: {
updateCount(res, tableData) {
this.count = res.count
},
initTimeNow() { initTimeNow() {
var now = new Date(); var now = new Date();
let year = now.getFullYear(); // let year = now.getFullYear(); //

View File

@ -5,38 +5,40 @@
进出厂记录 进出厂记录
</div> </div>
<div class="right-panel"> <div class="right-panel">
<div class="backMap" @click="backtoMap"> <!-- <div class="backMap" @click="backtoMap">
切换地图 切换地图
<el-icon> <el-icon>
<Switch /> <Switch />
</el-icon> </el-icon>
</div> </div> -->
<el-button type="primary" @click="backtoMap"> 返回地图 </el-button>
</div> </div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding">
<el-container> <el-container>
<el-header class="searchWrap"> <el-header class="searchWrap">
<div class="left-panel"> <div class="left-panel">
车辆总数<span class="totalNumber">0</span> <div style="font-size: 1.8vh;">
车辆进出次数<span class="totalNumber">{{ count }}</span>
</div>
</div> </div>
<div class="right-panel"> <div class="right-panel">
<el-date-picker v-model="query.time" type="date" placeholder="开始时间" format="YYYY-MM-DD" <el-date-picker v-model="timeRange" type="datetimerange" range-separator=""
value-format="YYYY-MM-DD" :picker-options="pickerOptions" /> start-placeholder="开始时间" end-placeholder="结束时间" @change="handleQuery" style="width: 100%"
<el-date-picker v-model="query.time" type="date" placeholder="结束时间" format="YYYY-MM-DD" clearable />
value-format="YYYY-MM-DD" :picker-options="pickerOptions" /> <el-select v-model="query.type" placeholder="出入类型" clearable @change="handleQuery">
<el-select v-model="query.type" placeholder="出入类型" style="width:7vw">
<el-option v-for="item in typeOptions" :key="item.id" :label="item.name" :value="item.id"> <el-option v-for="item in typeOptions" :key="item.id" :label="item.name" :value="item.id">
</el-option> </el-option>
</el-select> </el-select>
<el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search" <el-input :input-style="searchInputStyle" style="width:12vw;margin:0 5px" v-model="query.search"
placeholder=""></el-input> placeholder="车牌号"></el-input>
<el-button @click="handleQuery">查询</el-button> <el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
</div> </div>
</el-header> </el-header>
<el-main> <el-main>
<scTable ref="table" :data="tableData" :apiObj="apiObj" :params="params" :query="query" size="large" <scTable ref="table" :apiObj="apiObj" :params="params" :query="query" size="large" style=""
style="" @row-click="rowClick"> @row-click="rowClick" @dataChange="updateCount">
<el-table-column type="index" width="50" /> <el-table-column type="index" width="50" />
<el-table-column prop="vehicle_number" label="车牌号码"></el-table-column> <el-table-column prop="vehicle_number" label="车牌号码"></el-table-column>
<el-table-column prop="access_time" label="过门禁时间"></el-table-column> <el-table-column prop="access_time" label="过门禁时间"></el-table-column>
@ -59,12 +61,13 @@ export default {
data() { data() {
return { return {
query: {}, query: {},
count: 0,
timeRange: [],
cateOptions: [ cateOptions: [
{ id: 1, name: '货车' }, { id: 1, name: '货车' },
{ id: 2, name: '罐车' }, { id: 2, name: '罐车' },
], ],
typeOptions: [ typeOptions: [
{ id: '', name: '全部' },
{ id: 1, name: '进厂' }, { id: 1, name: '进厂' },
{ id: 2, name: '出厂' } { id: 2, name: '出厂' }
], ],
@ -79,15 +82,28 @@ export default {
}, },
timeOptions: ['日', '月', '年'], timeOptions: ['日', '月', '年'],
apiObj: this.$API.enp.vehicle_access, apiObj: this.$API.enp.vehicle_access,
params: { type: 2 }, params: {},
} }
}, },
methods: { methods: {
updateCount(res, tableData) {
this.count = res.count
},
handleQuery() { handleQuery() {
if (this.timeRange) {
this.query.access_time__gte = this.timeRange[0]
this.query.access_time__lte = this.timeRange[1]
} else {
this.query.access_time__gte = null
this.query.access_time__lte = null
}
this.$refs.table.queryData(this.query); this.$refs.table.queryData(this.query);
}, },
timeHandleQuery() { }, timeHandleQuery() { },
carHandleQuery() { }, carHandleQuery() { },
backtoMap() {
this.$emit('close')
},
} }
} }
</script> </script>