| | |
| | | <template> |
| | | <el-dialog v-model="visible" :title="dialogTitle" @closed="handleClosed" destroy-on-close> |
| | | <el-form ref="formRef" :model="formData" :rules="rules" :disabled="dialogReadonly" label-width="100px"> |
| | | <div v-if="dialogReadonly"> |
| | | <h3>设备详情</h3> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <div>设备信息: {{ formData.deviceName }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>设备类型: {{ formData.deviceType }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>设备属性: {{ formData.deviceAtt }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>型号: {{ formData.deviceModel }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>规格: {{ formData.deviceSpecification }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>生产厂商: {{ formData.manufacturer }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>来源: {{ formData.source }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>用途: {{ formData.purpose }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>所属部门: {{ formData.belongDept }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>负责人: {{ formData.charger }}</div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div>联系电话: {{ formData.contactPhone }}</div> |
| | | </el-col> |
| | | </el-row> |
| | | <h3>出库去向详情</h3> |
| | | <el-table v-loading="loading" :data="list"> |
| | | <el-table-column type="index" width="60" label="序号" /> |
| | | <el-table-column prop="charger" label="用户" /> |
| | | <el-table-column prop="contactPhone" label="电话" /> |
| | | <el-table-column prop="outTarget" label="出库去向" /> |
| | | <el-table-column prop="outTime" label="出库时间" /> |
| | | <el-table-column prop="purpose" label="用途" /> |
| | | </el-table> |
| | | <el-pagination |
| | | v-model:current-page="searchParams.current" |
| | | v-model:page-size="searchParams.size" |
| | | :total="total" |
| | | @change="getList" |
| | | /> |
| | | </div> |
| | | |
| | | <el-form v-else ref="formRef" :model="formData" :rules="rules" label-width="100px"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="设备名称" prop="deviceName"> |
| | |
| | | :data="deptTree" |
| | | :props="treeProps" |
| | | check-strictly |
| | | @change="getUserList" |
| | | @change="belongDeptChange" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | |
| | | <el-col :span="12"> |
| | | <el-form-item label="负责人" prop="charger"> |
| | | <el-select v-model="formData.charger" placeholder="请选择" :disabled="!formData.belongDept" clearable> |
| | | <el-option v-for="item in userList" :key="item.id" :label="item.name" :value="item.id" /> |
| | | <el-option v-for="item in userList" :key="item.id" :label="item.name" :value="item.name" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <script setup> |
| | | import { computed, ref } from 'vue' |
| | | import { ElMessage } from 'element-plus' |
| | | import { fwDeviceDetailApi, fwDeviceSubmitApi } from '@/views/basicManage/deviceStock/fwDevice' |
| | | import { fwDeviceDetailApi, fwDevicePageApi, fwDeviceSubmitApi } from '@/views/basicManage/deviceStock/fwDevice' |
| | | import { getUserListApi } from '@/api/system/user' |
| | | import { fieldRules } from '@ztzf/utils' |
| | | import { fieldRules, getDictLabel } from '@ztzf/utils' |
| | | import { fwDeviceTrackPageApi } from '@/views/basicManage/deviceStock/fwDeviceTrackApi' |
| | | |
| | | const initForm = () => ({ |
| | | belongDept: '', // 所属部门 |
| | |
| | | label: 'name', |
| | | children: 'children', |
| | | } |
| | | |
| | | const initSearchParams = () => ({ |
| | | current: 1, // 当前页 |
| | | size: 10, // 每页大小 |
| | | }) |
| | | const searchParams = ref(initSearchParams()) |
| | | |
| | | const dictObj = inject('dictObj') |
| | | const deptTree = inject('deptTree') |
| | |
| | | } |
| | | |
| | | const userList = ref([]) |
| | | function getUserList(val) { |
| | | |
| | | function belongDeptChange() { |
| | | formData.value.charger = '' |
| | | if (val) { |
| | | getUserListApi(val).then(res => { |
| | | userList.value = res.data.data.records |
| | | }) |
| | | } |
| | | } |
| | | |
| | | function getUserList() { |
| | | getUserListApi(formData.value.belongDept).then(res => { |
| | | userList.value = res.data.data.records |
| | | }) |
| | | } |
| | | |
| | | watch(() => formData.value.belongDept, getUserList) |
| | | |
| | | // 关闭弹框 |
| | | function handleCancel() { |
| | |
| | | function handleClosed() { |
| | | formData.value = initForm() |
| | | } |
| | | const total = ref(0) // 总条数 |
| | | const loading = ref(false) // 列表加载中 |
| | | const list = ref([]) // 列表数据 |
| | | async function getList() { |
| | | loading.value = true |
| | | try { |
| | | const params = { ...searchParams.value, deviceId: formData.value.id } |
| | | const res = await fwDeviceTrackPageApi(params) |
| | | list.value = res?.data?.data?.records ?? [] |
| | | total.value = res?.data?.data?.total ?? 0 |
| | | } finally { |
| | | loading.value = false |
| | | } |
| | | } |
| | | |
| | | // 打开弹框 |
| | | async function open({ mode, row } = {}) { |
| | | dialogMode.value = mode || 'add' |
| | | formData.value = row |
| | | visible.value = true |
| | | if (dialogMode.value === 'add') { |
| | | formData.value = initForm() |
| | | } else { |
| | | formData.value = row |
| | | await loadDetail() |
| | | getList() |
| | | } |
| | | } |
| | | |