add 外置泵的页面
This commit is contained in:
parent
08568085b5
commit
4aec0f677c
14
src/api/admin/FeedingConfigApi.ts
Normal file
14
src/api/admin/FeedingConfigApi.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import { RequestParams } from './http-client'
|
||||
import { ContentType, HttpClient } from './http-client'
|
||||
|
||||
export class FeedingConfigApi extends HttpClient {
|
||||
/**
|
||||
* 获取泵速策略列表
|
||||
*/
|
||||
getList = (params: RequestParams = {}) =>
|
||||
this.request<any>({
|
||||
path: `/api/admin/usp-feeding-config/get-list`,
|
||||
method: 'GET',
|
||||
...params,
|
||||
})
|
||||
}
|
||||
63
src/api/admin/PumpApi.ts
Normal file
63
src/api/admin/PumpApi.ts
Normal file
@ -0,0 +1,63 @@
|
||||
import { PageInputPumpGetPageInput, PumpGetPageOutput, PumpAddInput, PumpUpdateInput } from './data-contracts'
|
||||
import { RequestParams } from './http-client'
|
||||
import { ContentType, HttpClient } from './http-client'
|
||||
|
||||
export class PumpApi extends HttpClient {
|
||||
/**
|
||||
* 获取分页列表
|
||||
*/
|
||||
getPage = (data: PageInputPumpGetPageInput, params: RequestParams = {}) =>
|
||||
this.request<any>({
|
||||
path: `/api/admin/equ-pump/get-page`,
|
||||
method: 'POST',
|
||||
body: data,
|
||||
type: ContentType.Json,
|
||||
...params,
|
||||
})
|
||||
|
||||
/**
|
||||
* 获取单条数据
|
||||
*/
|
||||
get = (params: { id: number }, requestParams: RequestParams = {}) =>
|
||||
this.request<any>({
|
||||
path: `/api/admin/equ-pump/get`,
|
||||
method: 'GET',
|
||||
query: params,
|
||||
...requestParams,
|
||||
})
|
||||
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
add = (data: PumpAddInput, params: RequestParams = {}) =>
|
||||
this.request<any>({
|
||||
path: `/api/admin/equ-pump/add`,
|
||||
method: 'POST',
|
||||
body: data,
|
||||
type: ContentType.Json,
|
||||
...params,
|
||||
})
|
||||
|
||||
/**
|
||||
* 更新
|
||||
*/
|
||||
update = (data: PumpUpdateInput, params: RequestParams = {}) =>
|
||||
this.request<any>({
|
||||
path: `/api/admin/equ-pump/update`,
|
||||
method: 'PUT',
|
||||
body: data,
|
||||
type: ContentType.Json,
|
||||
...params,
|
||||
})
|
||||
|
||||
/**
|
||||
* 软删除
|
||||
*/
|
||||
softDelete = (params: { id: number }, requestParams: RequestParams = {}) =>
|
||||
this.request<any>({
|
||||
path: `/api/admin/equ-pump/soft-delete`,
|
||||
method: 'DELETE',
|
||||
query: params,
|
||||
...requestParams,
|
||||
})
|
||||
}
|
||||
@ -6988,3 +6988,310 @@ export interface TestequUpdateInput {
|
||||
*/
|
||||
id: number
|
||||
}
|
||||
|
||||
/** 外置泵分页查询输入 */
|
||||
export interface PageInputPumpGetPageInput {
|
||||
dynamicFilter?: DynamicFilterInfo
|
||||
/** 排序列表 */
|
||||
sortList?: SortInput[] | null
|
||||
/**
|
||||
* 当前页标
|
||||
* @format int32
|
||||
*/
|
||||
currentPage?: number
|
||||
/**
|
||||
* 每页大小
|
||||
* @format int32
|
||||
*/
|
||||
pageSize?: number
|
||||
/** 分页请求 */
|
||||
filter?: PumpGetPageInput
|
||||
}
|
||||
|
||||
/** 外置泵分页查询过滤条件 */
|
||||
export interface PumpGetPageInput {
|
||||
/** 关键词 */
|
||||
keyWord?: string | null
|
||||
/** 设备型号 */
|
||||
model?: string | null
|
||||
/** 负责人ID */
|
||||
principalId?: number | null
|
||||
/** 开始日期 */
|
||||
stDate?: string | null
|
||||
/** 结束日期 */
|
||||
edDate?: string | null
|
||||
/** 是否空气泵 */
|
||||
isAirPump?: boolean
|
||||
}
|
||||
|
||||
/** 外置泵分页查询输出 */
|
||||
export interface PumpGetPageOutput {
|
||||
/**
|
||||
* 编号
|
||||
* @format int64
|
||||
*/
|
||||
id?: number
|
||||
/** 设备编号 */
|
||||
deviceNo?: string | null
|
||||
/** 资产编号 */
|
||||
assetNo?: string | null
|
||||
/** 设备型号 */
|
||||
model?: string | null
|
||||
/** 规格 */
|
||||
specification?: string | null
|
||||
/**
|
||||
* 泵速(g/min)
|
||||
* @format double
|
||||
*/
|
||||
pumpSpeed?: number
|
||||
/**
|
||||
* 负责人ID
|
||||
* @format int64
|
||||
*/
|
||||
principalId?: number
|
||||
/**
|
||||
* 超时(s)
|
||||
* @format int32
|
||||
*/
|
||||
pumpTimeout?: number
|
||||
/** 维护标记 */
|
||||
maintenanceFlag?: boolean
|
||||
/** IP地址 */
|
||||
ip?: string | null
|
||||
/** 端口号 */
|
||||
port?: string | null
|
||||
/**
|
||||
* 泵速系数
|
||||
* @format double
|
||||
*/
|
||||
speedCoefficient?: number
|
||||
/** 服务名称 */
|
||||
serviceName?: string | null
|
||||
/** 是否空气泵 */
|
||||
isAirPump?: boolean
|
||||
/**
|
||||
* 工作速度
|
||||
* @format double
|
||||
*/
|
||||
workingSpeed?: number
|
||||
/**
|
||||
* 工作时间
|
||||
* @format int32
|
||||
*/
|
||||
workingTime?: number
|
||||
/**
|
||||
* 配置ID
|
||||
* @format int64
|
||||
*/
|
||||
configId?: number
|
||||
/** 创建者 */
|
||||
createdUserName?: string | null
|
||||
/**
|
||||
* 创建时间
|
||||
* @format date-time
|
||||
*/
|
||||
createdTime?: string | null
|
||||
}
|
||||
|
||||
/** 外置泵详情输出 */
|
||||
export interface PumpGetOutput {
|
||||
/** 设备编号 */
|
||||
deviceNo?: string | null
|
||||
/** 资产编号 */
|
||||
assetNo?: string | null
|
||||
/** 设备型号 */
|
||||
model?: string | null
|
||||
/** 规格 */
|
||||
specification?: string | null
|
||||
/**
|
||||
* 泵速(g/min)
|
||||
* @format double
|
||||
*/
|
||||
pumpSpeed?: number
|
||||
/**
|
||||
* 负责人ID
|
||||
* @format int64
|
||||
*/
|
||||
principalId?: number
|
||||
/**
|
||||
* 超时(s)
|
||||
* @format int32
|
||||
*/
|
||||
pumpTimeout?: number
|
||||
/** 维护标记 */
|
||||
maintenanceFlag?: boolean
|
||||
/** IP地址 */
|
||||
ip?: string | null
|
||||
/** 端口号 */
|
||||
port?: string | null
|
||||
/**
|
||||
* 泵速系数
|
||||
* @format double
|
||||
*/
|
||||
speedCoefficient?: number
|
||||
/** 服务名称 */
|
||||
serviceName?: string | null
|
||||
/** 是否空气泵 */
|
||||
isAirPump?: boolean
|
||||
/**
|
||||
* 工作速度
|
||||
* @format double
|
||||
*/
|
||||
workingSpeed?: number
|
||||
/**
|
||||
* 工作时间
|
||||
* @format int32
|
||||
*/
|
||||
workingTime?: number
|
||||
/**
|
||||
* 配置ID
|
||||
* @format int64
|
||||
*/
|
||||
configId?: number
|
||||
/**
|
||||
* 主键Id
|
||||
* @format int64
|
||||
*/
|
||||
id: number
|
||||
}
|
||||
|
||||
/** 外置泵新增输入 */
|
||||
export interface PumpAddInput {
|
||||
/** 设备编号 */
|
||||
deviceNo?: string | null
|
||||
/** 资产编号 */
|
||||
assetNo?: string | null
|
||||
/** 设备型号 */
|
||||
model?: string | null
|
||||
/** 规格 */
|
||||
specification?: string | null
|
||||
/**
|
||||
* 泵速(g/min)
|
||||
* @format double
|
||||
*/
|
||||
pumpSpeed?: number
|
||||
/**
|
||||
* 负责人ID
|
||||
* @format int64
|
||||
*/
|
||||
principalId?: number
|
||||
/**
|
||||
* 超时(s)
|
||||
* @format int32
|
||||
*/
|
||||
pumpTimeout?: number
|
||||
/** 维护标记 */
|
||||
maintenanceFlag?: boolean
|
||||
/** IP地址 */
|
||||
ip?: string | null
|
||||
/** 端口号 */
|
||||
port?: string | null
|
||||
/**
|
||||
* 泵速系数
|
||||
* @format double
|
||||
*/
|
||||
speedCoefficient?: number
|
||||
/** 服务名称 */
|
||||
serviceName?: string | null
|
||||
/** 是否空气泵 */
|
||||
isAirPump?: boolean
|
||||
/**
|
||||
* 工作速度
|
||||
* @format double
|
||||
*/
|
||||
workingSpeed?: number
|
||||
/**
|
||||
* 工作时间
|
||||
* @format int32
|
||||
*/
|
||||
workingTime?: number
|
||||
/**
|
||||
* 配置ID
|
||||
* @format int64
|
||||
*/
|
||||
configId?: number
|
||||
}
|
||||
|
||||
/** 外置泵更新输入 */
|
||||
export interface PumpUpdateInput {
|
||||
/** 设备编号 */
|
||||
deviceNo?: string | null
|
||||
/** 资产编号 */
|
||||
assetNo?: string | null
|
||||
/** 设备型号 */
|
||||
model?: string | null
|
||||
/** 规格 */
|
||||
specification?: string | null
|
||||
/**
|
||||
* 泵速(g/min)
|
||||
* @format double
|
||||
*/
|
||||
pumpSpeed?: number
|
||||
/**
|
||||
* 负责人ID
|
||||
* @format int64
|
||||
*/
|
||||
principalId?: number
|
||||
/**
|
||||
* 超时(s)
|
||||
* @format int32
|
||||
*/
|
||||
pumpTimeout?: number
|
||||
/** 维护标记 */
|
||||
maintenanceFlag?: boolean
|
||||
/** IP地址 */
|
||||
ip?: string | null
|
||||
/** 端口号 */
|
||||
port?: string | null
|
||||
/**
|
||||
* 泵速系数
|
||||
* @format double
|
||||
*/
|
||||
speedCoefficient?: number
|
||||
/** 服务名称 */
|
||||
serviceName?: string | null
|
||||
/** 是否空气泵 */
|
||||
isAirPump?: boolean
|
||||
/**
|
||||
* 工作速度
|
||||
* @format double
|
||||
*/
|
||||
workingSpeed?: number
|
||||
/**
|
||||
* 工作时间
|
||||
* @format int32
|
||||
*/
|
||||
workingTime?: number
|
||||
/**
|
||||
* 配置ID
|
||||
* @format int64
|
||||
*/
|
||||
configId?: number
|
||||
/**
|
||||
* 主键Id
|
||||
* @format int64
|
||||
*/
|
||||
id: number
|
||||
}
|
||||
|
||||
/** 泵速策略输出 */
|
||||
export interface FeedingConfigGetListOutput {
|
||||
/**
|
||||
* 配置ID
|
||||
* @format int64
|
||||
*/
|
||||
id?: number
|
||||
/** 配置名称 */
|
||||
name?: string | null
|
||||
/** 配置编码 */
|
||||
code?: string | null
|
||||
/** 配置描述 */
|
||||
description?: string | null
|
||||
/**
|
||||
* 泵速值
|
||||
* @format double
|
||||
*/
|
||||
pumpSpeed?: number
|
||||
/** 启用状态 */
|
||||
enabled?: boolean
|
||||
}
|
||||
|
||||
506
src/views/admin/pump/components/pump-form.vue
Normal file
506
src/views/admin/pump/components/pump-form.vue
Normal file
@ -0,0 +1,506 @@
|
||||
<template>
|
||||
<div class="pump-form">
|
||||
<el-dialog
|
||||
v-model="state.isShowDialog"
|
||||
destroy-on-close
|
||||
:title="props.title"
|
||||
draggable
|
||||
:close-on-click-modal="false"
|
||||
:close-on-press-escape="false"
|
||||
width="900px"
|
||||
>
|
||||
<el-form ref="pumpFormRef" :model="state.ruleForm" :rules="state.ruleRules" label-width="120px">
|
||||
|
||||
<!-- 基本信息 -->
|
||||
<div class="form-section">
|
||||
<div class="section-title">基本信息</div>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="设备编号" prop="deviceNo" required>
|
||||
<el-input v-model="state.ruleForm.deviceNo" placeholder="请输入设备编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="资产编号" prop="assetNo" required>
|
||||
<el-input v-model="state.ruleForm.assetNo" placeholder="请输入资产编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="设备型号" prop="model" required>
|
||||
<el-select
|
||||
v-model="state.ruleForm.model"
|
||||
placeholder="请选择设备型号"
|
||||
style="width: 100%"
|
||||
filterable
|
||||
allow-create
|
||||
>
|
||||
<el-option
|
||||
v-for="model in state.modelOptions"
|
||||
:key="model.value"
|
||||
:label="model.name"
|
||||
:value="model.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="规格" prop="specification" required>
|
||||
<el-input v-model="state.ruleForm.specification" placeholder="请输入设备规格" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="设备负责人" prop="principalId" required>
|
||||
<el-select
|
||||
v-model="state.ruleForm.principalId"
|
||||
placeholder="请选择设备负责人"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
v-for="user in state.userOptions"
|
||||
:key="user.id"
|
||||
:label="`${user.name} (${user.userName})`"
|
||||
:value="user.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="泵速策略" prop="configId">
|
||||
<el-select
|
||||
v-model="state.ruleForm.configId"
|
||||
placeholder="请选择泵速策略"
|
||||
clearable
|
||||
style="width: 100%"
|
||||
:loading="state.configLoading"
|
||||
>
|
||||
<el-option
|
||||
v-for="config in state.configOptions"
|
||||
:key="config.id"
|
||||
:label="`${config.name} (${config.pumpSpeed}g/min)`"
|
||||
:value="config.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<!-- 技术参数 -->
|
||||
<div class="form-section">
|
||||
<div class="section-title">技术参数</div>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="泵速(g/min)" prop="pumpSpeed" required>
|
||||
<el-input-number
|
||||
v-model="state.ruleForm.pumpSpeed"
|
||||
:min="0"
|
||||
:precision="2"
|
||||
style="width: 100%"
|
||||
placeholder="请输入泵速"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="超时(s)" prop="pumpTimeout" required>
|
||||
<el-input-number
|
||||
v-model="state.ruleForm.pumpTimeout"
|
||||
:min="0"
|
||||
style="width: 100%"
|
||||
placeholder="请输入超时时间"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="泵速系数" prop="speedCoefficient" required>
|
||||
<el-input-number
|
||||
v-model="state.ruleForm.speedCoefficient"
|
||||
:min="0"
|
||||
:precision="3"
|
||||
style="width: 100%"
|
||||
placeholder="请输入泵速系数"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="维护状态" prop="maintenanceFlag">
|
||||
<el-select
|
||||
v-model="state.ruleForm.maintenanceFlag"
|
||||
placeholder="请选择维护状态"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
v-for="status in state.maintenanceStatusOptions"
|
||||
:key="status.value"
|
||||
:label="status.label"
|
||||
:value="status.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<!-- 网络配置 -->
|
||||
<div class="form-section">
|
||||
<div class="section-title">网络配置</div>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="IP地址" prop="ip" required>
|
||||
<el-input v-model="state.ruleForm.ip" placeholder="请输入IP地址" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="端口号" prop="port" required>
|
||||
<el-input v-model="state.ruleForm.port" placeholder="请输入端口号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="服务名称" prop="serviceName">
|
||||
<el-input v-model="state.ruleForm.serviceName" placeholder="请输入服务名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="onCancel">取消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :loading="state.loading">确定</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="PumpForm">
|
||||
import { reactive, ref, getCurrentInstance, onMounted } from 'vue'
|
||||
import { PumpApi } from '/@/api/admin/PumpApi'
|
||||
import { UserApi } from '/@/api/admin/User'
|
||||
import { FeedingConfigApi } from '/@/api/admin/FeedingConfigApi'
|
||||
import { DictApi } from '/@/api/admin/Dict'
|
||||
import { UserGetPageOutput, PageInputUserGetPageInput, PumpAddInput, PumpUpdateInput, FeedingConfigGetListOutput, DictGetListOutput } from '/@/api/admin/data-contracts'
|
||||
import eventBus from '/@/utils/mitt'
|
||||
|
||||
// 定义父组件传过来的值
|
||||
const props = defineProps({
|
||||
title: String,
|
||||
})
|
||||
|
||||
// 定义子组件向父组件传值/事件
|
||||
const emit = defineEmits(['refresh'])
|
||||
|
||||
// 定义变量内容
|
||||
const pumpFormRef = ref()
|
||||
const { proxy } = getCurrentInstance() as any
|
||||
|
||||
// 临时类型定义
|
||||
type PumpFormData = {
|
||||
id?: number
|
||||
deviceNo: string
|
||||
assetNo: string
|
||||
model: string
|
||||
specification: string
|
||||
pumpSpeed: number
|
||||
principalId: number | undefined
|
||||
pumpTimeout: number
|
||||
maintenanceFlag: number
|
||||
ip: string
|
||||
port: string
|
||||
speedCoefficient: number
|
||||
serviceName: string
|
||||
isAirPump: boolean
|
||||
configId: number | undefined
|
||||
}
|
||||
|
||||
const state = reactive({
|
||||
isShowDialog: false,
|
||||
loading: false,
|
||||
configLoading: false,
|
||||
ruleForm: {
|
||||
id: undefined,
|
||||
deviceNo: '',
|
||||
assetNo: '',
|
||||
model: '',
|
||||
specification: '',
|
||||
pumpSpeed: 0,
|
||||
principalId: undefined,
|
||||
pumpTimeout: 0,
|
||||
maintenanceFlag: 1,
|
||||
ip: '',
|
||||
port: '',
|
||||
speedCoefficient: 0,
|
||||
serviceName: '',
|
||||
isAirPump: false,
|
||||
configId: undefined,
|
||||
} as PumpFormData,
|
||||
userOptions: [] as Array<UserGetPageOutput>,
|
||||
configOptions: [] as Array<FeedingConfigGetListOutput>,
|
||||
modelOptions: [] as Array<DictGetListOutput>,
|
||||
maintenanceStatusOptions: [
|
||||
{ label: 'Offline', value: 0 },
|
||||
{ label: 'Idle', value: 1 },
|
||||
{ label: 'Busy', value: 2 },
|
||||
{ label: 'Error', value: 3 },
|
||||
],
|
||||
ruleRules: {
|
||||
deviceNo: [
|
||||
{ required: true, message: '设备编号不能为空', trigger: 'blur' },
|
||||
{ min: 1, max: 50, message: '设备编号长度应在1-50个字符', trigger: 'blur' }
|
||||
],
|
||||
assetNo: [
|
||||
{ required: true, message: '资产编号不能为空', trigger: 'blur' },
|
||||
{ min: 1, max: 50, message: '资产编号长度应在1-50个字符', trigger: 'blur' }
|
||||
],
|
||||
model: [{ required: true, message: '设备型号不能为空', trigger: 'change' }],
|
||||
specification: [
|
||||
{ required: true, message: '规格不能为空', trigger: 'blur' },
|
||||
{ min: 1, max: 100, message: '规格长度应在1-100个字符', trigger: 'blur' }
|
||||
],
|
||||
principalId: [{ required: true, message: '设备负责人不能为空', trigger: 'change' }],
|
||||
pumpSpeed: [{ required: true, message: '泵速不能为空', trigger: 'blur' }],
|
||||
pumpTimeout: [{ required: true, message: '超时时间不能为空', trigger: 'blur' }],
|
||||
speedCoefficient: [{ required: true, message: '泵速系数不能为空', trigger: 'blur' }],
|
||||
ip: [
|
||||
{ required: true, message: 'IP地址不能为空', trigger: 'blur' },
|
||||
{ pattern: /^((25[0-5]|2[0-4]\d|[01]?\d\d?)\.){3}(25[0-5]|2[0-4]\d|[01]?\d\d?)$/, message: '请输入正确的IP地址格式', trigger: 'blur' }
|
||||
],
|
||||
port: [
|
||||
{ required: true, message: '端口号不能为空', trigger: 'blur' },
|
||||
{ pattern: /^([0-9]|[1-9]\d{1,3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/, message: '请输入正确的端口号(1-65535)', trigger: 'blur' }
|
||||
],
|
||||
},
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
getUserOptions()
|
||||
getConfigOptions()
|
||||
getModelOptions()
|
||||
})
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = async (row?: any) => {
|
||||
resetForm()
|
||||
|
||||
// 确保用户数据已加载
|
||||
if (state.userOptions.length === 0) {
|
||||
await getUserOptions()
|
||||
}
|
||||
|
||||
// 确保配置数据已加载
|
||||
if (state.configOptions.length === 0) {
|
||||
await getConfigOptions()
|
||||
}
|
||||
|
||||
// 确保设备型号数据已加载
|
||||
if (state.modelOptions.length === 0) {
|
||||
await getModelOptions()
|
||||
}
|
||||
|
||||
if (row && row.id) {
|
||||
// 编辑模式，获取详情
|
||||
try {
|
||||
const res = await new PumpApi().get({ id: row.id })
|
||||
if (res?.success && res.data) {
|
||||
state.ruleForm = {
|
||||
id: res.data.id,
|
||||
deviceNo: res.data.deviceNo || '',
|
||||
assetNo: res.data.assetNo || '',
|
||||
model: res.data.model || '',
|
||||
specification: res.data.specification || '',
|
||||
pumpSpeed: res.data.pumpSpeed || 0,
|
||||
principalId: res.data.principalId,
|
||||
pumpTimeout: res.data.pumpTimeout || 0,
|
||||
maintenanceFlag: res.data.maintenanceFlag ?? 1,
|
||||
ip: res.data.ip || '',
|
||||
port: res.data.port || '',
|
||||
speedCoefficient: res.data.speedCoefficient || 0,
|
||||
serviceName: res.data.serviceName || '',
|
||||
isAirPump: false, // 固定为false
|
||||
configId: res.data.configId,
|
||||
}
|
||||
}
|
||||
} catch (error: any) {
|
||||
if (error.response?.status === 500) {
|
||||
proxy.$modal.msgError('服务器内部错误，请检查后台服务')
|
||||
} else {
|
||||
proxy.$modal.msgError(`获取详情失败: ${error.response?.data?.msg || error.message}`)
|
||||
}
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
state.isShowDialog = true
|
||||
}
|
||||
|
||||
// 关闭弹窗
|
||||
const closeDialog = () => {
|
||||
state.isShowDialog = false
|
||||
resetForm()
|
||||
}
|
||||
|
||||
// 重置表单
|
||||
const resetForm = () => {
|
||||
state.ruleForm = {
|
||||
id: undefined,
|
||||
deviceNo: '',
|
||||
assetNo: '',
|
||||
model: '',
|
||||
specification: '',
|
||||
pumpSpeed: 0,
|
||||
principalId: undefined,
|
||||
pumpTimeout: 0,
|
||||
maintenanceFlag: 1,
|
||||
ip: '',
|
||||
port: '',
|
||||
speedCoefficient: 0,
|
||||
serviceName: '',
|
||||
isAirPump: false,
|
||||
configId: undefined,
|
||||
}
|
||||
}
|
||||
|
||||
// 获取用户选项
|
||||
const getUserOptions = async () => {
|
||||
try {
|
||||
const userPageInput = {
|
||||
currentPage: 1,
|
||||
pageSize: 1000,
|
||||
filter: {
|
||||
orgId: null,
|
||||
}
|
||||
} as PageInputUserGetPageInput
|
||||
|
||||
const res = await new UserApi().getPage(userPageInput)
|
||||
if (res?.success) {
|
||||
state.userOptions = res.data?.list ?? []
|
||||
}
|
||||
} catch (error) {
|
||||
// 静默处理错误
|
||||
}
|
||||
}
|
||||
|
||||
// 获取泵速策略选项
|
||||
const getConfigOptions = async () => {
|
||||
state.configLoading = true
|
||||
try {
|
||||
const res = await new FeedingConfigApi().getList()
|
||||
if (res?.success && res.data) {
|
||||
state.configOptions = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
// 静默处理错误
|
||||
} finally {
|
||||
state.configLoading = false
|
||||
}
|
||||
}
|
||||
|
||||
// 获取设备型号选项
|
||||
const getModelOptions = async () => {
|
||||
try {
|
||||
const res = await new DictApi().getList(['PUMPTYPE'])
|
||||
if (res?.success && res.data) {
|
||||
// 注意：API返回的key是小写的 pumptype
|
||||
state.modelOptions = res.data['pumptype'] || []
|
||||
}
|
||||
} catch (error) {
|
||||
// 静默处理错误
|
||||
}
|
||||
}
|
||||
|
||||
// 取消
|
||||
const onCancel = () => {
|
||||
closeDialog()
|
||||
}
|
||||
|
||||
// 提交
|
||||
const onSubmit = () => {
|
||||
pumpFormRef.value.validate(async (valid: boolean) => {
|
||||
if (!valid) return false
|
||||
|
||||
state.loading = true
|
||||
try {
|
||||
let res = {} as any
|
||||
// 确保 isAirPump 为 false
|
||||
const formData = { ...state.ruleForm, isAirPump: false }
|
||||
|
||||
if (formData.id) {
|
||||
res = await new PumpApi().update(formData as any, { showSuccessMessage: true })
|
||||
} else {
|
||||
res = await new PumpApi().add(formData as any, { showSuccessMessage: true })
|
||||
}
|
||||
|
||||
if (res?.success) {
|
||||
closeDialog()
|
||||
emit('refresh')
|
||||
eventBus.emit('refreshPump' as keyof MittType<any>)
|
||||
}
|
||||
} catch (error: any) {
|
||||
proxy.$modal.msgError('操作失败')
|
||||
} finally {
|
||||
state.loading = false
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog,
|
||||
closeDialog,
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.form-section {
|
||||
margin-bottom: 24px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 16px;
|
||||
padding-bottom: 8px;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: -2px;
|
||||
width: 40px;
|
||||
height: 2px;
|
||||
background: #409eff;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-form-item) {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
:deep(.el-switch__label) {
|
||||
font-size: 13px;
|
||||
}
|
||||
</style>
|
||||
302
src/views/admin/pump/index.vue
Normal file
302
src/views/admin/pump/index.vue
Normal file
@ -0,0 +1,302 @@
|
||||
<template>
|
||||
<MyLayout>
|
||||
<el-card v-show="state.showQuery" class="my-query-box mt8" shadow="never" :body-style="{ paddingBottom: '0' }">
|
||||
<el-form :inline="true" label-width="auto" @submit.stop.prevent>
|
||||
<el-form-item label="关键词">
|
||||
<el-input v-model="state.queryForm.keyWord" placeholder="设备编号、资产编号" @keyup.enter="Query" />
|
||||
</el-form-item>
|
||||
<el-form-item label="开始时间">
|
||||
<el-date-picker
|
||||
v-model="state.queryForm.stDate"
|
||||
type="datetime"
|
||||
placeholder="选择开始时间"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
style="width: 180px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="结束时间">
|
||||
<el-date-picker
|
||||
v-model="state.queryForm.edDate"
|
||||
type="datetime"
|
||||
placeholder="选择结束时间"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
style="width: 180px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button v-if="auth('api:admin:equ-pump:get-page')" @click="Query" type="primary">
|
||||
<SvgIcon name="ele-Search" />查询
|
||||
</el-button>
|
||||
<el-button v-auth="'api:admin:equ-pump:add'" type="primary" icon="ele-Plus" @click="onAdd"> 新增 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<el-card class="my-fill mt8" shadow="never">
|
||||
<el-table
|
||||
v-loading="state.loading"
|
||||
:data="state.tableData"
|
||||
stripe
|
||||
border
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="deviceNo" label="设备编号" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="assetNo" label="资产编号" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="model" label="设备型号" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="specification" label="规格" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="pumpSpeed" label="泵速(g/min)" width="110" align="center" />
|
||||
<el-table-column prop="principalId" label="负责人" width="120" align="center">
|
||||
<template #default="{ row }">
|
||||
<span>{{ getPrincipalName(row.principalId) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maintenanceFlag" label="维护状态" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="getMaintenanceStatusType(row.maintenanceFlag)">
|
||||
{{ getMaintenanceStatusText(row.maintenanceFlag) }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createdTime" label="创建时间" width="160" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="200" fixed="right" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
size="small"
|
||||
type="primary"
|
||||
@click="onEdit(row)"
|
||||
v-auth="'api:admin:equ-pump:update'"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
type="danger"
|
||||
@click="onDelete(row)"
|
||||
v-auth="'api:admin:equ-pump:soft-delete'"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<div class="my-flex my-flex-end" style="margin-top: 10px">
|
||||
<el-pagination
|
||||
v-model:currentPage="state.queryForm.currentPage"
|
||||
v-model:page-size="state.queryForm.pageSize"
|
||||
:total="state.total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
size="small"
|
||||
background
|
||||
@size-change="onSizeChange"
|
||||
@current-change="onCurrentChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
/>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<pump-form ref="pumpFormRef" :title="state.title" @refresh="Query"></pump-form>
|
||||
</MyLayout>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="admin/pump">
|
||||
import { ref, reactive, onMounted, getCurrentInstance, onBeforeMount, defineAsyncComponent } from 'vue'
|
||||
import { ElMessageBox } from 'element-plus'
|
||||
import { PumpApi } from '/@/api/admin/PumpApi'
|
||||
import { UserApi } from '/@/api/admin/User'
|
||||
import { PumpGetPageOutput, PageInputPumpGetPageInput, UserGetPageOutput, PageInputUserGetPageInput } from '/@/api/admin/data-contracts'
|
||||
import eventBus from '/@/utils/mitt'
|
||||
import { auth } from '/@/utils/authFunction'
|
||||
|
||||
// 引入组件
|
||||
const PumpForm = defineAsyncComponent(() => import('./components/pump-form.vue'))
|
||||
|
||||
// 定义变量内容
|
||||
const pumpFormRef = ref()
|
||||
const { proxy } = getCurrentInstance() as any
|
||||
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
title: '',
|
||||
filter: {
|
||||
keyWord: '',
|
||||
stDate: '',
|
||||
edDate: '',
|
||||
},
|
||||
total: 0,
|
||||
pageInput: {
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
} as PageInputPumpGetPageInput,
|
||||
queryForm: {
|
||||
keyWord: '',
|
||||
stDate: '',
|
||||
edDate: '',
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
},
|
||||
tableData: [] as Array<PumpGetPageOutput>,
|
||||
userOptions: [] as Array<UserGetPageOutput>,
|
||||
showQuery: true,
|
||||
showPumpList: true,
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
getUserOptions()
|
||||
Query()
|
||||
eventBus.off('refreshPump' as keyof MittType<any>)
|
||||
eventBus.on('refreshPump' as keyof MittType<any>, () => {
|
||||
Query()
|
||||
})
|
||||
})
|
||||
onBeforeMount(() => {
|
||||
eventBus.off('refreshPump' as keyof MittType<any>)
|
||||
})
|
||||
|
||||
// 获取用户选项
|
||||
const getUserOptions = async () => {
|
||||
try {
|
||||
const userPageInput = {
|
||||
currentPage: 1,
|
||||
pageSize: 1000,
|
||||
filter: {
|
||||
orgId: null,
|
||||
}
|
||||
} as PageInputUserGetPageInput
|
||||
|
||||
const res = await new UserApi().getPage(userPageInput)
|
||||
if (res?.success) {
|
||||
state.userOptions = res.data?.list ?? []
|
||||
}
|
||||
} catch (error) {
|
||||
// 静默处理错误
|
||||
}
|
||||
}
|
||||
|
||||
// 获取负责人姓名
|
||||
const getPrincipalName = (principalId?: number) => {
|
||||
if (!principalId) return '-'
|
||||
const user = state.userOptions.find(u => u.id === principalId)
|
||||
return user ? `${user.name} (${user.userName})` : '-'
|
||||
}
|
||||
|
||||
// 获取维护状态文本
|
||||
const getMaintenanceStatusText = (status?: number) => {
|
||||
switch (status) {
|
||||
case 0:
|
||||
return 'Offline'
|
||||
case 1:
|
||||
return 'Idle'
|
||||
case 2:
|
||||
return 'Busy'
|
||||
case 3:
|
||||
return 'Error'
|
||||
default:
|
||||
return '未知'
|
||||
}
|
||||
}
|
||||
|
||||
// 获取维护状态标签类型
|
||||
const getMaintenanceStatusType = (status?: number) => {
|
||||
switch (status) {
|
||||
case 0:
|
||||
return 'info'
|
||||
case 1:
|
||||
return 'success'
|
||||
case 2:
|
||||
return 'warning'
|
||||
case 3:
|
||||
return 'danger'
|
||||
default:
|
||||
return ''
|
||||
}
|
||||
}
|
||||
|
||||
// 查询
|
||||
const Query = async () => {
|
||||
state.loading = true
|
||||
try {
|
||||
const queryParams = {
|
||||
currentPage: state.queryForm.currentPage,
|
||||
pageSize: state.queryForm.pageSize,
|
||||
filter: {
|
||||
keyWord: state.queryForm.keyWord || null,
|
||||
stDate: state.queryForm.stDate || null,
|
||||
edDate: state.queryForm.edDate || null,
|
||||
isAirPump: false, // 固定为false，只查询外置泵
|
||||
}
|
||||
} as PageInputPumpGetPageInput
|
||||
|
||||
const res = await new PumpApi().getPage(queryParams)
|
||||
if (res?.success) {
|
||||
state.tableData = res.data?.list ?? []
|
||||
state.total = res.data?.total ?? 0
|
||||
}
|
||||
} catch (error: any) {
|
||||
proxy.$modal.msgError(`查询失败: ${error.response?.data?.msg || error.message}`)
|
||||
} finally {
|
||||
state.loading = false
|
||||
}
|
||||
}
|
||||
|
||||
// 重置查询
|
||||
const onReset = () => {
|
||||
state.queryForm = {
|
||||
keyWord: '',
|
||||
stDate: '',
|
||||
edDate: '',
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
}
|
||||
Query()
|
||||
}
|
||||
|
||||
// 分页大小变化
|
||||
const onSizeChange = (size: number) => {
|
||||
state.queryForm.pageSize = size
|
||||
Query()
|
||||
}
|
||||
|
||||
// 当前页变化
|
||||
const onCurrentChange = (page: number) => {
|
||||
state.queryForm.currentPage = page
|
||||
Query()
|
||||
}
|
||||
|
||||
// 新增
|
||||
const onAdd = () => {
|
||||
state.title = '新增外置泵'
|
||||
pumpFormRef.value.openDialog()
|
||||
}
|
||||
|
||||
// 编辑
|
||||
const onEdit = (row: PumpGetPageOutput) => {
|
||||
state.title = '编辑外置泵'
|
||||
pumpFormRef.value.openDialog(row)
|
||||
}
|
||||
|
||||
// 删除
|
||||
const onDelete = (row: PumpGetPageOutput) => {
|
||||
ElMessageBox.confirm(`确定要删除外置泵【${row.deviceNo}】吗?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(async () => {
|
||||
try {
|
||||
const res = await new PumpApi().softDelete({ id: row.id! })
|
||||
if (res?.success) {
|
||||
proxy.$modal.msgSuccess('删除成功')
|
||||
Query()
|
||||
}
|
||||
} catch (error: any) {
|
||||
proxy.$modal.msgError(`删除失败: ${error.response?.data?.msg || error.message}`)
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,19 +1,24 @@
|
||||
<template>
|
||||
<div class="testequ-form">
|
||||
<el-dialog v-model="state.isShowDialog" :title="props.title" :width="900" :close-on-click-modal="false">
|
||||
<el-form ref="testequFormRef" :model="state.ruleForm" :rules="state.ruleRules" label-width="120px">
|
||||
<el-dialog
|
||||
v-model="state.isShowDialog"
|
||||
destroy-on-close
|
||||
:title="props.title"
|
||||
draggable
|
||||
:close-on-click-modal="false"
|
||||
:close-on-press-escape="false"
|
||||
width="900px"
|
||||
>
|
||||
<el-form :model="form" ref="formRef" size="default" label-width="120px">
|
||||
|
||||
<!-- 基本信息 -->
|
||||
<div class="form-section">
|
||||
<div class="section-title">
|
||||
<span class="title-text">基本信息</span>
|
||||
<div class="title-line"></div>
|
||||
</div>
|
||||
<div class="section-title">基本信息</div>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="设备类型" prop="equipmentType" required>
|
||||
<el-select v-model="state.ruleForm.equipmentType" placeholder="请选择设备类型" style="width: 100%">
|
||||
<el-form-item label="设备类型" prop="equipmentType" :rules="[{ required: true, message: '请选择设备类型', trigger: ['change'] }]">
|
||||
<el-select v-model="form.equipmentType" placeholder="请选择设备类型" style="width: 100%">
|
||||
<el-option
|
||||
v-for="type in state.equipmentTypeOptions"
|
||||
:key="type.value"
|
||||
@ -24,44 +29,44 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="设备编号" prop="equipmentNo" required>
|
||||
<el-input v-model="state.ruleForm.equipmentNo" placeholder="请输入设备编号" />
|
||||
<el-form-item label="设备编号" prop="equipmentNo" :rules="[{ required: true, message: '请输入设备编号', trigger: ['blur', 'change'] }]">
|
||||
<el-input v-model="form.equipmentNo" clearable placeholder="请输入设备编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="资产编号" prop="assetNo" required>
|
||||
<el-input v-model="state.ruleForm.assetNo" placeholder="请输入资产编号" />
|
||||
<el-form-item label="资产编号" prop="assetNo" :rules="[{ required: true, message: '请输入资产编号', trigger: ['blur', 'change'] }]">
|
||||
<el-input v-model="form.assetNo" clearable placeholder="请输入资产编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="设备型号" prop="equipmenModel" required>
|
||||
<el-select
|
||||
v-model="state.ruleForm.equipmenModel"
|
||||
placeholder="请选择设备型号"
|
||||
filterable
|
||||
clearable
|
||||
:loading="state.dictLoading"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
v-for="model in state.equipmentModelOptions"
|
||||
:key="model.id"
|
||||
:label="model.name"
|
||||
:value="model.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="负责人" prop="principalId" required>
|
||||
<el-form-item label="设备型号" prop="equipmenModel" :rules="[{ required: true, message: '请选择设备型号', trigger: ['change'] }]">
|
||||
<el-select
|
||||
v-model="state.ruleForm.principalId"
|
||||
v-model="form.equipmenModel"
|
||||
placeholder="请选择设备型号"
|
||||
filterable
|
||||
clearable
|
||||
:loading="state.dictLoading"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
v-for="model in state.equipmentModelOptions"
|
||||
:key="model.id"
|
||||
:label="model.name"
|
||||
:value="model.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="负责人" prop="principalId" :rules="[{ required: true, message: '请选择负责人', trigger: ['change'] }]">
|
||||
<el-select
|
||||
v-model="form.principalId"
|
||||
placeholder="请选择设备负责人"
|
||||
clearable
|
||||
filterable
|
||||
@ -79,7 +84,8 @@
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="描述" prop="description">
|
||||
<el-input
|
||||
v-model="state.ruleForm.description"
|
||||
v-model="form.description"
|
||||
clearable
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="请输入设备描述"
|
||||
@ -91,20 +97,17 @@
|
||||
|
||||
<!-- 配置信息 -->
|
||||
<div class="form-section">
|
||||
<div class="section-title">
|
||||
<span class="title-text">配置信息</span>
|
||||
<div class="title-line"></div>
|
||||
</div>
|
||||
<div class="section-title">配置信息</div>
|
||||
|
||||
<el-row :gutter="25">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="序列号" prop="serialNumber" required>
|
||||
<el-input v-model="state.ruleForm.serialNumber" placeholder="请输入序列号" />
|
||||
<el-form-item label="序列号" prop="serialNumber" :rules="[{ required: true, message: '请输入序列号', trigger: ['blur', 'change'] }]">
|
||||
<el-input v-model="form.serialNumber" clearable placeholder="请输入序列号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="私钥" prop="privateKey" required>
|
||||
<el-input v-model="state.ruleForm.privateKey" type="password" placeholder="请输入私钥" show-password />
|
||||
<el-form-item label="私钥" prop="privateKey" :rules="[{ required: true, message: '请输入私钥', trigger: ['blur', 'change'] }]">
|
||||
<el-input v-model="form.privateKey" type="password" placeholder="请输入私钥" show-password />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -113,8 +116,8 @@
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="onCancel">取消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :loading="state.loading">确定</el-button>
|
||||
<el-button @click="onCancel" size="default">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" size="default" :loading="state.loading">确 定</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
@ -122,7 +125,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="TestequForm">
|
||||
import { reactive, ref, getCurrentInstance, onMounted } from 'vue'
|
||||
import { reactive, ref, getCurrentInstance, onMounted, toRefs } from 'vue'
|
||||
import { TestequApi } from '/@/api/admin/TestequApi'
|
||||
import { UserApi } from '/@/api/admin/User'
|
||||
import { DictApi } from '/@/api/admin/Dict'
|
||||
@ -138,7 +141,7 @@ const props = defineProps({
|
||||
const emit = defineEmits(['refresh'])
|
||||
|
||||
// 定义变量内容
|
||||
const testequFormRef = ref()
|
||||
const formRef = ref()
|
||||
const { proxy } = getCurrentInstance() as any
|
||||
|
||||
// 临时类型定义
|
||||
@ -158,7 +161,7 @@ const state = reactive({
|
||||
isShowDialog: false,
|
||||
loading: false,
|
||||
dictLoading: false,
|
||||
ruleForm: {
|
||||
form: {
|
||||
id: undefined,
|
||||
equipmentType: undefined,
|
||||
equipmentNo: '',
|
||||
@ -177,29 +180,10 @@ const state = reactive({
|
||||
{ label: 'OSMO', value: 5 },
|
||||
{ label: 'Cedex', value: 7 }
|
||||
],
|
||||
ruleRules: {
|
||||
equipmentType: [{ required: true, message: '设备类型不能为空', trigger: 'change' }],
|
||||
equipmentNo: [
|
||||
{ required: true, message: '设备编号不能为空', trigger: 'blur' },
|
||||
{ min: 1, max: 50, message: '设备编号长度应在1-50个字符', trigger: 'blur' }
|
||||
],
|
||||
assetNo: [
|
||||
{ required: true, message: '资产编号不能为空', trigger: 'blur' },
|
||||
{ min: 1, max: 50, message: '资产编号长度应在1-50个字符', trigger: 'blur' }
|
||||
],
|
||||
equipmenModel: [{ required: true, message: '设备型号不能为空', trigger: 'change' }],
|
||||
principalId: [{ required: true, message: '负责人不能为空', trigger: 'change' }],
|
||||
serialNumber: [
|
||||
{ required: true, message: '序列号不能为空', trigger: 'blur' },
|
||||
{ min: 1, max: 100, message: '序列号长度应在1-100个字符', trigger: 'blur' }
|
||||
],
|
||||
privateKey: [
|
||||
{ required: true, message: '私钥不能为空', trigger: 'blur' },
|
||||
{ min: 1, max: 200, message: '私钥长度应在1-200个字符', trigger: 'blur' }
|
||||
],
|
||||
},
|
||||
})
|
||||
|
||||
const { form } = toRefs(state)
|
||||
|
||||
onMounted(() => {
|
||||
getUserOptions()
|
||||
getEquipmentModelOptions()
|
||||
@ -226,7 +210,7 @@ const openDialog = async (row?: any) => {
|
||||
try {
|
||||
const res = await new TestequApi().get({ id: row.id })
|
||||
if (res?.success && res.data) {
|
||||
state.ruleForm = {
|
||||
state.form = {
|
||||
id: res.data.id,
|
||||
equipmentType: res.data.equipmentType,
|
||||
equipmentNo: res.data.equipmentNo || '',
|
||||
@ -260,7 +244,7 @@ const closeDialog = () => {
|
||||
|
||||
// 重置表单
|
||||
const resetForm = () => {
|
||||
state.ruleForm = {
|
||||
state.form = {
|
||||
id: undefined,
|
||||
equipmentType: undefined,
|
||||
equipmentNo: '',
|
||||
@ -314,16 +298,16 @@ const onCancel = () => {
|
||||
|
||||
// 提交
|
||||
const onSubmit = () => {
|
||||
testequFormRef.value.validate(async (valid: boolean) => {
|
||||
formRef.value.validate(async (valid: boolean) => {
|
||||
if (!valid) return false
|
||||
|
||||
state.loading = true
|
||||
try {
|
||||
let res = {} as any
|
||||
if (state.ruleForm.id) {
|
||||
res = await new TestequApi().update(state.ruleForm as TestequUpdateInput, { showSuccessMessage: true })
|
||||
if (state.form.id) {
|
||||
res = await new TestequApi().update(state.form as TestequUpdateInput, { showSuccessMessage: true })
|
||||
} else {
|
||||
res = await new TestequApi().add(state.ruleForm as TestequAddInput, { showSuccessMessage: true })
|
||||
res = await new TestequApi().add(state.form as TestequAddInput, { showSuccessMessage: true })
|
||||
}
|
||||
|
||||
if (res?.success) {
|
||||
@ -348,47 +332,39 @@ defineExpose({
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.testequ-form {
|
||||
.form-section {
|
||||
margin-bottom: 30px;
|
||||
.form-section {
|
||||
margin-bottom: 24px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.title-text {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-right: 15px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.title-line {
|
||||
flex: 1;
|
||||
height: 1px;
|
||||
background: linear-gradient(to right, #409eff, transparent);
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-form-item) {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
:deep(.el-input),
|
||||
:deep(.el-select) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:deep(.el-textarea .el-textarea__inner) {
|
||||
resize: vertical;
|
||||
min-height: 80px;
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 16px;
|
||||
padding-bottom: 8px;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: -2px;
|
||||
width: 40px;
|
||||
height: 2px;
|
||||
background: #409eff;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-form-item) {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
:deep(.el-switch__label) {
|
||||
font-size: 13px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user