|
@@ -0,0 +1,248 @@
|
|
|
+<template>
|
|
|
+ <div class="layout-pd" >
|
|
|
+ <el-row>
|
|
|
+ <!--操作-->
|
|
|
+ <el-col :xs="24" >
|
|
|
+ <el-card class="mt8" shadow="hover" >
|
|
|
+ <el-form :model="sdkData.Filter" :inline="true" @submit.stop.prevent>
|
|
|
+ <el-form-item prop="name" style="width: 100%">
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="石油公司">
|
|
|
+ <el-input v-model="sdkData.Filter.OilCompanies" placeholder="请输入石油公司" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="防作弊启用状态">
|
|
|
+ <el-select v-model="sdkData.Filter.AntiCheatingState" placeholder="请选择防作弊启用状态" >
|
|
|
+ <el-option v-for="(value, key) in 1" :key="key" :label="1" :value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="油枪状态">
|
|
|
+ <el-select v-model="sdkData.Filter.OilGunState" placeholder="请选择油枪状态" >
|
|
|
+ <el-option v-for="(value, key) in 1" :key="key" :label="1" :value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="站点地址">
|
|
|
+ <el-input v-model="sdkData.Filter.SiteAddress" placeholder="请输入站点地址" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="加油机厂商">
|
|
|
+ <el-select v-model="sdkData.Filter.Manufacturer" placeholder="请选择加油机厂商" >
|
|
|
+ <el-option v-for="(value, key) in 1" :key="key" :label="1" :value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="12" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="出厂时间">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="sdkData.time"
|
|
|
+ type="datetimerange"
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ range-separator="To"
|
|
|
+ start-placeholder="Start date"
|
|
|
+ end-placeholder="End date"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="安装时间">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="sdkData.time"
|
|
|
+ type="datetimerange"
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ range-separator="To"
|
|
|
+ start-placeholder="Start date"
|
|
|
+ end-placeholder="End date"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="4" class="mb20">
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="ele-Search" @click="1"> 查询 </el-button>
|
|
|
+ <el-button type="primary" icon="ele-RefreshRight" @click="1"> 重置 </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <!--表格-->
|
|
|
+ <el-col :xs="24" >
|
|
|
+ <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
|
|
|
+ <el-table ref="multipleTableRef"
|
|
|
+ v-loading="sdkData.loading"
|
|
|
+ stripe :data="sdkData.tableModel"
|
|
|
+ row-key="id"
|
|
|
+ style="width: 100%" >
|
|
|
+ <el-table-column type="selection" width="50"></el-table-column>
|
|
|
+ <el-table-column v-for="column in sdkData.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label" />
|
|
|
+ </el-table>
|
|
|
+ <div class="my-flex my-flex-end" style="margin-top: 20px">
|
|
|
+ <el-pagination
|
|
|
+ v-model:currentPage="sdkData.pageInput.CurrentPage"
|
|
|
+ v-model:page-size="sdkData.pageInput.PageSize"
|
|
|
+ :total="sdkData.total"
|
|
|
+ :page-sizes="[10000, 20000, 50000, 100000]"
|
|
|
+ small
|
|
|
+ background
|
|
|
+ @size-change="1"
|
|
|
+ @current-change="1"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <EditDialog ref="editDialogRef" />
|
|
|
+ <AuditDialog ref="auditDialogRef" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <script setup lang="ts" name="authorize/fuelingsdk">
|
|
|
+ import {defineAsyncComponent, onMounted, reactive, ref, watch, onBeforeMount,getCurrentInstance} from "vue";
|
|
|
+ import { ElTable } from 'element-plus'
|
|
|
+ /**引入组件*/
|
|
|
+
|
|
|
+ /**sdk授权页面对象 */
|
|
|
+ const sdkData = reactive({
|
|
|
+ time:'',
|
|
|
+ /**加载显示 */
|
|
|
+ loading: false,
|
|
|
+ /**条件查询模块 */
|
|
|
+ Filter: {
|
|
|
+ /**石油公司 */
|
|
|
+ OilCompanies: "",
|
|
|
+ /**防作弊启用状态 */
|
|
|
+ AntiCheatingState: "",
|
|
|
+ /**油枪状态 */
|
|
|
+ OilGunState: "",
|
|
|
+ /**站点地址*/
|
|
|
+ SiteAddress: "",
|
|
|
+ /**加油机厂商*/
|
|
|
+ Manufacturer: "",
|
|
|
+ /**出厂开始的时间 */
|
|
|
+ OutBeginTime: null,
|
|
|
+ /**出厂结束的时间 */
|
|
|
+ OutEndTime: null,
|
|
|
+ /**安装开始的时间 */
|
|
|
+ CreateBeginTime: null,
|
|
|
+ /**安装结束的时间 */
|
|
|
+ CreateEndTime: null,
|
|
|
+ } ,
|
|
|
+ /**表格信息 */
|
|
|
+ tableModel: [] ,
|
|
|
+ /**动态表头 */
|
|
|
+ dynamicColumns: [
|
|
|
+ { prop: 'guid', label: '编号' },
|
|
|
+ { prop: 'oilCompanies', label: '石油公司' },
|
|
|
+ { prop: 'gasStation', label: '加油站名称' },
|
|
|
+ { prop: 'oilEnginesId', label: '油机号' },
|
|
|
+ { prop: 'oilGunId', label: '油枪号' },
|
|
|
+ { prop: 'oils', label: '油品' },
|
|
|
+ { prop: 'manufacturer', label: '加油机厂商' },
|
|
|
+ { prop: 'oilGunState', label: '油枪状态' },
|
|
|
+ { prop: 'onlineState', label: '在线状态' },
|
|
|
+ { prop: 'antiCheatingState', label: '防作弊启用状态' },
|
|
|
+ { prop: 'MonitorCpuId', label: '监控微处理器编号' },
|
|
|
+ { prop: 'encScreenId', label: '加密显示屏编号' },
|
|
|
+ { prop: 'encoderId', label: '编码器编号' },
|
|
|
+ { prop: 'gaugeId', label: '计量器编号' },
|
|
|
+ { prop: 'createTime', label: '安装时间' },
|
|
|
+ { prop: 'outTime', label: '出厂时间' },
|
|
|
+ ],
|
|
|
+ /**分页标识 */
|
|
|
+ pageInput:{
|
|
|
+ CurrentPage: 1,
|
|
|
+ PageSize: 10000,
|
|
|
+ } ,
|
|
|
+ /**分页总数 */
|
|
|
+ total: 0,
|
|
|
+ } )
|
|
|
+
|
|
|
+// /**初始化 */
|
|
|
+// const init = async () => {
|
|
|
+// sdkData.loading = true
|
|
|
+// const query = flattenObject({ Filter: sdkData.Filter})
|
|
|
+// const res:any = await new OilSdkAuthorAPI().getPageData({...sdkData.pageInput, ...query}).catch(() => {
|
|
|
+// sdkData.loading = false
|
|
|
+// })
|
|
|
+// sdkData.tableModel = res?.data?.list ?? []
|
|
|
+// sdkData.total = res?.data?.total ?? 0
|
|
|
+// sdkData.loading = false
|
|
|
+// }
|
|
|
+
|
|
|
+// onMounted(() => {
|
|
|
+// init()
|
|
|
+// eventBus.off('refreshView')
|
|
|
+// eventBus.on('refreshView', async () => {
|
|
|
+// init()
|
|
|
+// })
|
|
|
+// })
|
|
|
+
|
|
|
+// onBeforeMount(() => {
|
|
|
+// eventBus.off('refreshView')
|
|
|
+// })
|
|
|
+
|
|
|
+// /**
|
|
|
+// * 监听时间变换
|
|
|
+// */
|
|
|
+// watch(() => sdkData.time, (newVal ) => {
|
|
|
+// if(newVal.length === 0){
|
|
|
+// return
|
|
|
+// }
|
|
|
+// sdkData.Filter.BeginTime = newVal?.[0].toString()
|
|
|
+// sdkData.Filter.EndTime = newVal?.[1].toString()
|
|
|
+// })
|
|
|
+
|
|
|
+// /**条件查询 */
|
|
|
+// const onQuery = () => {
|
|
|
+// init()
|
|
|
+// }
|
|
|
+
|
|
|
+ /**重置查询条件 */
|
|
|
+// const resetQuery = () => {
|
|
|
+// sdkData.Filter.OilCompanies = ''
|
|
|
+// sdkData.Filter.AntiCheatingState = ''
|
|
|
+// sdkData.Filter.OilGunState = ''
|
|
|
+// sdkData.Filter.SiteAddress = ''
|
|
|
+// sdkData.Filter.Manufacturer = ''
|
|
|
+// sdkData.Filter.OutBeginTime = ''
|
|
|
+// sdkData.Filter.OutEndTime = ''
|
|
|
+// sdkData.Filter.CreateBeginTime = ''
|
|
|
+// sdkData.Filter.CreateEndTime = ''
|
|
|
+// sdkData.time = ''
|
|
|
+// sdkData.pageInput.CurrentPage = 1
|
|
|
+// }
|
|
|
+
|
|
|
+// /**重置 */
|
|
|
+// const onReset = () => {
|
|
|
+// resetQuery()
|
|
|
+// init()
|
|
|
+// }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </script>
|
|
|
+
|
|
|
+ <style scoped lang="scss">
|
|
|
+ .my-el-link {
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .el-form .el-col.mb20 {
|
|
|
+ margin: 0 !important;
|
|
|
+ }
|
|
|
+ .el-input, .el-select {
|
|
|
+ width: 240px;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+
|