|
|
@@ -3,28 +3,34 @@
|
|
|
<div class="layout-pd">
|
|
|
<!--操作-->
|
|
|
<el-card shadow="hover" >
|
|
|
- <el-form :model="sdkData.filterModel" size="default" label-width="100px" class="mt35 mb35">
|
|
|
+ <el-form :model="sdkData.Filter" size="default" label-width="100px" class="mt35 mb35">
|
|
|
<el-row :gutter="35">
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
|
<el-form-item label="油站名称">
|
|
|
- <el-input v-model="sdkData.filterModel.oilStation" placeholder="单行输入" clearable></el-input>
|
|
|
+ <el-input v-model="sdkData.Filter.OilStation" placeholder="单行输入" clearable></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
|
<el-form-item label="项目名称">
|
|
|
- <el-input v-model="sdkData.filterModel.project" placeholder="单行输入" clearable></el-input>
|
|
|
+ <el-input v-model="sdkData.Filter.Project" placeholder="单行输入" clearable></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
|
<el-form-item label="SN">
|
|
|
- <el-input v-model="sdkData.filterModel.sn" placeholder="单行输入" clearable></el-input>
|
|
|
+ <el-input v-model="sdkData.Filter.SN" placeholder="单行输入" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
|
+ <el-form-item label="授权码">
|
|
|
+ <el-input v-model="sdkData.Filter.Key" placeholder="单行输入" clearable></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
|
|
<el-form-item label="选择时间">
|
|
|
<el-date-picker
|
|
|
- v-model="sdkData.filterModel.beginTime"
|
|
|
+ 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"
|
|
|
@@ -34,9 +40,18 @@
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" >
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" >
|
|
|
+ <el-form-item>
|
|
|
<el-button type="primary" icon="ele-Delete" @click="onReset"> 重置 </el-button>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" >
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="ele-Delete" @click="onAdd"> 添加 </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" >
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" icon="ele-UploadFilled" @click="uploadFiles"> 批量导入 </el-button>
|
|
|
@@ -49,13 +64,7 @@
|
|
|
<!--表格-->
|
|
|
<el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
|
|
|
<el-table v-loading="sdkData.loading" :data="sdkData.tableModel" row-key="id" style="width: 100%">
|
|
|
- <el-table-column prop="date" label="日期" />
|
|
|
- <el-table-column prop="serviceStationName" label="油站名称" />
|
|
|
- <el-table-column prop="entryName" label="项目名称" />
|
|
|
- <el-table-column prop="SN" label="设备SN" />
|
|
|
- <el-table-column prop="effectiveTime" label="有效时间" />
|
|
|
- <el-table-column prop="authorization" label="授权码" />
|
|
|
- <el-table-column prop="remark" label="备注"/>
|
|
|
+ <el-table-column v-for="column in sdkData.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label" />
|
|
|
<el-table-column label="操作" fixed="right" header-align="center" align="center">
|
|
|
<template #default="{ row }">
|
|
|
<el-link
|
|
|
@@ -72,8 +81,8 @@
|
|
|
</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"
|
|
|
+ v-model:currentPage="sdkData.pageInput.CurrentPage"
|
|
|
+ v-model:page-size="sdkData.pageInput.PageSize"
|
|
|
:total="sdkData.total"
|
|
|
:page-sizes="[10, 20, 50, 100]"
|
|
|
small
|
|
|
@@ -89,7 +98,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts" name="authorize/fuelingsdk">
|
|
|
-import {defineAsyncComponent, onMounted, reactive, ref} from "vue";
|
|
|
+import {defineAsyncComponent, onMounted, reactive, ref, watch} from "vue";
|
|
|
import {OilSdkAuthorDto, oilSdkFilterModel, oilSdkTableModel} from "/@/api/admin/deviceAuthorization/oilSdkAuthorDto";
|
|
|
import {OilSdkAuthor} from "/@/api/admin/deviceAuthorization/oilSdkAuthor";
|
|
|
import type {pageInput} from "/@/api/admin/shareDto/shareDto";
|
|
|
@@ -100,65 +109,112 @@ const EditDialog = defineAsyncComponent(() => import('./component/editInfo.vue')
|
|
|
const editDialogRef = ref()
|
|
|
/**sdk授权页面对象 */
|
|
|
const sdkData = reactive({
|
|
|
+ time:'',
|
|
|
/**加载显示 */
|
|
|
loading: false,
|
|
|
/**条件查询模块 */
|
|
|
- filterModel: {
|
|
|
- /**guid*/
|
|
|
- guid: 0 ,
|
|
|
+ Filter: {
|
|
|
/**油站名称 */
|
|
|
- oilStation: "",
|
|
|
+ OilStation: "",
|
|
|
/**项目名称 */
|
|
|
- project: "",
|
|
|
+ Project: "",
|
|
|
/**设备SN */
|
|
|
- sn: "",
|
|
|
+ SN: "",
|
|
|
/**授权码*/
|
|
|
- key: "",
|
|
|
+ Key: "",
|
|
|
/**开始的时间 */
|
|
|
- beginTime: "",
|
|
|
+ BeginTime: null,
|
|
|
/**开始的时间 */
|
|
|
- endTime: "",
|
|
|
+ EndTime: null,
|
|
|
} as oilSdkFilterModel,
|
|
|
/**表格信息 */
|
|
|
tableModel: [] as oilSdkTableModel,
|
|
|
+ /**动态表头 */
|
|
|
+ dynamicColumns: [
|
|
|
+ { prop: 'guid', label: '编号' },
|
|
|
+ { prop: 'oilStation', label: '油站名称' },
|
|
|
+ { prop: 'projectName', label: '项目名称' },
|
|
|
+ { prop: 'sn', label: '设备SN号' },
|
|
|
+ { prop: 'key', label: '授权码' },
|
|
|
+ { prop: 'expiedTime', label: '有效时间' },
|
|
|
+ { prop: 'state', label: '状态' },
|
|
|
+ { prop: 'remark', label: '备注' },
|
|
|
+ ],
|
|
|
/**分页标识 */
|
|
|
pageInput:{
|
|
|
- currentPage: 1,
|
|
|
- pageSize: 20,
|
|
|
+ CurrentPage: 1,
|
|
|
+ PageSize: 20,
|
|
|
} as pageInput,
|
|
|
/**分页总数 */
|
|
|
total: 0,
|
|
|
} as OilSdkAuthorDto)
|
|
|
|
|
|
+/**
|
|
|
+ * 监听时间变换
|
|
|
+ */
|
|
|
+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 resetForm = () => {
|
|
|
- sdkData.filterModel.oilStation = ''
|
|
|
- sdkData.filterModel.project = ''
|
|
|
- sdkData.filterModel.sn = ''
|
|
|
- sdkData.filterModel.beginTime = ''
|
|
|
+/**重置查询条件 */
|
|
|
+const resetQuery = () => {
|
|
|
+ sdkData.Filter.OilStation = ''
|
|
|
+ sdkData.Filter.Project = ''
|
|
|
+ sdkData.Filter.SN = ''
|
|
|
+ sdkData.Filter.Key = ''
|
|
|
+ sdkData.Filter.BeginTime = ''
|
|
|
+ sdkData.Filter.EndTime = ''
|
|
|
+ sdkData.time = ''
|
|
|
}
|
|
|
+
|
|
|
/**重置 */
|
|
|
const onReset = () => {
|
|
|
- resetForm()
|
|
|
+ resetQuery()
|
|
|
init()
|
|
|
}
|
|
|
|
|
|
+/**添加*/
|
|
|
+const onAdd = () => {
|
|
|
+ editDialogRef.value.openDialog()
|
|
|
+}
|
|
|
+
|
|
|
/**初始化 */
|
|
|
const init = async () => {
|
|
|
sdkData.loading = true
|
|
|
- const res = await new OilSdkAuthor().getPageData({...sdkData.pageInput, filter: sdkData.filterModel})
|
|
|
- console.log(res)
|
|
|
- // sdkData.tableModel = res?.tableModel ?? []
|
|
|
- // sdkData.pageInput = res?.pageInput ?? {}
|
|
|
- // sdkData.total = res?.total ?? 0
|
|
|
+ const query = flattenObject({...sdkData.pageInput, Filter: sdkData.Filter})
|
|
|
+ const res = await new OilSdkAuthor().getPageData(query)
|
|
|
+ sdkData.tableModel = res?.data?.list ?? []
|
|
|
+ sdkData.total = res?.data?.total ?? 0
|
|
|
sdkData.loading = false
|
|
|
}
|
|
|
|
|
|
+/**将Filter对象成.的连接方式*/
|
|
|
+const flattenObject = (obj, parentKey = '') => {
|
|
|
+ const result = {};
|
|
|
+ for (const key in obj) {
|
|
|
+ if (obj.hasOwnProperty(key)) {
|
|
|
+ const newKey = parentKey ? `${parentKey}.${key}` : key;
|
|
|
+ if (typeof obj[key] === 'object' && !Array.isArray(obj[key])) {
|
|
|
+ const flattened = flattenObject(obj[key], newKey);
|
|
|
+ Object.assign(result, flattened);
|
|
|
+ } else {
|
|
|
+ result[newKey] = obj[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ return result;
|
|
|
+}
|
|
|
+
|
|
|
/**编辑弹窗 */
|
|
|
const editTableData = (row) => {
|
|
|
editDialogRef.value.openDialog(row)
|
