添加设备弹窗

src/views/device/instance/components/index.vue

@@ -7,14 +7,11 @@
         :data="data"
         :option="option"
         v-model:page="page"
-        @row-save="createRow"
-        @row-update="updateRow"
-        @row-del="deleteRow"
+        @row-click="rowClick"
         @search-change="searchChange"
         @search-reset="resetChange"
         @size-change="dataList"
         @current-change="dataList"
-        @selection-change="selectionChange"
     >
     </avue-crud>
   </div>
@@ -31,11 +28,6 @@ const test = () => {
   isShowTable.value = true;
   tableType.value = tableType.value == 1 ? 2 : 1;
 };
-watch?.(
-    () => props.deviceInfo,
-    (newVal: string) => {
-    }
-);
 // 传入一个url，后面不带/
 const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
   useCrud({
@@ -43,19 +35,29 @@ const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
   });
 const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
 const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
-const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
+const { checkBtnPerm, downloadTemplate } = Utils; //按钮权限等工具
 
 const crudRef = ref(null); //crudRef.value 获取avue-crud对象
+const emit = defineEmits(["deviceInfo"])
+const rowClick = (row)=>{
+  emit("deviceInfo", row)
+}
 
 // 设置表格列或者其他自定义的option
 option.value = Object.assign(option.value, {
   delBtn: false,
-  selection: true,
+  selection: false,
+  search: false,
+  editBtn: false,
+  addBtn: false,
+  viewBtn: false,
+  menu: false,
   column: [
     {
       label: "设备编号",
       prop: "deviceNo",
       search: true,
+      width: '120',
       rules: [
         {
           required: true,
@@ -68,6 +70,7 @@ option.value = Object.assign(option.value, {
       label: "设备名称",
       prop: "deviceName",
       search: true,
+      width: '120',
       rules: [
         {
           required: true,
@@ -81,6 +84,7 @@ option.value = Object.assign(option.value, {
       prop: "deviceType",
       type: "select",
       search: true,
+      width: '100',
       dicUrl:
         dictDataUtil.request_url +
         dictDataUtil.TYPE_CODE.device_type,
@@ -88,74 +92,31 @@ option.value = Object.assign(option.value, {
         label: "dictLabel",
         value: "dictValue",
       },
-      rules: [
-        {
-          required: true,
-          message: "设备类型不能为空",
-          trigger: "trigger",
-        },
-      ],
-    },
-    {
-      label: "设备状态",
-      prop: "state",
-      type: "select",
-      search: true,
-      dicUrl:
-          dictDataUtil.request_url +
-          dictDataUtil.TYPE_CODE.device_status,
-      props: {
-        label: "dictLabel",
-        value: "dictValue",
-      },
-      rules: [
-        {
-          required: true,
-          message: "设备状态不能为空",
-          trigger: "trigger",
-        },
-      ],
     },
     {
       label: "负责人",
+      width: '100',
       prop: "head",
-      rules: [
-        {
-          required: true,
-          message: "负责人不能为空",
-          trigger: "trigger",
-        },
-      ],
-    },
-    {
-      label: "供应厂商",
-      prop: "manufacturer",
-    },
-    {
-      label: "所在车间",
-      prop: "workshop",
-    },
-    {
-      label: "所在工位",
-      prop: "station",
     },
     {
       label: "设备位置",
+      width: '150',
       prop: "devicePosition",
     },
     {
       label: "规格",
+      width: '150',
       prop: "specifications",
     },
     {
       label: "品牌",
+      width: '150',
       prop: "brand",
     },
   ],
 });
 
 onMounted(() => {
-  // console.log("crudRef", crudRef)
   dataList();
 });
 </script>

src/views/device/maintenance/index.vue

@@ -29,11 +29,11 @@
     </avue-crud>
     <el-dialog
         v-model="dialog.visible"
-        title="设备选择"
-        width="500px"
+        :title="dialog.title"
+        width="850px"
         @close="dialog.visible = false"
     >
-      <devicePage  v-model:deviceInfo="deviceInfo"/>
+      <device-page  @deviceInfo="deviceInfo"/>
     </el-dialog>
   </div>
 </template>
@@ -50,9 +50,10 @@ const test = () => {
   tableType.value = tableType.value == 1 ? 2 : 1;
 };
 
-const deviceInfo = ref({})
-const dialog = ref({visible: false})
-
+const dialog = reactive({
+  title: "设备选择",
+  visible: false,
+});
 // 传入一个url，后面不带/
 const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
   useCrud({
@@ -61,16 +62,12 @@ const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
 const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
 const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
 const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
-// checkBtnPerm(ButtonPermKeys.PLAN.BTNS.order_add) :permission="permission"
-// const permission = reactive({
-//   delBtn: checkPerm(buttonPermission.PLAN.BTNS.order_del),
-//   addBtn: checkPerm(buttonPermission.PLAN.BTNS.order_add),
-//   editBtn: checkPerm(buttonPermission.PLAN.BTNS.order_edit),
-//   menu: true,
-// });
 
 const crudRef = ref(null); //crudRef.value 获取avue-crud对象
-
+const deviceInfo = (value) => {
+  form.value.deviceNo = value.deviceNo
+  dialog.visible = false
+}
 // 设置表格列或者其他自定义的option
 option.value = Object.assign(option.value, {
   delBtn: false,