admin-govern/src/views/govern/device/control/testItemRecords.vue

<template>
    <!-- 测试项日志 -->
    <div :style="{ height: height }">
        <vxe-table height="auto" auto-resize :data="dataList" v-bind="defaultAttribute" :key="key">
            <vxe-column v-for="item in column" :field="item.field" :title="item.title" :formatter="formatter"
                :min-width="item.width" :sortable="item.sortable"></vxe-column>
            <vxe-column title="操作" fixed="right" width="120" v-if="showButtom">
                <template v-slot:default="scoped">
                    <el-button link type="primary" @click="revise(scoped.row)">修改</el-button>
                    <el-button link type="danger" @click="remove(scoped.row)">删除</el-button>
                </template>
            </vxe-column>

        </vxe-table>
        <el-dialog draggable v-model="dialogVisible" title="修改" width="400" :before-close="handleClose">
            <el-form :model="form" ref="ruleFormRef" label-width="auto" class="form-one" :rules="rules">
                <el-form-item label="数据起始时间" prop="proStartTime">
                    <el-date-picker v-model="form.proStartTime" type="datetime" format="YYYY-MM-DD HH:mm:ss"
                        value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择数据起始时间" />
                </el-form-item>
                <el-form-item label="数据结束时间" prop="proEndTime">
                    <el-date-picker v-model="form.proEndTime" type="datetime" format="YYYY-MM-DD HH:mm:ss"
                        value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择数据结束时间" />
                </el-form-item>
            </el-form>
            <template #footer>

                <el-button @click="handleClose">取消</el-button>
                <el-button type="primary" @click="handleConfirm">
                    确定
                </el-button>
            </template>
        </el-dialog>
    </div>

</template>
<script setup lang='ts'>
import { mainHeight } from '@/utils/layout'
import { ref, reactive } from 'vue'
import { betweenDay } from '@/utils/formatTime'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { ElMessageBox, ElMessage } from 'element-plus'
import { activateUser, deluser, passwordConfirm } from '@/api/user-boot/user'
import { useDictData } from '@/stores/dictData'
import { updateRecordData } from '@/api/cs-device-boot/EquipmentDelivery'
import { useAdminInfo } from '@/stores/adminInfo'
const dictData = useDictData()
const voltageLevelList: any = dictData.getBasicData('Dev_Voltage_Stand')
import { deleteItem } from '@/api/cs-device-boot/csGroup'
const volConTypeList = dictData.getBasicData('Dev_Connect')
const emit = defineEmits(['onSubmit'])
const height = mainHeight(295).height
const dataList = ref([])
const key: any = ref(0)
const ruleFormRef = ref()
const adminInfo = useAdminInfo()
const showButtom = ref(adminInfo.roleCode.includes('operation_manager') || adminInfo.roleCode.includes('root'))
const dialogVisible = ref(false)
const column: any = ref([
    { field: 'startTime', title: '数据起始时间', width: '140px', sortable: true },
    { field: 'endTime', title: '数据结束时间', width: '140px', sortable: true },
    { field: 'lastTime', title: '持续时间', width: '140px', sortable: true },
    { field: 'itemName', title: '数据来源', width: '100px' },
    { field: 'statisticalInterval', title: '时间间隔(分钟)', width: '120px', },
    { field: 'voltageLevel', title: '电压等级', width: '100px', sortable: true },
    { field: 'volConType', title: '	电压接线方式', width: '120px', sortable: true },
    {
        field: 'pt', title: 'PT', width: '100px',
    },
    { field: 'ct', title: 'CT', width: '100px', },
    { field: 'capacitySi', title: '用户协议容量(MVA)', width: '140px', },
    { field: 'capacitySt', title: '供电设备容量(MVA)', width: '140px', },
    { field: 'capacitySscb', title: '基准短路容量(MVA)', width: '140px', },
    { field: 'capacitySscmin', title: '最小短路容量(MVA)', width: '140px', },

    // { field: 'location', title: '	测试位置', width: '100px', },



])
const form = reactive({
    proStartTime: '',
    proEndTime: '',
    id: ''
})
const rules = {
    proStartTime: [{ required: true, message: '请输入数据起始时间', trigger: 'blur' }],
    proEndTime: [{ required: true, message: '请输入数据结束时间', trigger: 'blur' }],
}
const setData = (data: any) => {
    dataList.value = JSON.parse(JSON.stringify(data))
    key.value += 1
}
const formatter = (row: any) => {
    if (row.column.field == 'voltageLevel') {
        return row.cellValue == null ? '/' : voltageLevelList.filter((item: any) => item.id == row.cellValue)[0]?.name
    } else if (row.column.field == 'volConType') {
        return row.cellValue == null ? '/' : volConTypeList.filter((item: any) => item.id == row.cellValue)[0]?.name
    } else {
        return row.cellValue == null ? '/' : row.cellValue

    }


}
// 取消
const handleClose = () => {
    dialogVisible.value = false
}
// 确定
const handleConfirm = () => {
    ruleFormRef.value.validate((valid: any) => {
        if (valid) {
            let data = betweenDay(new Date(form.proStartTime), new Date(form.proEndTime))
            if (data < 0) {
                ElMessage.warning('数据结束时间不能小于数据起始时间')
            } else {
                updateRecordData(form).then((res) => {
                    ElMessage.success(res.message)
                    dialogVisible.value = false
                    emit('onSubmit')
                })
            }
        }
    })

    // dialogVisible.value = false
}
// 删除
const remove = (row: any) => {
    ElMessageBox.prompt('二次校验密码确认', '', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        customClass: 'customInput',
        inputType: 'text',
        beforeClose: (action, instance, done) => {
            if (action === 'confirm') {
                if (instance.inputValue == null) {
                    return ElMessage.warning('请输入密码')
                } else if (instance.inputValue?.length > 32) {
                    return ElMessage.warning('密码长度不能超过32位,当前密码长度为' + instance.inputValue.length)
                } else {
                    done();
                }
            } else {
                done();
            }
        }
    }).then(({ value }) => {

        passwordConfirm(value).then(res => {
            console.log('密码正确');

            deleteItem({ id: row.id }).then(() => {
                ElMessage.success('删除成功')
                emit('onSubmit')
            })
        })
    })




}
// 修改
const revise = (row: any) => {

    ElMessageBox.prompt('二次校验密码确认', '', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        customClass: 'customInput',
        inputType: 'text',
        beforeClose: (action, instance, done) => {
            if (action === 'confirm') {
                if (instance.inputValue == null) {
                    return ElMessage.warning('请输入密码')
                } else if (instance.inputValue?.length > 32) {
                    return ElMessage.warning('密码长度不能超过32位,当前密码长度为' + instance.inputValue.length)
                } else {
                    done();
                }
            } else {
                done();
            }
        }
    }).then(({ value }) => {

        passwordConfirm(value).then(res => {

            dialogVisible.value = true
            form.proStartTime = row.startTime
            form.proEndTime = row.endTime
            form.id = row.id

        })
    })




}

defineExpose({ setData })
</script>
<style lang="scss">
.customInput {
    .el-input__inner {
        -webkit-text-security: disc !important;
    }
}
</style>