更新大屏

2025-04-15 14:38:12 +08:00
parent 8b786df36a
commit 7d1ed23a98
90 changed files with 2828 additions and 1061 deletions
--- a/src/components/aboutTable/FormMessage.vue
+++ b/src/components/aboutTable/FormMessage.vue
@ -0,0 +1,127 @@
+<template>
+    <el-form
+      ref="elform"
+      :model="listQuery"
+      :label-width="140"
+      :rules="props.rules"
+      :inline="true"
+      label-position="right"
+    >
+      <el-form-item v-for="item in props.formData" :style="{ width: item.width }" :prop="item.prop" :label="item.text" :label-width="item.labelWidth"   :key="item">
+        <!-- input表单 -->
+        <MOSTY.Other v-if="item.type == 'input'" width="100%" clearable v-model="listQuery[item.prop]" :placeholder="`请输入${item.text}`"/>
+        <el-input v-model="listQuery[item.prop]" v-else-if="item.type == 'textarea'" :placeholder="`请输入${item.text}`" />
+        <!-- Select选择 -->
+        <MOSTY.Select
+          v-else-if="item.type == 'select'"
+          width="100%"
+          clearable
+          v-model="listQuery[item.prop]"
+          :dictEnum="item.optionList"
+          :placeholder="`请选择${item.text}`"
+        />
+
+        <template v-else-if="item.showType === 'department'">
+          <MOSTY.Department clearable v-model="listQuery[item.prop]" />
+        </template>
+
+        <!-- Upload选择 -->
+        <MOSTY.Upload
+          v-else-if="item.type == 'upload'"
+          width="100%"
+          v-model="listQuery[item.prop]"
+        />
+        <!-- CheckBox选择 -->
+        <MOSTY.CheckBox
+          v-else-if="item.type == 'checkbox'"
+          width="100%"
+          clearable
+          v-model="listQuery[item.prop]"
+          :checkList="item.optionList"
+          :placeholder="`请选择${item.text}`"
+        />
+        <el-radio-group v-model="listQuery[item.prop]" v-else-if="item.type == 'radio'">
+          <el-radio
+            v-for="obj in item.optionList"
+            :key="obj.value"
+            :label="obj.value"
+            >{{ obj.label }}</el-radio
+          >
+        </el-radio-group>
+        <el-date-picker
+          v-else-if="item.type == 'date'"
+          v-model="listQuery[item.prop]"
+          type="date"
+          value-format="YYYY-MM-DD"
+          :placeholder="请选择时间"
+        />
+        <el-date-picker
+          v-else-if="item.type == 'datetime'"
+          v-model="listQuery[item.prop]"
+          type="datetime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          :placeholder="请选择时间"
+        />
+        <el-date-picker
+          v-else-if="item.type == 'datetimerange'"
+          v-model="listQuery[item.prop]"
+          type="datetimerange"
+          :shortcuts="shortcuts"
+          range-separator="To"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          start-placeholder="选择开始时间"
+          end-placeholder="选择结束时间"
+        />
+        <el-date-picker
+          v-else-if="item.type == 'daterange'"
+          v-model="listQuery[item.prop]"
+          type="daterange"
+          range-separator="To"
+          value-format="YYYY-MM-DD"
+          start-placeholder="选择开始日期"
+          end-placeholder="选择开始日期"
+        />
+        <el-switch
+          v-else-if="item.type == 'switch'"
+          v-model="listQuery[item.prop]"
+          class="ml-2"
+          style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+        />
+        <template v-else-if="item.type === 'slot'">
+          <slot :name="item.prop"></slot>
+        </template>
+      </el-form-item>
+    </el-form>
+  </template>
+  <script setup>
+  import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
+  import * as MOSTY from "@/components/MyComponents/index";
+  import { ref, defineProps, defineEmits, defineExpose } from "vue";
+  const props = defineProps({
+    //循环的值
+    formData: {
+      default: [],
+      type: Array
+    },
+    propName: {
+      default: "",
+      type: String
+    },
+    rules: {
+      default: {},
+      type: Object
+    }
+  });
+  const elform = ref();
+  const listQuery = ref({});
+  const emits = defineEmits(["update:modelValue"]);
+ 
+  const submit = (resfun) => {
+    elform.value.validate((valid) => {
+      if (!valid) return false;
+      resfun(listQuery.value);
+    });
+  };
+  defineExpose({ submit });
+  </script>
+