diff --git a/src/api/device-type/index.ts b/src/api/device-type/index.ts
index 5b2b9c5..19f241c 100644
--- a/src/api/device-type/index.ts
+++ b/src/api/device-type/index.ts
@@ -83,3 +83,13 @@ export function tr069BindingDevTypePage(
     data,
   });
 }
+export function serviceBindingDevTypePage(
+  data: PageQuery,
+  servId: number
+): AxiosPromise<Tr069DevTypeVOPageResult> {
+  return request({
+    url: `/api/dev-type/v1/service-binding-dev-type-page/${servId}`,
+    method: "POST",
+    data,
+  });
+}
diff --git a/src/api/service/index.ts b/src/api/service/index.ts
index 3378172..c3a7ed6 100644
--- a/src/api/service/index.ts
+++ b/src/api/service/index.ts
@@ -1,6 +1,12 @@
 import { AxiosPromise } from "axios";
-import { ServicePageResult } from "@/api/service/types";
+import {
+  BusinessFile,
+  BusinessForm,
+  BusinessPageResult,
+  ServicePageResult,
+} from "@/api/service/types";
 import request from "@/utils/request";
+import { Tr069DevTypeQuery, Tr069DevTypeVOPageResult } from "@/api/tr069/types";
 
 export function tr069ServiceList(
   data: PageQuery,
@@ -42,3 +48,70 @@ export function removeBindingTr069Service(
     method: "DELETE",
   });
 }
+
+export function businessPage(
+  data: PageQuery
+): AxiosPromise<BusinessPageResult> {
+  return request({
+    url: `/api/service/v1/business-page`,
+    method: "POST",
+    data,
+  });
+}
+export function addBusiness(data: BusinessForm): AxiosPromise<number> {
+  return request({
+    url: `/api/service/v1/add`,
+    method: "POST",
+    data,
+  });
+}
+export function addBusinessFile(data: BusinessFile): AxiosPromise<number> {
+  return request({
+    url: `/api/service/v1/add_business_file`,
+    method: "POST",
+    data,
+  });
+}
+export function bindingTr069Option(servId?: number): AxiosPromise<number[]> {
+  return request({
+    url: `/api/service/v1/binding-option/${servId}`,
+    method: "GET",
+  });
+}
+
+export function bindingTr069(ids: number[], servId?: number) {
+  return request({
+    url: `/api/service/v1/binding/${servId}`,
+    method: "POST",
+    data: ids,
+  });
+}
+export function getBusinessFormById(
+  servId?: number
+): AxiosPromise<BusinessForm> {
+  return request({
+    url: `/api/service/v1/form/${servId}`,
+    method: "GET",
+  });
+}
+export function editBusiness(data: BusinessForm): AxiosPromise<number> {
+  return request({
+    url: `/api/service/v1/edit`,
+    method: "POST",
+    data,
+  });
+}
+
+export function deleteBusiness(ids: number[]) {
+  return request({
+    url: "/api/service/v1/delete",
+    method: "POST",
+    data: ids,
+  });
+}
+export function deleteFileAPI(fileId?: number, servId?: number) {
+  return request({
+    url: `/api/service/v1/delete-file/${fileId}/${servId}`,
+    method: "DELETE",
+  });
+}
diff --git a/src/api/service/types.ts b/src/api/service/types.ts
index 118db22..de16bbe 100644
--- a/src/api/service/types.ts
+++ b/src/api/service/types.ts
@@ -6,3 +6,39 @@ export interface ServiceVO {
   servDesc?: string;
 }
 export type ServicePageResult = PageResult<ServiceVO[]>;
+
+export interface BusinessVO {
+  servId?: number;
+  servName?: string;
+  servVerName?: string;
+  servDisplayName?: string;
+  servDesc?: string;
+  fileId?: number;
+  fileName?: string;
+  fileCreateTime?: string;
+}
+export type BusinessPageResult = PageResult<BusinessVO[]>;
+
+export interface BusinessForm {
+  servId?: number;
+  servName?: string;
+  servVerName?: string;
+  servDisplayName?: string;
+  servDesc?: string;
+  pluginFileId?: number;
+}
+export interface BusinessFile {
+  fileId?: number;
+
+  fileName?: string;
+
+  fileDesc?: string;
+
+  fileType?: string;
+
+  fileUrl?: string;
+}
+export interface Tr069Option {
+  key?: number;
+  label?: string;
+}
diff --git a/src/api/tr069/index.ts b/src/api/tr069/index.ts
index 9016a29..36d62a4 100644
--- a/src/api/tr069/index.ts
+++ b/src/api/tr069/index.ts
@@ -1,6 +1,7 @@
 import request from "@/utils/request";
 import { AxiosPromise } from "axios";
 import { Tr069VerForm, Tr069VerPageResult, Tr069Xml } from "@/api/tr069/types";
+import { Tr069Option } from "@/api/service/types";
 
 export function getTr069Page(
   data: PageQuery
@@ -43,3 +44,10 @@ export function addTr069(data: Tr069VerForm){
     data,
   });
 }
+
+export function getTr069Option(): AxiosPromise<Tr069Option[]> {
+  return request({
+    url: `/api/tr069/v1/transfer-option`,
+    method: "GET",
+  });
+}
diff --git a/src/router/index.ts b/src/router/index.ts
index 6a631f2..e73fae9 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -127,6 +127,17 @@ export const constantRoutes: RouteRecordRaw[] = [
           title: "绑定业务版本",
         },
       },
+      {
+        path: "/resources/service-form/:servId",
+        name: "BusinessForm",
+        component: () =>
+          import("@/views/resources/service/components/BusinessForm.vue"),
+        meta: {
+          hidden: true,
+          keepAlive: true,
+          title: "业务信息",
+        },
+      },
     ],
   },
 ];
diff --git a/src/views/resources/device-type/components/AddDomianTree.vue b/src/views/resources/device-type/components/AddDomianTree.vue
index bd6565b..ef7d394 100644
--- a/src/views/resources/device-type/components/AddDomianTree.vue
+++ b/src/views/resources/device-type/components/AddDomianTree.vue
@@ -3,6 +3,7 @@
     class="com-dialog"
     v-model="openDomainTreeFlag"
     title="新增设备类型软件版本系统管理域"
+    width="1000"
   >
     <div style="display: flex; justify-content: center">
       <el-transfer
diff --git a/src/views/resources/service/components/AddPluginFile.vue b/src/views/resources/service/components/AddPluginFile.vue
new file mode 100644
index 0000000..ee2f488
--- /dev/null
+++ b/src/views/resources/service/components/AddPluginFile.vue
@@ -0,0 +1,122 @@
+<template>
+  <el-dialog
+    class="com-dialog"
+    v-model="pluginFileFlag"
+    align-center
+    title="plugIn文件信息"
+  >
+    <el-form
+      ref="addPluginFileRef"
+      v-loading="loading"
+      :rules="rules"
+      :model="formData"
+    >
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="文件名称" prop="fileName">
+            <el-input v-model="formData.fileName" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="文件描述信息">
+            <el-input v-model="formData.fileDesc" type="textarea" :rows="1" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-upload
+        drag
+        action="#"
+        :limit="1"
+        :auto-upload="false"
+        v-model:file-list="fileList"
+      >
+        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+        <div class="el-upload__text">拖拽上传 或 <em>点击上传</em></div>
+      </el-upload>
+    </el-form>
+    <template #footer>
+      <el-button type="primary" @click="handleUpload(addPluginFileRef)"
+        >保存</el-button
+      >
+      <el-button @click="pluginFileFlag = false">取消</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+import { UploadFilled } from "@element-plus/icons-vue";
+import { VendorProfile } from "@/api/file/types";
+import { FormInstance, FormRules, UploadUserFile } from "element-plus";
+import { uploadApi } from "@/api/file";
+import { addVendorProfile } from "@/api/device-type-ver";
+import { BusinessFile, BusinessForm } from "@/api/service/types";
+import { addBusinessFile, editBusiness } from "@/api/service";
+
+const loading = ref<boolean>(false);
+const pluginFileFlag = ref<boolean>(false);
+const addPluginFileRef = ref();
+const fileList = ref<UploadUserFile[]>([]);
+const formData = ref<BusinessFile>({
+  fileType: "4",
+});
+const businessForm = ref<BusinessForm>({});
+const open = (servId_: number) => {
+  businessForm.value.servId = servId_;
+  resetForm(addPluginFileRef.value);
+  fileList.value = [];
+  pluginFileFlag.value = true;
+};
+defineExpose({ open });
+const rules = reactive<FormRules<VendorProfile>>({
+  fileName: [{ required: true, message: "请填写文件名称", trigger: "blur" }],
+});
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  formEl.resetFields();
+};
+const emit = defineEmits(["success"]);
+const submitFileRecord = async () => {
+  await addBusinessFile(formData.value).then(({ data }) => {
+    businessForm.value.pluginFileId = data;
+    updateBusinessForm();
+  });
+};
+const updateBusinessForm = () => {
+  editBusiness(businessForm.value).then(() => {
+    emit("success");
+    pluginFileFlag.value = false;
+  });
+};
+const handleUpload = async (formEl: FormInstance | undefined) => {
+  if (fileList.value.length === 0) {
+    ElMessage.error("请选择文件上传");
+    return;
+  }
+  if (!formEl) return;
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      loading.value = true;
+      const file = fileList.value[0].raw;
+      const dotIndex: any = file?.name.lastIndexOf(".");
+      if (dotIndex === -1) {
+        ElMessage.error("文件没有后缀，无法上传");
+        return;
+      }
+      const fileName = formData.value.fileName;
+      const fileType = formData.value.fileType;
+      formData.value.fileName =
+        fileName + "." + file?.name.substring(dotIndex + 1);
+      uploadApi(file, fileName, fileType)
+        .then(({ data }) => {
+          formData.value.fileUrl = data;
+          submitFileRecord();
+        })
+        .finally(() => {
+          loading.value = false;
+        });
+    }
+  });
+};
+</script>
+
+<style scoped></style>
diff --git a/src/views/resources/service/components/BusinessForm.vue b/src/views/resources/service/components/BusinessForm.vue
new file mode 100644
index 0000000..5089c75
--- /dev/null
+++ b/src/views/resources/service/components/BusinessForm.vue
@@ -0,0 +1,394 @@
+<template>
+  <div class="app-container">
+    <div class="search-container">
+      <div v-show="active === 0">
+        <el-form
+          :model="businessForm"
+          ref="businessFormRef"
+          :rules="rules"
+          v-loading="formLoading"
+          style="margin-bottom: 10px"
+        >
+          <el-descriptions title="业务信息表单" :column="2" border>
+            <template #extra v-if="businessForm.servId != undefined">
+              <div style="margin-right: 10px">
+                <el-button
+                  type="primary"
+                  @click="updateForm(businessFormRef)"
+                  plain
+                  :icon="Position"
+                  >保存</el-button
+                >
+              </div>
+            </template>
+            <el-descriptions-item
+              label="业务名称"
+              label-align="left"
+              align="center"
+              label-class-name="my-label"
+              class-name="my-content"
+              width="180px"
+            >
+              <el-form-item style="margin-bottom: 0" prop="servName">
+                <el-input v-model="businessForm.servName" />
+              </el-form-item>
+            </el-descriptions-item>
+            <el-descriptions-item
+              label="业务显示名称"
+              label-align="left"
+              align="center"
+              label-class-name="my-label"
+              class-name="my-content"
+              width="180px"
+            >
+              <el-form-item style="margin-bottom: 0" prop="servDisplayName">
+                <el-input v-model="businessForm.servDisplayName" />
+              </el-form-item>
+            </el-descriptions-item>
+            <el-descriptions-item
+              label="业务版本"
+              label-align="left"
+              align="center"
+              label-class-name="my-label"
+              class-name="my-content"
+              width="180px"
+            >
+              <el-form-item style="margin-bottom: 0" prop="servVerName">
+                <el-input v-model="businessForm.servVerName" />
+              </el-form-item>
+            </el-descriptions-item>
+            <el-descriptions-item
+              label="业务描述"
+              label-align="left"
+              align="center"
+              label-class-name="my-label"
+              class-name="my-content"
+              width="180px"
+            >
+              <el-form-item style="margin-bottom: 0" prop="servDesc">
+                <el-input
+                  type="textarea"
+                  :rows="1"
+                  v-model="businessForm.servDesc"
+                />
+              </el-form-item>
+            </el-descriptions-item>
+          </el-descriptions>
+        </el-form>
+        <el-form
+          :model="fileForm"
+          v-if="servId === 0"
+          style="margin-top: 10px; margin-bottom: 10px"
+        >
+          <el-descriptions title="文件信息表单" :column="2" border>
+            <el-descriptions-item
+              label="文件名称"
+              label-align="left"
+              align="center"
+              label-class-name="my-label"
+              class-name="my-content"
+              width="180px"
+            >
+              <el-form-item style="margin-bottom: 0" prop="fileName">
+                <el-input v-model="fileForm.fileName" />
+              </el-form-item>
+            </el-descriptions-item>
+            <el-descriptions-item
+              label="文件描述信息"
+              label-align="left"
+              align="center"
+              label-class-name="my-label"
+              class-name="my-content"
+              width="180px"
+            >
+              <el-form-item style="margin-bottom: 0" prop="fileDesc">
+                <el-input
+                  type="textarea"
+                  :rows="1"
+                  v-model="fileForm.fileDesc"
+                />
+              </el-form-item>
+            </el-descriptions-item>
+            <el-descriptions-item
+              label="文件上传"
+              label-align="left"
+              align="center"
+              label-class-name="my-label"
+              class-name="my-content"
+              width="180px"
+            >
+              <el-upload
+                drag
+                action="#"
+                :limit="1"
+                :auto-upload="false"
+                v-model:file-list="fileList"
+              >
+                <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+                <div class="el-upload__text">拖拽上传 或 <em>点击上传</em></div>
+              </el-upload>
+            </el-descriptions-item>
+          </el-descriptions>
+        </el-form>
+        <div
+          style="
+            display: flex;
+            justify-content: flex-end;
+            margin-right: 10px;
+            margin-bottom: 10px;
+          "
+        >
+          <el-button
+            v-if="businessForm.servId === undefined"
+            type="primary"
+            @click="submitForm(businessFormRef)"
+            >下一步</el-button
+          >
+          <el-button v-else type="primary" @click="next">下一步</el-button>
+        </div>
+        <div class="any-table">
+          <el-table
+            :data="tableData"
+            v-loading="tableLoading"
+            v-if="servId != 0"
+            highlight-current-row
+            max-height="300"
+          >
+            <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="loadServiceDevTypePage"
+          />
+        </div>
+      </div>
+      <div v-show="active === 1">
+        <div style="display: flex; justify-content: space-between">
+          <div style="font-weight: 700">业务信息列表</div>
+        </div>
+        <div
+          style="
+            display: flex;
+            justify-content: center;
+            margin-top: 20px;
+            margin-bottom: 20px;
+          "
+        >
+          <el-transfer
+            :titles="['所有TR-069数据模型版本', '要绑定的TR-069数据模型版本']"
+            v-model="target"
+            :data="resource"
+          />
+        </div>
+        <div
+          style="
+            display: flex;
+            justify-content: flex-end;
+            margin-bottom: 20px;
+            margin-right: 20px;
+          "
+        >
+          <el-button type="primary" @click="lastStep">上一步</el-button>
+          <el-button type="primary" @click="submitBindingTr069">提交</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { BusinessFile, BusinessForm, Tr069Option } from "@/api/service/types";
+import { Position, UploadFilled } from "@element-plus/icons-vue";
+import { FormInstance, FormRules, UploadUserFile } from "element-plus";
+import {
+  addBusiness,
+  addBusinessFile,
+  bindingTr069,
+  bindingTr069Option,
+  editBusiness,
+  getBusinessFormById,
+} from "@/api/service";
+import { uploadApi } from "@/api/file";
+import { getTr069Option } from "@/api/tr069";
+import { Tr069DevTypeVO } from "@/api/tr069/types";
+import { serviceBindingDevTypePage } from "@/api/device-type";
+
+const total = ref<number>(0);
+const tableLoading = ref<boolean>(false);
+const tableData = ref<Tr069DevTypeVO[]>([]);
+const active = ref<number>(0);
+const route = useRoute();
+const resource = ref<Tr069Option[]>([]);
+const target = ref<number[]>([]);
+const formLoading = ref<boolean>(false);
+let servId: number = parseInt(<string>route.params.servId);
+const businessForm = ref<BusinessForm>({});
+const fileForm = ref<BusinessFile>({
+  fileType: "4",
+});
+const query = ref<PageQuery>({
+  pageNum: 1,
+  pageSize: 10,
+});
+const fileList = ref<UploadUserFile[]>([]);
+const businessFormRef = ref<FormInstance>();
+const rules = reactive<FormRules<BusinessForm>>({
+  servName: [{ required: true, message: "请填写业务名称", trigger: "blur" }],
+  servDisplayName: [
+    { required: true, message: "请填写业务显示名称", trigger: "blur" },
+  ],
+  servVerName: [{ required: true, message: "请填写业务版本", trigger: "blur" }],
+});
+/**
+ * 提交业务信息表单
+ */
+const submitBusiness = async () => {
+  await addBusiness(businessForm.value).then(({ data }) => {
+    businessForm.value.servId = data;
+  });
+};
+/**
+ * 上传插件文件
+ */
+const submitUpload = async () => {
+  const file = fileList.value[0].raw;
+  const dotIndex: any = file?.name.lastIndexOf(".");
+  if (dotIndex === -1) {
+    ElMessage.error("文件没有后缀，无法上传");
+    return;
+  }
+  const fileName = fileForm.value.fileName;
+  const fileType = fileForm.value.fileType;
+  fileForm.value.fileName = fileName + "." + file?.name.substring(dotIndex + 1);
+  await uploadApi(file, fileName, fileType).then(({ data }) => {
+    fileForm.value.fileUrl = data;
+    submitFileRecord();
+  });
+};
+/**
+ * 添加文件表单
+ */
+const submitFileRecord = async () => {
+  await addBusinessFile(fileForm.value).then(({ data }) => {
+    businessForm.value.pluginFileId = data;
+    submitBusiness();
+  });
+};
+/**
+ * 获取TR069所有数据模型option
+ */
+watch(active, () => {
+  if (active.value === 1) {
+    loadTr069Option();
+  }
+});
+const loadTr069Option = () => {
+  getTr069Option().then(({ data }) => {
+    resource.value = data;
+  });
+};
+const loadBindingTr069 = () => {
+  bindingTr069Option(businessForm.value.servId).then(({ data }) => {
+    target.value = data;
+  });
+};
+/**
+ * 查找表单数据
+ * @param formEl
+ */
+const loadFormData = () => {
+  formLoading.value = true;
+  getBusinessFormById(servId)
+    .then(({ data }) => {
+      businessForm.value = data;
+    })
+    .finally(() => {
+      formLoading.value = false;
+    });
+};
+const loadServiceDevTypePage = () => {
+  tableLoading.value = true;
+  serviceBindingDevTypePage(query.value, servId)
+    .then(({ data }) => {
+      total.value = data.total;
+      tableData.value = data.list;
+    })
+    .finally(() => {
+      tableLoading.value = false;
+    });
+};
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      if (fileList.value.length === 0) {
+        submitBusiness();
+      } else {
+        submitUpload();
+      }
+      active.value = 1;
+    }
+  });
+};
+const submitBindingTr069 = () => {
+  bindingTr069(target.value, businessForm.value.servId).then(() => {
+    ElMessage({
+      message: "操作成功",
+      duration: 1000,
+      type: "success",
+    });
+  });
+};
+const next = () => {
+  active.value = 1;
+  loadBindingTr069();
+};
+const lastStep = () => {
+  active.value = 0;
+};
+const updateForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      editBusiness(businessForm.value).then(() => {
+        ElMessage({
+          message: "操作成功",
+          duration: 1000,
+          type: "success",
+        });
+      });
+    }
+  });
+};
+onMounted(() => {
+  if (servId != 0) {
+    loadFormData();
+    loadServiceDevTypePage();
+  }
+});
+</script>
+
+<style scoped>
+:deep(.my-label) {
+  background: var(--el-color-white) !important;
+}
+</style>
+
+<style>
+.el-transfer-panel {
+  width: 300px !important;
+}
+</style>
diff --git a/src/views/resources/service/index.vue b/src/views/resources/service/index.vue
new file mode 100644
index 0000000..9a211fb
--- /dev/null
+++ b/src/views/resources/service/index.vue
@@ -0,0 +1,197 @@
+<template>
+  <div class="app-container">
+    <div class="search-container">
+      <div style="display: flex; justify-content: flex-end; margin-right: 10px">
+        <el-form>
+          <el-form-item>
+            <el-button :icon="Plus" type="primary" @click="skipBusinessForm(0)"
+              >新增</el-button
+            >
+            <el-button
+              type="primary"
+              plain
+              :icon="Refresh"
+              @click="loadBusiness"
+              >刷新</el-button
+            >
+            <el-button
+              :icon="Delete"
+              :disabled="multipleSelection.length === 0"
+              type="danger"
+              @click="handleDelete"
+              >删除</el-button
+            >
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+    <div class="any-table">
+      <el-table
+        :data="tableData"
+        v-loading="loading"
+        highlight-current-row
+        max-height="400"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column type="selection" width="55" />
+        <el-table-column label="业务名称" prop="servName" align="center">
+          <template #default="scope">
+            <el-button
+              type="primary"
+              link
+              @click="skipBusinessForm(scope.row.servId)"
+              >{{ scope.row.servName }}</el-button
+            >
+          </template>
+        </el-table-column>
+        <el-table-column label="业务版本" prop="servVerName" align="center" />
+        <el-table-column
+          label="业务显示名称"
+          prop="servDisplayName"
+          align="center"
+        />
+        <el-table-column label="业务描述" prop="servDesc" align="center" />
+        <el-table-column
+          label="上传时间"
+          prop="fileCreateTime"
+          align="center"
+        />
+        <el-table-column label="plugin文件名称" prop="fileName" align="center">
+          <template #default="scope">
+            <el-button
+              type="primary"
+              link
+              v-if="scope.row.fileId != undefined"
+              @click="handleDownload(scope.row.fileId)"
+              >{{ scope.row.fileName }}</el-button
+            >
+            <el-button
+              v-else
+              type="danger"
+              link
+              @click="openPluginFile(scope.row.servId)"
+            >
+              上传文件</el-button
+            >
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center">
+          <template #default="scope">
+            <el-popconfirm
+              title="确认删除该文件吗？"
+              width="200"
+              @confirm="deleteFile(scope.row)"
+            >
+              <template #reference>
+                <el-button
+                  type="danger"
+                  :disabled="scope.row.fileId === null"
+                  :icon="Delete"
+                  plain
+                  link
+                  >删除文件</el-button
+                >
+              </template>
+            </el-popconfirm>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-if="total > 0"
+        v-model:total="total"
+        v-model:page="query.pageNum"
+        v-model:limit="query.pageSize"
+        @pagination="loadBusiness"
+      />
+    </div>
+    <add-plugin-file ref="openPluginFileRef" @success="loadBusiness" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { Delete, Plus, Refresh } from "@element-plus/icons-vue";
+import { BusinessVO } from "@/api/service/types";
+import { businessPage, deleteBusiness, deleteFileAPI } from "@/api/service";
+import AddPluginFile from "@/views/resources/service/components/AddPluginFile.vue";
+import { downloadFileApi } from "@/api/file";
+import { downloadHook } from "@/utils";
+defineOptions({
+  name: "Service",
+  inheritAttrs: false,
+});
+const tableData = ref<BusinessVO[]>([]);
+const query = ref<PageQuery>({
+  pageNum: 1,
+  pageSize: 10,
+});
+const total = ref<number>(0);
+const loading = ref<boolean>(false);
+const router = useRouter();
+const multipleSelection = ref<BusinessVO[]>([]);
+const openPluginFileRef = ref();
+const handleSelectionChange = (val: BusinessVO[]) => {
+  multipleSelection.value = val;
+};
+const loadBusiness = () => {
+  loading.value = true;
+  businessPage(query.value)
+    .then(({ data }) => {
+      tableData.value = data.list;
+      total.value = data.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+const skipBusinessForm = (servId?: number) => {
+  router.push({
+    path: `/resources/service-form/${servId}`,
+  });
+};
+const handleDelete = () => {
+  let ids: number[] = [];
+  multipleSelection.value.forEach((obj) => {
+    ids.push(<number>obj.servId);
+  });
+  loading.value = true;
+  deleteBusiness(ids)
+    .then(() => {
+      ElMessage({
+        message: "操作成功",
+        duration: 1000,
+        type: "success",
+        onClose: () => {
+          loadBusiness();
+        },
+      });
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+const openPluginFile = (servId: number) => {
+  openPluginFileRef.value.open(servId);
+};
+const handleDownload = (fileId: number) => {
+  downloadFileApi(fileId).then((res) => {
+    downloadHook(res);
+  });
+};
+const deleteFile = (row: BusinessVO) => {
+  let servId = row.servId;
+  let fileId = row.fileId;
+  loading.value = true;
+  deleteFileAPI(fileId, servId)
+    .then(() => {
+      loadBusiness();
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+onMounted(() => {
+  loadBusiness();
+});
+</script>
+
+<style scoped></style>
diff --git a/src/views/resources/tr069/index.vue b/src/views/resources/tr069/index.vue
index 95cb9c8..6fd0924 100644
--- a/src/views/resources/tr069/index.vue
+++ b/src/views/resources/tr069/index.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="app-container">
-    <el-card shadow="never">
-      <template #header>
-        <div style="display: flex; justify-content: flex-end">
-          <div>
+    <div class="search-container">
+      <div style="display: flex; justify-content: flex-end;margin-right: 10px">
+        <el-form>
+          <el-form-item>
             <el-button type="primary" plain @click="goto(-999, -999)"
               ><i-ep-plus />新增</el-button
             >
@@ -12,86 +12,86 @@
             >
             <el-button @click="loadTr069Page" plain><i-ep-refresh /></el-button>
             <el-button type="danger" plain><i-ep-delete />删除</el-button>
-          </div>
-        </div>
-      </template>
-      <div class="any-table">
-        <el-table :data="tableData" v-loading="loading">
-          <el-table-column
-            label="TR-069数据模型版本名称"
-            align="center"
-            prop="tr069VerName"
-          >
-            <template #default="scope">
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+    <div class="any-table">
+      <el-table :data="tableData" v-loading="loading">
+        <el-table-column
+          label="TR-069数据模型版本名称"
+          align="center"
+          prop="tr069VerName"
+        >
+          <template #default="scope">
+            <el-button
+              type="primary"
+              @click="goto(scope.row.tr069VerId, scope.row.fileId)"
+              link
+              >{{ scope.row.tr069VerName }}</el-button
+            >
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="TR-069数据模型版本文件名称"
+          align="center"
+          prop="fileName"
+        >
+          <template #default="scope">
+            <el-button
+              type="primary"
+              link
+              @click="handleDownload(scope.row.fileId)"
+              >{{ scope.row.fileName }}
+            </el-button>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="TR-069数据模型版本描述"
+          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"
-                @click="goto(scope.row.tr069VerId, scope.row.fileId)"
                 link
-                >{{ scope.row.tr069VerName }}</el-button
+                @click="skipDevTypeSoftVerList(scope.row.tr069VerId)"
               >
-            </template>
-          </el-table-column>
-          <el-table-column
-            label="TR-069数据模型版本文件名称"
-            align="center"
-            prop="fileName"
-          >
-            <template #default="scope">
+                <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
-                @click="handleDownload(scope.row.fileId)"
-                >{{ scope.row.fileName }}
-              </el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            label="TR-069数据模型版本描述"
-            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"
+                @click="skipService(scope.row.tr069VerId)"
               >
-                <el-button
-                  type="primary"
-                  link
-                  @click="skipService(scope.row.tr069VerId)"
-                >
-                  <el-icon size="15"><View /></el-icon>
-                </el-button>
-              </el-tooltip>
-            </template>
-          </el-table-column>
-        </el-table>
-        <pagination
-          v-if="total > 0"
-          v-model:total="total"
-          v-model:page="query.pageNum"
-          v-model:limit="query.pageSize"
-          @pagination="loadTr069Page"
-        />
-      </div>
-    </el-card>
+                <el-icon size="15"><View /></el-icon>
+              </el-button>
+            </el-tooltip>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-if="total > 0"
+        v-model:total="total"
+        v-model:page="query.pageNum"
+        v-model:limit="query.pageSize"
+        @pagination="loadTr069Page"
+      />
+    </div>
     <add-tr069-file ref="addTr069FileRef" />
   </div>
 </template>