|
|
@@ -1,161 +1,123 @@
|
|
|
<template>
|
|
|
<div class="modal">
|
|
|
- <el-dialog
|
|
|
- v-model="dialogVisible"
|
|
|
- :title="dialogTitle"
|
|
|
- :width="modalConfig.dialogWidth || '40%'"
|
|
|
- center
|
|
|
- @close="handleExcel(ruleFormRef)"
|
|
|
- :close-on-click-modal="false"
|
|
|
- >
|
|
|
+ <el-dialog v-model="props.isVisible" width="70%" left :close-on-click-modal="false" @close="onCancel">
|
|
|
+ <template #header>
|
|
|
+ <pageTitle :title="props.title"></pageTitle>
|
|
|
+ </template>
|
|
|
<div class="form">
|
|
|
<el-form
|
|
|
ref="ruleFormRef"
|
|
|
- :rules="modalConfig.formRules"
|
|
|
+ label-suffix=":"
|
|
|
+ :rules="formRules"
|
|
|
:model="formData"
|
|
|
- :label-width="modalConfig.labelWidth || '100px'"
|
|
|
+ label-width="140px"
|
|
|
size="large"
|
|
|
>
|
|
|
- <template v-for="item in modalConfig.formItems" :key="item.prop">
|
|
|
- <el-form-item :label="item.label" :prop="item.prop">
|
|
|
- <template v-if="item.type === 'release_unit'">
|
|
|
- <el-input
|
|
|
- :disabled="item.disabled"
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="item.type === 'input'">
|
|
|
- <el-input
|
|
|
- :disabled="item.disabled"
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-if="item.type === 'textarea'">
|
|
|
- <el-input
|
|
|
- type="textarea"
|
|
|
- :disabled="item.disabled"
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-if="item.type === 'select'">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="发布单位" prop="release_unit">
|
|
|
+ <el-input :disabled="true" v-model="formData.release_unit" placeholder="请输入发布单位" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="创建日期" prop="createDate">
|
|
|
+ <el-input :disabled="true" v-model="formData.createDate" placeholder="请输入创建日期" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="创建人员" prop="creater">
|
|
|
+ <el-input :disabled="true" v-model="formData.creater" placeholder="请输入创建人员" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label="发布状态" prop="send_status">
|
|
|
<el-select
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
+ v-model="formData.send_status"
|
|
|
+ placeholder="请选择发布状态"
|
|
|
style="width: 100%"
|
|
|
- :disabled="item.disabled"
|
|
|
- >
|
|
|
- <template v-for="(val, index) in item.options" :key="index">
|
|
|
- <el-option :value="val.value" :label="val.label" />
|
|
|
- </template>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- <template v-if="item.type === 'date-picker'">
|
|
|
- <el-date-picker
|
|
|
- :type="item.dateType || 'daterange'"
|
|
|
- range-separator="-"
|
|
|
- start-placeholder="开始时间"
|
|
|
- end-placeholder="结束时间"
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :disabled="item.disabled"
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-if="item.type === 'date'">
|
|
|
- <el-date-picker
|
|
|
- type="date"
|
|
|
- style="width: 100%"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :disabled="item.disabled"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <!-- 通报类型 -->
|
|
|
- <template v-if="item.type === 'report_type'">
|
|
|
- <el-radio-group v-model="formData.report_type">
|
|
|
- <el-radio v-for="item in reportTypeOptions" :value="item.value" :label="item.value">{{
|
|
|
- item.label
|
|
|
- }}</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </template>
|
|
|
-
|
|
|
- <!-- 通报事项类型 -->
|
|
|
- <template v-if="item.type === 'report_event_type'">
|
|
|
- <el-radio-group v-model="formData.report_event_type">
|
|
|
- <el-radio v-for="item in reportEventTypeOptions" :value="item.value" :label="item.value">{{
|
|
|
- item.label
|
|
|
- }}</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </template>
|
|
|
-
|
|
|
- <!-- 发出单位 -->
|
|
|
- <template v-if="item.type === 'send_unit'">
|
|
|
- <el-select
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- filterable
|
|
|
- style="width: 100%"
|
|
|
- :disabled="item.disabled"
|
|
|
- >
|
|
|
- <template v-for="(val, index) in sendUnitOptions" :key="index">
|
|
|
- <el-option :value="val.value" :label="val.label" />
|
|
|
- </template>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- <!-- 发布状态 -->
|
|
|
- <template v-if="item.type === 'send_status'">
|
|
|
- <el-select
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- style="width: 100%"
|
|
|
- :disabled="item.disabled"
|
|
|
+ :disabled="true"
|
|
|
>
|
|
|
<template v-for="(val, index) in sendStatusOptions" :key="index">
|
|
|
<el-option :value="val.value" :label="val.label" />
|
|
|
</template>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- <!-- 接收单位层级 -->
|
|
|
- <template v-if="item.type === 'receive_unit_level'">
|
|
|
- <el-select
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- style="width: 100%"
|
|
|
- :disabled="item.disabled"
|
|
|
- >
|
|
|
- <template v-for="(val, index) in receiveUnitLevelOptions" :key="index">
|
|
|
+ </el-select> </el-form-item
|
|
|
+ ></el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="通报类型" prop="report_type">
|
|
|
+ <el-select v-model="formData.report_type" placeholder="请选择通报类型" style="width: 100%">
|
|
|
+ <template v-for="(val, index) in reportTypeOptions" :key="index">
|
|
|
<el-option :value="val.value" :label="val.label" />
|
|
|
</template>
|
|
|
</el-select>
|
|
|
- </template>
|
|
|
-
|
|
|
- <!-- 接收单位层级 -->
|
|
|
- <template v-if="item.type === 'do_suggest'">
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="通报事件类别" prop="report_event_type">
|
|
|
<el-select
|
|
|
- v-model="formData[item.prop]"
|
|
|
- :placeholder="item.placeholder"
|
|
|
- filterable
|
|
|
+ v-model="formData.report_event_type"
|
|
|
+ placeholder="请选择通报事件类别"
|
|
|
style="width: 100%"
|
|
|
- :disabled="item.disabled"
|
|
|
>
|
|
|
- <template v-for="(val, index) in doSuggestOptions" :key="index">
|
|
|
+ <template v-for="(val, index) in reportEventTypeOptions" :key="index">
|
|
|
<el-option :value="val.value" :label="val.label" />
|
|
|
</template>
|
|
|
</el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="事项编号" prop="event_code">
|
|
|
+ <el-input v-model="formData.event_code" placeholder="请输入事项编号" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-form-item label="通报事项" prop="report_event">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.report_event"
|
|
|
+ maxlength="200"
|
|
|
+ show-word-limit
|
|
|
+ type="textarea"
|
|
|
+ placeholder="请输入通报事项,内容200字以内"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="通报标准或具体行为列举" prop="report_standard">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.report_standard"
|
|
|
+ maxlength="1000"
|
|
|
+ show-word-limit
|
|
|
+ type="textarea"
|
|
|
+ autosize
|
|
|
+ placeholder="请输入通报标准或具体行为列举,内容200字以内"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="通报依据" prop="report_base">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.report_base"
|
|
|
+ maxlength="200"
|
|
|
+ show-word-limit
|
|
|
+ autosize
|
|
|
+ type="textarea"
|
|
|
+ placeholder="请输入通报依据,内容200字以内"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="发出单位" prop="send_unit">
|
|
|
+ <el-select v-model="formData.send_unit" placeholder="请选择发出单位" style="width: 100%">
|
|
|
+ <template v-for="(val, index) in sendUnitOptions" :key="index">
|
|
|
+ <el-option :value="val.value" :label="val.label" />
|
|
|
</template>
|
|
|
- </el-form-item>
|
|
|
- </template>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="接收单位" prop="receive_unit">
|
|
|
+ <el-input v-model="formData.receive_unit" placeholder="请输入择接收单位" />
|
|
|
+ </el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
<template #footer>
|
|
|
<span class="dialog-footer">
|
|
|
<el-button type="primary" @click="handleConfirmClick(ruleFormRef)">保存</el-button>
|
|
|
<el-button type="primary" @click="handleConfirmClick(ruleFormRef)">提交</el-button>
|
|
|
- <el-button @click="handleExcel(ruleFormRef)">返回</el-button>
|
|
|
- <slot name="button"></slot>
|
|
|
+ <el-button @click="onCancel()">返回</el-button>
|
|
|
</span>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
@@ -165,62 +127,62 @@
|
|
|
<script setup lang="ts" name="modal">
|
|
|
import { reactive, ref } from 'vue';
|
|
|
import type { FormInstance } from 'element-plus';
|
|
|
+import pageTitle from '@/components/components/pageTitle.vue';
|
|
|
import useSystemStore from '@/store/main';
|
|
|
-import { listDept } from '@/api/system/dept';
|
|
|
-import { ComponentInternalInstance } from 'vue';
|
|
|
-import { outTypeList } from '@/libs/commonMeth';
|
|
|
-const elecEnerty = outTypeList('dh_ec_electricity');
|
|
|
-const gasEnerty = outTypeList('dh_ec_gas');
|
|
|
-const waterEnerty = outTypeList('dh_ec_water');
|
|
|
-// 定义props
|
|
|
-interface IProps {
|
|
|
- modalConfig: {
|
|
|
- pageName: string;
|
|
|
- addTitle: string;
|
|
|
- editTitle: string;
|
|
|
- detailTitle: string;
|
|
|
- dialogWidth: string;
|
|
|
- labelWidth: string;
|
|
|
- formItems: any[];
|
|
|
- formRules: object;
|
|
|
- pageListParams?: object; //新增一个对象，用来传给特殊的列表接口刷新页面（非必传）
|
|
|
- };
|
|
|
- otherInfo?: any;
|
|
|
-}
|
|
|
-
|
|
|
-const props = defineProps<IProps>();
|
|
|
|
|
|
-const dialogVisible = ref(false);
|
|
|
-const isEdit = ref(false);
|
|
|
+const props = defineProps({
|
|
|
+ isVisible: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ type: String,
|
|
|
+ default: '',
|
|
|
+ },
|
|
|
+});
|
|
|
+type Emit = {
|
|
|
+ (e: 'update:isVisible', isVisible: boolean): void;
|
|
|
+};
|
|
|
+const emit = defineEmits<Emit>();
|
|
|
|
|
|
+const formData = reactive<any>({
|
|
|
+ release_unit: '交通运输部海事局',
|
|
|
+ createDate: '2025-07-28',
|
|
|
+ type: 'mobile',
|
|
|
+ creater: '张三',
|
|
|
+ send_status: 'inner',
|
|
|
+ report_type: '',
|
|
|
+ report_event_type: '',
|
|
|
+ event_code: '',
|
|
|
+ report_event: '',
|
|
|
+ report_standard: '',
|
|
|
+ report_base: '',
|
|
|
+ send_unit: '',
|
|
|
+ receive_unit: '',
|
|
|
+});
|
|
|
const ruleFormRef = ref<FormInstance>();
|
|
|
|
|
|
const systemStore = useSystemStore();
|
|
|
|
|
|
-const { pageDetailInfo, pageOperateType } = storeToRefs(systemStore);
|
|
|
-import { matchStringAndFormat } from '@/utils/commonMeth';
|
|
|
-
|
|
|
-// 组合两个字典数组
|
|
|
-let fieldNameList = ref([] as any);
|
|
|
-
|
|
|
-// 父组件的值
|
|
|
-const formulaValue = ref('初始值') as any;
|
|
|
-provide('calculationFormulaName', formulaValue);
|
|
|
+const onCancel = () => {
|
|
|
+ resetForm();
|
|
|
+ emit('update:isVisible', false);
|
|
|
+};
|
|
|
|
|
|
-onMounted(async () => {
|
|
|
- await getListDept();
|
|
|
-});
|
|
|
+const resetForm = () => {
|
|
|
+ if (!ruleFormRef.value) return;
|
|
|
+ ruleFormRef.value.resetFields();
|
|
|
+};
|
|
|
|
|
|
-// 部门树形数据
|
|
|
-const deptOptions = ref<any[]>([]);
|
|
|
-const departTree = ref([]);
|
|
|
-const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
-const getListDept = async () => {
|
|
|
- // 获取关联部门列表
|
|
|
- await listDept().then(response => {
|
|
|
- departTree.value = response.data;
|
|
|
- deptOptions.value = proxy!.handleTree(response.data, 'deptId');
|
|
|
- });
|
|
|
+const formRules = {
|
|
|
+ report_type: [{ required: true, message: '请选择通报类型', trigger: 'select' }],
|
|
|
+ report_event_type: [{ required: true, message: '请选择通报类型', trigger: 'select' }],
|
|
|
+ report_event: [{ required: true, message: '请输入通报事项', trigger: 'change' }],
|
|
|
+ report_base: [{ required: true, message: '请输入通报依据', trigger: 'change' }],
|
|
|
+ base_content: [{ required: true, message: '请输入依据内容', trigger: 'change' }],
|
|
|
+ send_unit: [{ required: true, message: '请选择发出单位', trigger: 'select' }],
|
|
|
+ receive_unit: [{ required: true, message: '请选择接收单位', trigger: 'change' }],
|
|
|
+ report_standard: [{ required: true, message: '通报标准或具体行为列举', trigger: 'select' }],
|
|
|
};
|
|
|
|
|
|
// 通报类型
|
|
|
@@ -248,15 +210,15 @@ const reportEventTypeOptions = [
|
|
|
// 发布状态
|
|
|
const sendStatusOptions = [
|
|
|
{
|
|
|
- label: '待提交',
|
|
|
+ label: '待发布',
|
|
|
value: 'inner',
|
|
|
},
|
|
|
{
|
|
|
- label: '可用',
|
|
|
+ label: '已发布',
|
|
|
value: 'outer',
|
|
|
},
|
|
|
{
|
|
|
- label: '已废止',
|
|
|
+ label: '已结案',
|
|
|
value: 'outer',
|
|
|
},
|
|
|
];
|
|
|
@@ -290,147 +252,17 @@ const receiveUnitLevelOptions = [
|
|
|
value: '3',
|
|
|
},
|
|
|
];
|
|
|
-// 接收单位层级
|
|
|
-const doSuggestOptions = [
|
|
|
- {
|
|
|
- label: '全部',
|
|
|
- value: 'all',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '纳入诚信管理档案',
|
|
|
- value: '1',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '按照规定处理并反馈',
|
|
|
- value: '2',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '依法开展失信惩戒、纳入诚信管理档案',
|
|
|
- value: '3',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '协助办理，并反馈结果',
|
|
|
- value: '4',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '依法处置，并反馈结果',
|
|
|
- value: '5',
|
|
|
- },
|
|
|
-];
|
|
|
-
|
|
|
-// 水电燃气单价
|
|
|
-const customEnergy = ref('1');
|
|
|
-const initEnergyList = ref([] as any);
|
|
|
-const initEnergy = ref('1');
|
|
|
-
|
|
|
-// ----------------------------------------------------------------
|
|
|
-// 定义数据绑定
|
|
|
-const initialForm: any = {};
|
|
|
-for (const item of props.modalConfig.formItems) {
|
|
|
- initialForm[item.prop] = item.initialValue ?? '';
|
|
|
-}
|
|
|
-
|
|
|
-let formData = ref(JSON.parse(JSON.stringify(initialForm)));
|
|
|
-
|
|
|
-const dialogTitle = ref();
|
|
|
-// 新建或者编辑
|
|
|
-async function setDialogVisible(isNew: boolean = true, check: boolean = false) {
|
|
|
- dialogVisible.value = true;
|
|
|
- ruleFormRef.value?.resetFields();
|
|
|
- await nextTick();
|
|
|
- if (!isNew) {
|
|
|
- watch(pageDetailInfo, newVal => {
|
|
|
- formData.value = pageDetailInfo.value;
|
|
|
- console.log(formData.value);
|
|
|
- // 赋值
|
|
|
- formulaValue.value = formData.value.calculationFormulaName;
|
|
|
- });
|
|
|
|
|
|
- customEnergy.value = '1';
|
|
|
- initEnergy.value = '1';
|
|
|
-
|
|
|
- // 判断如果不是新增的话就获取store中的详情
|
|
|
- if (check) {
|
|
|
- dialogTitle.value = props.modalConfig.detailTitle;
|
|
|
- systemStore.getDetailType('detail');
|
|
|
- } else {
|
|
|
- dialogTitle.value = props.modalConfig.editTitle;
|
|
|
- systemStore.getDetailType('edit');
|
|
|
- }
|
|
|
- } else {
|
|
|
- props.modalConfig.formItems.map((m: any) => {
|
|
|
- if (m.numberType === '2') {
|
|
|
- if (m.porp === initialForm[m.porp]) {
|
|
|
- initialForm[m.prop] = (0.0).toFixed(2);
|
|
|
- }
|
|
|
- } else if (m.numberType === '1') {
|
|
|
- if (m.porp === initialForm[m.porp]) {
|
|
|
- initialForm[m.prop] = Math.trunc(0);
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- formData.value = JSON.parse(JSON.stringify(initialForm));
|
|
|
- await nextTick();
|
|
|
- setTimeout(() => {
|
|
|
- formData.value.energyList = initEnergyList.value;
|
|
|
- }, 500);
|
|
|
- dialogTitle.value = props.modalConfig.addTitle;
|
|
|
- systemStore.detailPageEval(initialForm);
|
|
|
- systemStore.getDetailType('add');
|
|
|
- }
|
|
|
- isEdit.value = !isNew;
|
|
|
-}
|
|
|
// 点击确定
|
|
|
function handleConfirmClick(formEl: FormInstance | undefined) {
|
|
|
if (!formEl) return;
|
|
|
formEl.validate((valid, fields) => {
|
|
|
if (valid) {
|
|
|
- // 费用计算公式数据处理
|
|
|
- // formData.value.calculationFormula = formData.value.calculationFormulaName
|
|
|
- formData.value.calculationFormula = matchStringAndFormat(
|
|
|
- formData.value.calculationFormulaName,
|
|
|
- fieldNameList.value
|
|
|
- );
|
|
|
- dialogVisible.value = false;
|
|
|
- let data = { ...formData.value };
|
|
|
- data.energyList.forEach((item, index) => {
|
|
|
- initEnergyList.value.forEach((row, d) => {
|
|
|
- if (index === d) {
|
|
|
- item.energyUnitPriceId = row.energyUnitPriceId;
|
|
|
- }
|
|
|
- });
|
|
|
- });
|
|
|
- if (props.otherInfo) {
|
|
|
- data = { ...data, ...props.otherInfo };
|
|
|
- }
|
|
|
- if (!isEdit.value) {
|
|
|
- systemStore.newPageDataAction(props.modalConfig.pageName, data, props.modalConfig.pageListParams);
|
|
|
- } else {
|
|
|
- if (pageOperateType.value === 'edit') {
|
|
|
- systemStore.editPageDataAction(props.modalConfig.pageName, data, props.modalConfig.pageListParams);
|
|
|
- }
|
|
|
- }
|
|
|
} else {
|
|
|
console.log('error submit!', fields);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
-// 取消
|
|
|
-function handleExcel(formEl: FormInstance | undefined) {
|
|
|
- dialogVisible.value = false;
|
|
|
- if (!formEl) return;
|
|
|
- formEl.resetFields();
|
|
|
-}
|
|
|
-
|
|
|
-// 获取详情
|
|
|
-function onPageDetail(urlId: number | [] | string) {
|
|
|
- systemStore.detailPageDataAction(props.modalConfig.pageName, urlId);
|
|
|
-}
|
|
|
-
|
|
|
-defineExpose({
|
|
|
- setDialogVisible,
|
|
|
- onPageDetail,
|
|
|
-});
|
|
|
</script>
|
|
|
|
|
|
<style>
|
