From 3e5e016eb14faa1e3542437666b9f4540cf9e36b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=8E=E5=B0=8F=E6=9E=97?= <320730042@qq.com>
Date: Thu, 23 May 2024 15:28:03 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=AE=BE=E5=A4=87=E7=B1=BB=E5=9E=8B?=
 =?UTF-8?q?=E5=8F=8A=E8=BD=AF=E4=BB=B6=E7=89=88=E6=9C=AC=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/device-type/index.ts                  |  11 ++
 src/api/tr069/types.ts                        |  17 ++
 src/router/index.ts                           |  24 +++
 .../tr069/components/BindingDevType.vue       | 168 ++++++++++++++++++
 .../components/Tr069DevTypeSoftVerList.vue    |  80 +++++++++
 src/views/resources/tr069/index.vue           |  30 ++++
 6 files changed, 330 insertions(+)
 create mode 100644 src/views/resources/tr069/components/BindingDevType.vue
 create mode 100644 src/views/resources/tr069/components/Tr069DevTypeSoftVerList.vue

diff --git a/src/api/device-type/index.ts b/src/api/device-type/index.ts
index b055d2d..5b2b9c5 100644
--- a/src/api/device-type/index.ts
+++ b/src/api/device-type/index.ts
@@ -5,6 +5,7 @@ import {
 } from "@/api/device-type/types";
 import request from "@/utils/request";
 import { AxiosPromise } from "axios";
+import { Tr069DevTypeQuery, Tr069DevTypeVOPageResult } from "@/api/tr069/types";
 
 export function getDeviceTypePage(
   data: DeviceTypeQuery
@@ -72,3 +73,13 @@ export function deleteDevTypeByIds(ids: number[]) {
     data: ids,
   });
 }
+
+export function tr069BindingDevTypePage(
+  data: Tr069DevTypeQuery
+): AxiosPromise<Tr069DevTypeVOPageResult> {
+  return request({
+    url: "/api/dev-type/v1/tr069-binding-page",
+    method: "POST",
+    data,
+  });
+}
diff --git a/src/api/tr069/types.ts b/src/api/tr069/types.ts
index 2d8b449..bb19fe0 100644
--- a/src/api/tr069/types.ts
+++ b/src/api/tr069/types.ts
@@ -24,3 +24,20 @@ export interface Tr069Xml {
 
   children?: Array<Tr069Xml>;
 }
+
+export interface Tr069DevTypeQuery extends PageQuery {
+  tr069VerId?: number;
+  devTypeName?: string;
+  devHardVer?: string;
+  devVendorName?: string;
+}
+export interface Tr069DevTypeVO {
+  devTypeId?: number;
+
+  devType?: string;
+
+  devTypeSoftVer?: string;
+
+  devTypeVerStatus?: string;
+}
+export type Tr069DevTypeVOPageResult = PageResult<Tr069DevTypeVO[]>;
diff --git a/src/router/index.ts b/src/router/index.ts
index 4e55b3b..b7a6e9a 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -87,6 +87,30 @@ export const constantRoutes: RouteRecordRaw[] = [
           import("@/views/resources/tr069/components/Tr069Tree.vue"),
         meta: { hidden: true, keepAlive: true, title: "TR069参数树" },
       },
+      {
+        path: "/resources/tr069-dev-type-soft-ver/:tr069VerId",
+        name: "Tr069DevTypeSoftVerList",
+        component: () =>
+          import(
+            "@/views/resources/tr069/components/Tr069DevTypeSoftVerList.vue"
+          ),
+        meta: {
+          hidden: true,
+          keepAlive: true,
+          title: "TR-069数据模型设备类型及软件版本",
+        },
+      },
+      {
+        path: "/resources/tr069-binding-dev-type/:tr069VerId",
+        name: "BindingDevType",
+        component: () =>
+          import("@/views/resources/tr069/components/BindingDevType.vue"),
+        meta: {
+          hidden: true,
+          keepAlive: true,
+          title: "绑定设备类型",
+        },
+      },
     ],
   },
 ];
diff --git a/src/views/resources/tr069/components/BindingDevType.vue b/src/views/resources/tr069/components/BindingDevType.vue
new file mode 100644
index 0000000..bec3177
--- /dev/null
+++ b/src/views/resources/tr069/components/BindingDevType.vue
@@ -0,0 +1,168 @@
+<template>
+  <div class="app-container">
+    <div class="search-container">
+      <el-form :model="searchForm" :inline="true">
+        <el-form-item label="设备供应商">
+          <el-select
+            v-model="searchForm.devVendorName"
+            clearable
+            placeholder="请选择设备供应商"
+            style="width: 180px"
+          >
+            <el-option
+              v-for="item in vendorNameOption"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="设备型号">
+          <el-select
+            v-model="searchForm.devTypeName"
+            clearable
+            placeholder="请选择设备型号"
+            style="width: 180px"
+          >
+            <el-option
+              v-for="item in typeNameOption"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="设备硬件版本">
+          <el-select
+            v-model="searchForm.devHardVer"
+            clearable
+            placeholder="设备硬件版本"
+            style="width: 180px"
+          >
+            <el-option
+              v-for="item in hardVerOption"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="loadTr069DevTypePage">
+            <i-ep-search />
+            搜索
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <el-card shadow="never">
+      <div class="any-table">
+        <el-table
+          :data="tableData"
+          v-loading="loading"
+          highlight-current-row
+          max-height="450"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection" width="55" />
+          <el-table-column label="设备类型" prop="devType" align="center">
+            <template #default="scope">
+              <el-button
+                type="primary"
+                link
+                @click="redirect(scope.row.devTypeId)"
+                >{{ scope.row.devType }}</el-button
+              >
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="设备类型软件版本名称"
+            prop="devTypeSoftVer"
+            align="center"
+          />
+          <el-table-column
+            label="审核标志"
+            prop="devTypeVerStatus"
+            align="center"
+          />
+        </el-table>
+        <pagination
+          v-if="total > 0"
+          v-model:total="total"
+          v-model:page="searchForm.pageNum"
+          v-model:limit="searchForm.pageSize"
+          @pagination="loadTr069DevTypePage"
+        />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  getHardVerOption,
+  getTypeNameOption,
+  getVendorNameOption,
+  tr069BindingDevTypePage,
+} from "@/api/device-type";
+import { Tr069DevTypeQuery, Tr069DevTypeVO } from "@/api/tr069/types";
+import { ElTable } from "element-plus";
+const multiples = ref<Tr069DevTypeVO[]>([]);
+const searchForm = ref<Tr069DevTypeQuery>({
+  devTypeName: "",
+  devHardVer: "",
+  devVendorName: "",
+  pageNum: 1,
+  pageSize: 10,
+});
+const vendorNameOption = ref<OptionType[]>([]);
+const typeNameOption = ref<OptionType[]>([]);
+const hardVerOption = ref<OptionType[]>([]);
+const tableData = ref<Tr069DevTypeVO[]>([]);
+const total = ref<number>(0);
+const loading = ref<boolean>(false);
+const router = useRouter();
+const loadVendorNameOption = async () => {
+  await getVendorNameOption().then(({ data }) => {
+    vendorNameOption.value = data;
+  });
+};
+const loadTypeNameOption = async () => {
+  await getTypeNameOption(searchForm.value.devVendorName).then(({ data }) => {
+    typeNameOption.value = data;
+  });
+};
+const loadHardVerOption = async () => {
+  await getHardVerOption(searchForm.value.devTypeName).then(({ data }) => {
+    hardVerOption.value = data;
+  });
+};
+const handleSelectionChange = (val: Tr069DevTypeVO[]) => {
+  multiples.value = val;
+};
+const loadTr069DevTypePage = () => {
+  loading.value = true;
+  tr069BindingDevTypePage(searchForm.value)
+    .then(({ data }) => {
+      tableData.value = data.list;
+      total.value = data.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+
+const redirect = (devTypeId: number) => {
+  router.push({
+    path: `/resources/device_type_to_ver/${devTypeId}`,
+  });
+};
+onMounted(() => {
+  loadVendorNameOption();
+  loadTypeNameOption();
+  loadHardVerOption();
+});
+</script>
+
+<style scoped></style>
diff --git a/src/views/resources/tr069/components/Tr069DevTypeSoftVerList.vue b/src/views/resources/tr069/components/Tr069DevTypeSoftVerList.vue
new file mode 100644
index 0000000..f1ac611
--- /dev/null
+++ b/src/views/resources/tr069/components/Tr069DevTypeSoftVerList.vue
@@ -0,0 +1,80 @@
+<template>
+  <div class="app-container">
+    <el-card shadow="never">
+      <div class="mb-4">
+        <div style="display: flex; justify-content: space-between">
+          <div style="font-weight: 700">设备类型对应的设备软件版本列表</div>
+          <div>
+            <el-button type="primary" @click="skipBindingDevType">
+              <i-ep-plus />
+              新增
+            </el-button>
+          </div>
+        </div>
+      </div>
+      <div class="any-table">
+        <el-table
+          :data="tableData"
+          v-loading="loading"
+          highlight-current-row
+          max-height="450"
+        >
+          <el-table-column label="设备类型" prop="devType" align="center" />
+          <el-table-column
+            label="设备类型软件版本名称"
+            prop="devTypeSoftVer"
+            align="center"
+          />
+          <el-table-column
+            label="审核标志"
+            prop="devTypeVerStatus"
+            align="center"
+          />
+        </el-table>
+        <pagination
+          v-if="total > 0"
+          v-model:total="total"
+          v-model:page="query.pageNum"
+          v-model:limit="query.pageSize"
+          @pagination="loadTr069DevTypePage"
+        />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { Tr069DevTypeQuery, Tr069DevTypeVO } from "@/api/tr069/types";
+import { tr069BindingDevTypePage } from "@/api/device-type";
+
+const route = useRoute();
+const router = useRouter();
+let tr069VerId: number = parseInt(<string>route.params.tr069VerId);
+const tableData = ref<Tr069DevTypeVO[]>([]);
+const total = ref<number>(0);
+const loading = ref<boolean>(false);
+const query = ref<Tr069DevTypeQuery>({
+  pageNum: 1,
+  pageSize: 10,
+  tr069VerId: tr069VerId,
+});
+const loadTr069DevTypePage = () => {
+  loading.value = true;
+  tr069BindingDevTypePage(query.value)
+    .then(({ data }) => {
+      tableData.value = data.list;
+      total.value = data.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+const skipBindingDevType = () => {
+  router.push({ path: `/resources/tr069-binding-dev-type/${tr069VerId}` });
+};
+onMounted(() => {
+  loadTr069DevTypePage();
+});
+</script>
+
+<style scoped></style>
diff --git a/src/views/resources/tr069/index.vue b/src/views/resources/tr069/index.vue
index d827154..f1e40db 100644
--- a/src/views/resources/tr069/index.vue
+++ b/src/views/resources/tr069/index.vue
@@ -50,6 +50,30 @@
             align="center"
             prop="tr069VerDesc"
           />
+          <el-table-column label="操作" align="center">
+            <template #default="scope">
+              <el-tooltip
+                class="box-item"
+                effect="dark"
+                content="设备类型及软件版本列表"
+                placement="top"
+              >
+                <el-button type="primary" link @click="skipDevTypeSoftVerList(scope.row.tr069VerId)">
+                  <el-icon size="15"><Link /></el-icon>
+                </el-button>
+              </el-tooltip>
+              <el-tooltip
+                class="box-item"
+                effect="dark"
+                content="业务版本列表"
+                placement="top"
+              >
+                <el-button type="primary" link>
+                  <el-icon size="15"><Pointer /></el-icon>
+                </el-button>
+              </el-tooltip>
+            </template>
+          </el-table-column>
         </el-table>
         <pagination
           v-if="total > 0"
@@ -70,6 +94,7 @@ import { getTr069Page } from "@/api/tr069";
 import { downloadFileApi } from "@/api/file";
 import { downloadHook } from "@/utils";
 import AddTr069File from "@/views/resources/tr069/components/AddTr069File.vue";
+import { Pointer } from "@element-plus/icons-vue";
 defineOptions({
   name: "Tr069",
   inheritAttrs: false,
@@ -107,6 +132,11 @@ const addTr069FileRef = ref();
 const openTr069FileForm = () => {
   addTr069FileRef.value.open("3", "新增TR-069数据模型文件");
 };
+const skipDevTypeSoftVerList = (tr069VerId?: number) => {
+  router.push({
+    path: `/resources/tr069-dev-type-soft-ver/${tr069VerId}`,
+  });
+};
 onMounted(() => {
   loadTr069Page();
 });