From 375b6acbd3a8f9cf51f967b09ecd09eccd1a12f3 Mon Sep 17 00:00:00 2001
From: zhaojiale <631455805@qq.com>
Date: 星期四, 18 八月 2022 17:53:29 +0800
Subject: [PATCH] 统计 事故统计
---
src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/component/openAdd.vue | 432 +++++++++++++++++++++++++++++++----------------------
1 files changed, 255 insertions(+), 177 deletions(-)
diff --git a/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/component/openAdd.vue b/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/component/openAdd.vue
index 93be57f..fd30fbe 100644
--- a/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/component/openAdd.vue
+++ b/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/component/openAdd.vue
@@ -1,197 +1,275 @@
<template>
- <div class="system-edit-user-container">
- <el-dialog
- title="新建应急物资保养"
- v-model="isShowDialog"
- width="769px"
- draggable
- :fullscreen="full"
- >
- <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
- <el-form
- ref="ruleFormRef"
- :model="ruleForm"
- size="default"
- label-width="120px"
- >
- <el-row :gutter="35">
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="应急物资" prop="teamName">
- <el-input
- v-model="ruleForm.teamLeader"
- placeholder="请选择"
- class="input-with-select"
- >
- <template #append>
- <el-button :icon="Search" @click="daiInpt"/>
- </template>
- </el-input>
- </el-form-item>
- </el-col>
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="保养结果" prop="teamLeader">
- <el-select v-model="ruleForm.teamLevel" class="w100" placeholder="请选择">
- <el-option label="正常" value="admin"></el-option>
- <el-option label="异常" value="common"></el-option>
- </el-select>
- </el-form-item>
- </el-col>
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="创建人" prop="telephone">
- <el-input
- v-model="ruleForm.teamLeader"
- placeholder="请选择"
- class="input-with-select"
- >
- <template #append>
- <el-button :icon="Search" @click="openUser" />
- </template>
- </el-input>
- </el-form-item>
- </el-col>
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="创建时间" prop="telephone">
- <el-date-picker
- class="w100"
- v-model="value1"
- type="datetime"
- placeholder="选择日期时间"
- />
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
- <template #footer>
+ <div class="system-edit-user-container">
+ <el-dialog :title="titles" v-model="isShowDialog" width="50%" @close="resetForm(ruleFormRef)" draggable :fullscreen="full">
+ <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
+ <el-form ref="ruleFormRef" :rules="rules" :model="ruleForm" size="default" label-width="120px" :disabled="disabled">
+ <el-row :gutter="35">
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+ <el-form-item label="应急物资" prop="suppliesName">
+ <el-input v-model="ruleForm.suppliesName" placeholder="请选择" class="input-with-select">
+ <template #append>
+ <el-button :icon="Search" @click="daiInpt" />
+ </template>
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+ <el-form-item label="保养结果" prop="maintainResult">
+ <el-select v-model="ruleForm.maintainResult" class="w100" placeholder="请选择">
+ <el-option label="正常" value="1"></el-option>
+ <el-option label="异常" value="2"></el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+ <el-form-item label="创建人" prop="userName">
+ <el-input v-model="ruleForm.userName" placeholder="请选择" class="input-with-select">
+ <template #append>
+ <el-button :icon="Search" @click="openUser(0)" />
+ </template>
+ </el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+ <el-form-item label="创建时间" prop="maintainTime">
+ <el-date-picker
+ class="w100"
+ v-model="ruleForm.maintainTime"
+ type="datetime"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ placeholder="选择日期时间"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <template #footer>
<span class="dialog-footer">
- <el-button @click="onCancel" size="default">关闭</el-button>
- <el-button size="default" type="primary" @click="submitForm(ruleFormRef)">确定</el-button>
+ <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button>
+ <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(ruleFormRef)">确定</el-button>
</span>
- </template>
- </el-dialog>
- <Material ref="showRef"/>
- <userSelections ref="userRef"/>
- </div>
+ </template>
+ </el-dialog>
+ <EmergencySupplies ref="showRef" @SearchUser="onUser" />
+ <DailogSearchUser ref="userRef" @SearchUser="onUsers" />
+ </div>
</template>
<script lang="ts">
-import {
- reactive,
- ref,
- defineComponent
-} from 'vue';
+import { ref, defineComponent, reactive } from 'vue';
-import type {
- FormInstance,
- // FormRules,
-} from 'element-plus'
-
-import {
- Search,
- FullScreen
-} from '@element-plus/icons-vue'
-import Material from '/@/components/material/index.vue'
-import UserSelections from "/@/components/userSelections/index.vue"
+import type { FormInstance, FormRules } from 'element-plus';
+import { ElMessage } from 'element-plus';
+import { Search, FullScreen } from '@element-plus/icons-vue';
+import EmergencySupplies from '../../../../../components/emergencySupplies/index.vue';
+import DailogSearchUser from '/@/components/DailogSearchUser/index.vue';
+import { maintenanceEmergencyMaterialsApi } from '../../../../../api/contingencyManagement/maintenanceEmergencyMaterials';
export default defineComponent({
- name: 'openAdd',
- components: {
- UserSelections,
- Material,
- },
- setup() {
- const isShowDialog = ref(false)
+ name: 'openAdd',
+ components: {
+ DailogSearchUser,
+ EmergencySupplies,
+ },
+ setup(props, { emit }) {
+ const isShowDialog = ref(false);
- const ruleFormRef = ref<FormInstance>()
- //定义表单
- const ruleForm = reactive({
- teamName: '', // 队伍名称
- teamLeader: '', //队伍负责人
- department: [], // 负责人部门
- phone: '', // 负责人手机
- telephone: '', // 固定电话
- });
- // 打开弹窗
- const openDialog = () => {
- // state.ruleForm = row;
- isShowDialog.value = true;
- };
- // 关闭弹窗
- const closeDialog = () => {
- isShowDialog.value = false;
- };
- // 取消
- const onCancel = () => {
- closeDialog();
- };
- //日期选择器
- const value1 = ref('')
- // 表单提交验证必填项
- const submitForm = async (formEl: FormInstance | undefined) => {
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- console.log('submit!')
- } else {
- console.log('error submit!', fields)
- }
- })
- }
- // 应急物资弹窗
- const showRef=ref()
- const daiInpt=()=>{
- showRef.value.openDailog()
- }
- // 编写人弹窗
- const userRef = ref();
- const openUser = () => {
- userRef.value.openDialog();
- };
- //全屏
- const full = ref(false);
- const toggleFullscreen = () => {
- if (full.value == false) {
- full.value = true;
- } else {
- full.value = false;
- }
- };
- return {
- openDialog,
- closeDialog,
- isShowDialog,
- onCancel,
- Search,
- ruleForm,
- value1,
- daiInpt,
- showRef,
- ruleFormRef,
- submitForm,
- openUser,
- userRef,
- toggleFullscreen,
- FullScreen,
- full,
- };
- },
+ const ruleFormRef = ref<FormInstance>();
+ //定义表单
+ const ruleForm = ref({
+ suppliesId: '', // 物资ID
+ maintainResult: '', //保养结果
+ maintainTime: '', // 创建时间
+ userList: [],
+ });
+ const titles = ref();
+ const disabled = ref();
+ // 打开弹窗
+ const openDialog = (title: string, id: number) => {
+ isShowDialog.value = true;
+ titles.value = `${title}应急物资保养`;
+ disabled.value = title == '查看' ? true : false;
+ if (title == '查看' || title == '修改') {
+ maintenanceEmergencyMaterialsApi()
+ .seeMaintenanceEmergencyMaterials(id)
+ .then((res) => {
+ if (res.data.code == 200) {
+ ruleForm.value = res.data.data;
+ let arr = [];
+ for (let i = 0; i < ruleForm.value.userList.length; i++) {
+ arr.push(ruleForm.value.userList[i].userName);
+ }
+ ruleForm.value.userName = arr.toString();
+ }
+ });
+ }
+ };
+ //日期选择器
+ const maintainTime = ref('');
+ // 表单提交验证必填项
+ const submitForm = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return;
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if (titles.value == '新建应急物资保养') {
+ isShowDialog.value = false;
+ delete ruleForm.value.suppliesName
+ delete ruleForm.value.userName
+ maintenanceEmergencyMaterialsApi()
+ .addMaintenanceEmergencyMaterials(ruleForm.value)
+ .then((res) => {
+ if (res.data.code == 200) {
+ ElMessage({
+ showClose: true,
+ message: res.data.msg,
+ type: 'success',
+ });
+ emit('myAdd', true);
+ } else {
+ ElMessage({
+ showClose: true,
+ message: res.data.msg,
+ type: 'error',
+ });
+ emit('myAdd', true);
+ }
+ });
+ } else if (titles.value == '修改应急物资保养') {
+ isShowDialog.value = false;
+ delete ruleForm.value.suppliesName
+ delete ruleForm.value.userName
+ maintenanceEmergencyMaterialsApi()
+ .editMaintenanceEmergencyMaterials(ruleForm.value)
+ .then((res) => {
+ if (res.data.code == 200) {
+ ElMessage({
+ showClose: true,
+ message: '修改成功',
+ type: 'success',
+ });
+ emit('myAdd', true);
+ } else {
+ ElMessage({
+ showClose: true,
+ message: res.data.msg,
+ type: 'error',
+ });
+ emit('myAdd', true);
+ }
+ formEl.resetFields();
+ });
+ }
+ } else {
+ console.log('error submit!', fields);
+ }
+ });
+ formEl.resetFields();
+ };
+ const resetForm = (formEl: FormInstance | undefined) => {
+ isShowDialog.value = false;
+ if (!formEl) return;
+ formEl.resetFields();
+ };
+ const rules = reactive<FormRules>({
+ nameTitle: [],
+ maintainResult: [
+ {
+ required: true,
+ message: '保养结果不能为空',
+ trigger: 'change',
+ },
+ ],
+ userName: [
+ {
+ required: true,
+ message: '创建人不能为空',
+ trigger: 'change',
+ },
+ ],
+ maintainTime: [
+ {
+ required: true,
+ message: '创建时间不能为空',
+ trigger: 'blur',
+ },
+ ],
+ });
+ // 应急物资弹窗
+ const showRef = ref();
+ const daiInpt = () => {
+ showRef.value.openDailog();
+ };
+ const onUser = (e: any) => {
+ ruleForm.value.suppliesId = e.id;
+ ruleForm.value.suppliesName = e.name;
+ };
+ // 编写人弹窗
+ const userRef = ref();
+ const openUser = (data: any) => {
+ userRef.value.openDailog(data);
+ };
+ const onUsers = (val: any) => {
+ let arr = [];
+ for (let i = 0; i < val.length; i++) {
+ arr.push(val[i].realName);
+ ruleForm.value.userList.push({
+ userUid: val[i].uid,
+ userName: val[i].realName,
+ });
+ }
+ ruleForm.value.userName = arr.toString();
+ };
+ //全屏
+ const full = ref(false);
+ const toggleFullscreen = () => {
+ if (full.value == false) {
+ full.value = true;
+ } else {
+ full.value = false;
+ }
+ };
+ return {
+ openDialog,
+ isShowDialog,
+ Search,
+ ruleForm,
+ maintainTime,
+ daiInpt,
+ onUser,
+ onUsers,
+ rules,
+ showRef,
+ ruleFormRef,
+ submitForm,
+ openUser,
+ userRef,
+ toggleFullscreen,
+ FullScreen,
+ full,
+ resetForm,
+ titles,
+ disabled,
+ emit,
+ };
+ },
});
</script>
<style scoped lang="scss">
-.textarea{
- height: 168px!important;
+.textarea {
+ height: 168px !important;
}
-.textarea ::v-deep .el-textarea__inner{
- height: 168px!important;
+.textarea ::v-deep .el-textarea__inner {
+ height: 168px !important;
}
::v-deep .el-table__cell {
- font-weight: 400;
+ font-weight: 400;
}
-.el-divider--horizontal{
- height: 0;
- margin: 0;
- border-top: transparent;
+.el-divider--horizontal {
+ height: 0;
+ margin: 0;
+ border-top: transparent;
}
-.el-select{
- width: 100%;
+.el-select {
+ width: 100%;
}
</style>
\ No newline at end of file
--
Gitblit v1.9.2