packages/screen/src/component/MyDialog/index.vue

@@ -12,6 +12,7 @@
       v-bind="componentProps"
       @vue:mounted="handleComponentMount"
     />
+    <slot></slot>
     <template #footer>
       <div class="dialog-footer">
         <el-button @click="onCancel">取消</el-button>

packages/screen/src/component/MyDrawer/index.js

@@ -1,3 +0,0 @@
-import MyDrawer from './index.vue'
-
-export default MyDrawer

packages/screen/src/component/MyDrawer/index.vue

@@ -1,100 +0,0 @@
-<template>
-  <el-drawer
-    :visible.sync="visible"
-    :title="title"
-    :size="size"
-    :direction="direction"
-    destroy-on-close
-  >
-    <component
-      v-if="dynamicComponent"
-      :is="dynamicComponent"
-      ref="dynamicComponentRef"
-      v-bind="componentProps"
-      @vue:mounted="handleComponentMount"
-    />
-
-    <template #footer>
-      <div class="drawer-footer">
-        <el-button @click="onCancel">取消</el-button>
-        <el-button type="primary" @click="onConfirm">确认</el-button>
-      </div>
-    </template>
-  </el-drawer>
-</template>
-
-<script setup>
-import { computed, ref, markRaw } from "vue";
-
-const dynamicComponentRef = ref(null);
-defineExpose({
-  dynamicComponentRef,
-});
-
-const props = defineProps({
-  visible: {
-    type: Boolean,
-    default: false,
-  },
-  size: {
-    type: String,
-    default: "50%",
-  },
-  direction: {
-    type: String,
-    default: "rtl", // rtl/ltr/ttb/btt
-    validator: (v) => ["rtl", "ltr", "ttb", "btt"].includes(v),
-  },
-  title: {
-    type: String,
-    default: "",
-  },
-  dynamicComponent: {
-    type: [Object, Function],
-    default: null,
-  },
-  componentProps: {
-    type: Object,
-    default: () => ({}),
-  },
-  onConfirm: {
-    type: Function,
-    default: () => {},
-  },
-  onCancel: {
-    type: Function,
-    default: () => {},
-  },
-});
-
-const emit = defineEmits(["update:visible"]);
-
-// 状态同步
-const normalizedComponent = computed(() =>
-  props.dynamicComponent ? markRaw(props.dynamicComponent) : null
-);
-
-// 关闭处理
-const handleClose = () => {
-  emit("update:visible", false);
-};
-
-// 确认/取消时自动关闭
-const onConfirm = () => {
-  props.onConfirm();
-  handleClose();
-};
-
-const onCancel = () => {
-  props.onCancel();
-  handleClose();
-};
-</script>
-
-<style scoped>
-.drawer-footer {
-  display: flex;
-  justify-content: flex-end;
-  gap: 12px;
-}
-</style>

packages/screen/src/views/MaterialManagement/addDialog.vue

@@ -6,24 +6,49 @@
       label-width="150px"
       style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
     >
-      <el-form-item label="所属服务站：">
+      <el-row :gutter="20">
-        <span>{{ form.material.yhzmc}}</span>
+        <el-col :span="12">
-      </el-form-item>
+          <el-form-item label="物资名称:">
-      <el-form-item label="物资名称：">
+            <el-input v-model="form.wzmc" />
-          <el-input v-model="form.material.wzmc"></el-input>
+          </el-form-item>
-      </el-form-item>
+          <el-form-item label="入库日期:">
-      <el-form-item label="数量：">
+            <el-date-picker
-          <el-input v-model="form.material.sl"></el-input>
+              type="date"
-      </el-form-item>
+              placeholder="选择日期"
-      <el-form-item label="单位：">
+              v-model="form.rkrq"
-          <el-select v-model="form.material.dw">
+            />
-            <el-option label="个" value="个"></el-option>
+          </el-form-item>
-            <el-option label="包" value="包"></el-option>
+          <el-form-item label="入库单位:">
-            <el-option label="盒" value="盒"></el-option>
+            <el-input v-model="form.rkdw" />
-            <el-option label="桶" value="桶"></el-option>
+          </el-form-item>
-            <el-option label="箱" value="箱"></el-option>
+          <el-row :gutter="20">
-          </el-select>
+            <el-col :span="12">
-      </el-form-item>
+              <el-form-item label="数量:">
+                <el-input-number v-model="form.sl" controls-position="right" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="单位:">
+                <el-input v-model="form.dw" />
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="存放地点:">
+            <el-input v-model="form.cfdd" />
+          </el-form-item>
+          <el-form-item label="负责人:">
+            <el-input v-model="form.fzr" />
+          </el-form-item>
+          <el-form-item label="联系电话:">
+            <el-input v-model="form.lxdh" />
+          </el-form-item>
+          <el-form-item label="区县名称:">
+            <el-input v-model="form.qxmc" />
+          </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
   </div>
 </template>

packages/screen/src/views/MaterialManagement/detailDialog.vue

@@ -1,68 +1,52 @@
 <template>
   <div class="detail-container">
-    <el-card shadow="hover">
+    <el-form
+      label-position="right"
+      label-width="150px"
+      style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
+    >
       <el-row :gutter="20">
         <el-col :span="12">
-          <el-descriptions title="基础信息" column="1">
+          <el-form-item label="物资名称:">
-            <el-descriptions-item label="物资名称: ">{{
+            <el-input disabled v-model="detailData.wzmc" />
-              detailData.material?.wzmc
+          </el-form-item>
-            }}</el-descriptions-item>
+          <el-form-item label="余量:">
-            <el-descriptions-item label="余量: ">{{
+            <el-input disabled v-model="detailData.ye" />
-              detailData.material?.ye
+          </el-form-item>
-            }}</el-descriptions-item>
+          <el-form-item label="入库日期:">
-            <el-descriptions-item label="所属服务站: ">{{
+            <el-input disabled v-model="detailData.rkrq" />
-              detailData.material?.yhzMc
+          </el-form-item>
-            }}</el-descriptions-item>
+          <el-form-item label="入库单位:">
-            <el-descriptions-item label="备注: ">{{
+            <el-input disabled v-model="detailData.rkdw" />
-              detailData.material?.remark
+          </el-form-item>
-            }}</el-descriptions-item>
+          <el-row :gutter="20">
-          </el-descriptions>
+            <el-col :span="12">
+              <el-form-item label="数量:">
+                <el-input disabled v-model="detailData.sl"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="单位:">
+                <el-input disabled v-model="detailData.dw" /> </el-form-item
+            ></el-col>
+          </el-row>
         </el-col>
-        <el-col :span="12" style="position: relative">
+        <el-col :span="12">
-          <el-image
+          <el-form-item label="存放地点:">
-            style="
+            <el-input disabled v-model="detailData.cfdd" />
-              max-width: 180px;
+          </el-form-item>
-              max-height: 180px;
+          <el-form-item label="负责人:">
-              position: absolute;
+            <el-input disabled v-model="detailData.fzr" />
-              right: 0;
+          </el-form-item>
-            "
+          <el-form-item label="联系电话:">
-            :src="detailData.photos[0]?.photoUrl"
+            <el-input disabled v-model="detailData.lxdh" />
-            :zoom-rate="1.2"
+          </el-form-item>
-            :max-scale="7"
+          <el-form-item label="区县名称:">
-            :min-scale="0.2"
+            <el-input disabled v-model="detailData.qxmc" />
-            :preview-src-list="detailData.photos?.map((item) => item.photoUrl)"
+          </el-form-item>
-            show-progresss
-            fit="cover"
-          />
         </el-col>
       </el-row>
-    </el-card>
+    </el-form>
-    <el-card shadow="hover">
-      <el-descriptions title="物资位置信息" column="3">
-        <el-descriptions-item label="区县名称: ">{{
-          detailData.material?.qxmc
-        }}</el-descriptions-item>
-        <el-descriptions-item label="物资经度: ">{{
-          detailData.material?.jd
-        }}</el-descriptions-item>
-        <el-descriptions-item label="物资纬度: ">{{
-          detailData.material?.wd
-        }}</el-descriptions-item>
-      </el-descriptions>
-    </el-card>
-    <el-card shadow="hover">
-      <el-descriptions title="物资管理情况" column="3">
-        <el-descriptions-item label="负责人: ">{{
-          detailData.material?.fzr
-        }}</el-descriptions-item>
-        <el-descriptions-item label="入库人: ">{{
-          detailData.material?.rkrName
-        }}</el-descriptions-item>
-        <el-descriptions-item label="入库日期: ">{{
-          detailData.material?.rkrq?.slice(0, 10)
-        }}</el-descriptions-item>
-      </el-descriptions>
-    </el-card>
   </div>
 </template>
 
@@ -76,9 +60,4 @@ const props = defineProps({
 </script>
 
 <style>
-.detail-container {
-  display: flex;
-  flex-direction: column;
-  gap: 30px;
-}
 </style>

packages/screen/src/views/MaterialManagement/index.js

@@ -16,7 +16,6 @@ const filterText = ref(''); // 树节点过滤条件
 const tableData = ref([]);
 const qxmc = ref(''); // 区县名称
 const yhzid = ref(''); // 养护站id
-const yhzmc = ref(''); // 养护站名称
 const filterData = reactive({
     wzmc: '',
 }); // 表格过滤条件
@@ -43,38 +42,19 @@ const model = reactive({
 const dialogType = ref(''); // 弹窗类型
 const dialogRef = ref(null); // 弹窗实例
 
-const drawerVisible = ref(false); // 抽屉显示状态
-const drawer = reactive({
-    title: '',
-    content: null,
-    props: {},
-    onCancel: null,
-    onConfirm: null,
-    direction: 'rtl',
-    size: '50%'
-}); // 抽屉内容
-const drawerType = ref(''); // 抽屉类型
-const drawerRef = ref(null); // 抽屉实例
-
-
-
 const INIT_FORM = {
-    material: {
+    rkrq: "",
-        rkrq: "",
+    rkdw: "",
-        rkdw: "",
+    sl: "",
-        sl: "",
+    dw: "",
-        dw: "",
+    cfdd: "",
-        cfdd: "",
+    fzr: "",
-        fzr: "",
+    lxdh: "",
-        lxdh: "",
+    ye: "",
-        ye: "",
+    qxmc: "",
-        qxmc: "",
+    wzmc: "",
-        wzmc: "",
+    fzrid: "",
-        fzrid: "",
+    yhzid: "",
-        yhzid: "",
-        yhzmc: "",
-    },
-    photos: [],
 }; // 表单初始值
 const form = reactive({ ...INIT_FORM }); // 表单
 
@@ -116,8 +96,7 @@ const getTreeData = async () => {
                     children: qx.yhzList.map(site => ({
                         id: site.id,
                         name: `${site.mc}(${site.wzsl})`,
-                        type: 'site',
+                        type: 'site'
-                        rawName: site.mc, // 原始名称
                     })),
                     rawName: qx.qxmc, // 原始名称
                 })
@@ -137,21 +116,18 @@ const handleNodeClick = (data, node) => {
     if (data.type === 'area' && node.expanded === false) {
         console.log('树节点关闭', node.expanded)
         yhzid.value = ''; // 重置养护站id
-        yhzmc.value = ''; // 重置养护站名称
         qxmc.value = ''; // 重置区县名称
         return;
     }
     if (data.type === 'area') {
         console.log('你点击的是区县', data.id)
         yhzid.value = ''; // 重置养护站id
-        yhzmc.value = ''; // 重置养护站名称
         qxmc.value = data.id; // 保存区县名称
 
     }
     if (data.type === 'site') {
         console.log('你点击的是站点', data.name)
         yhzid.value = data.id; // 保存养护站id
-        yhzmc.value = data.rawName; // 保存养护站名称
         qxmc.value = ''; // 重置区县名称
     }
 };
@@ -195,24 +171,36 @@ const columns = [
         label: '余量',
     },
     {
-        prop: 'dw',
+        prop: 'rkdw',
-        label: '单位',
+        label: '入库单位',
-    },
-    {
-        prop: 'fzr',
-        label: '负责人',
-    },
-    {
-        prop: 'rkrName',
-        label: '入库人',
     },
     {
         prop: 'rkrq',
         label: '入库日期',
     },
     {
-        prop: 'yhzMc',
+        prop: 'sl',
-        label: '所属服务站',
+        label: '数量',
+    },
+    {
+        prop: 'dw',
+        label: '单位',
+    },
+    {
+        prop: 'cfdd',
+        label: '存放地点',
+    },
+    {
+        prop: 'fzr',
+        label: '负责人',
+    },
+    {
+        prop: 'lxdh',
+        label: '联系电话',
+    },
+    {
+        prop: 'qxmc',
+        label: '所属区县',
     },
     {
         label: "操作",
@@ -317,20 +305,20 @@ const getDetailData = async (row) => {
         }
         if (res.code === '00000') {
             if (dialogType.value === 'detail') {
-                drawer.title = `物资详情`;
+                model.title = `物资详情`;
-                drawer.content = DetailDialog;
+                model.content = DetailDialog;
-                drawer.props = {
+                model.props = {
-                    detailData: res.data,
+                    detailData: res.data.material,
                 };
-                drawer.onCancel = () => {
+                model.onCancel = () => {
                     dialogType.value = '';
-                    drawerVisible.value = false;
+                    modelVisible.value = false;
                 };
-                drawer.onConfirm = () => {
+                model.onConfirm = () => {
                     dialogType.value = '';
-                    drawerVisible.value = false;
+                    modelVisible.value = false;
                 };
-                drawerVisible.value = true;
+                modelVisible.value = true;
             }
             if (dialogType.value === 'edit') {
                 model.title = `编辑物资`;
@@ -365,8 +353,6 @@ const openAddModel = () => {
     model.title = `新增物资`;
     model.content = AddDialog;
     Object.assign(form, INIT_FORM);
-    form.material.yhzid = yhzid.value;
-    form.material.yhzmc = yhzmc.value;
     model.props = {
         detailData: {},
         form: form,
@@ -455,7 +441,7 @@ export default () => {
         await getTreeData();
         await getyhzwzList();
         const rowData = (decodeURIComponent(route.params?.data));
-        if (rowData !== 'undefined' && rowData !== 'null' && rowData !== '') {
+        if (rowData !== 'undefined' && rowData!== 'null' && rowData !== '' ) {
             const JSONData = JSON.parse(rowData);
             filterText.value = JSONData.mc;
         };
@@ -476,9 +462,5 @@ export default () => {
         dialogRef,
         model,
         openAddModel,
-        drawerVisible,
-        drawer,
-        drawerRef,
-        yhzid,
     }
 }

packages/screen/src/views/MaterialManagement/index.vue

@@ -28,7 +28,7 @@
       </div>
       <div class="form-box">
         <div class="event-box">
-          <el-button v-if="script.yhzid.value" type="primary" size="large" @click="script.openAddModel"
+          <el-button type="primary" size="large" @click="script.openAddModel"
             >新增物资</el-button
           >
           <el-button type="info" size="large" @click="script.handelExport"
@@ -57,17 +57,6 @@
         width="60%"
       >
       </MyDialog>
-      <MyDrawer
-        v-model="script.drawerVisible.value"
-        :title="script.drawer?.title"
-        :dynamicComponent="script.drawer?.content"
-        :component-props="script.drawer?.props"
-        :onConfirm="script.drawer?.onConfirm"
-        :onCancel="script.drawer?.onCancel"
-        ref="drawerRef"
-        :direction="script.drawer?.direction"
-        :size="script.drawer?.size"
-      ></MyDrawer>
     </div>
   </div>
 </template>
@@ -76,10 +65,9 @@
 import scriptFn from "./index.js";
 import DynamicTable from "../../component/DynamicTable";
 import MyDialog from "../../component/MyDialog";
-import MyDrawer from "../../component/MyDrawer/index.js";
 
 const script = scriptFn();
-const { treeRef, dialogRef, drawerRef } = script;
+const { treeRef, dialogRef } = script;
 </script>
 <style scoped>
 .root {