添加我的组件搜索、表格、分页二开

src/views/devices/config/content.vue

@@ -0,0 +1,48 @@
+<template>
+  <myContent :list="list" />
+</template>
+<script setup>
+import myContent from "@/components/mycomponents/myContent.vue";
+import { reactive } from "vue";
+
+let list = reactive({
+  // 分页
+  pagination: {
+    background: false,
+    layout: "prev,pager,next,jumper,total,sizes",
+    pageSize: 20,
+    pageSizes: [10, 20, 30, 50],
+  },
+  // 表格上工具栏按钮
+  toolbar: ["add"],
+  // 表格字段
+  cols: [
+    // { type: "selection", width: 50, align: "center" },
+    { label: "设备名称", align: "center", prop: "id", show: false },
+    { label: "设备号", align: "center", prop: "username" },
+    { label: "品牌", align: "center", prop: "avatar", templet: "image" },
+    { label: "打印类型", align: "center", prop: "deptName" },
+    {
+      label: "状态",
+      align: "center",
+      prop: "status",
+      templet: "switch",
+      slotName: "status",
+    },
+    { label: "创建时间", align: "center", prop: "createTime" },
+    {
+      label: "操作",
+      align: "center",
+      fixed: "right",
+      width: 280,
+      templet: "tool",
+      operat: ["edit", "delete"],
+    },
+  ],
+  // 表格数据
+  pageData: [],
+});
+function getList() {
+  // list.pageData=res
+}
+</script>

src/views/devices/config/search.vue

@@ -0,0 +1,42 @@
+<template>
+  <mySearch :list="list" @queryClick="handleQuery" />
+</template>
+<script setup>
+import { ref } from "vue";
+import mySearch from "@/components/mycomponents/mySearch.vue";
+let list = ref([
+  {
+    label: "设备名称",
+    type: "input",
+    prop: "keywords",
+    attrs: {
+      placeholder: "请输入设备名称",
+      clearable: true,
+      style: {
+        width: "200px",
+      },
+    },
+  },
+  {
+    type: "select",
+    label: "设备类型",
+    prop: "keywords2",
+    options: [
+      { label: "全部", value: 0 },
+      { label: "全部2", value: 1 },
+    ],
+    attrs: {
+      placeholder: "请选择设备类型",
+      clearable: true,
+      style: {
+        width: "200px",
+      },
+    },
+  },
+]);
+const emit = defineEmits(["queryClick"]);
+// 搜索-重置
+function handleQuery(d) {
+  emit("queryClick", d);
+}
+</script>