diff --git a/front/src/views/capacityOnTheShelf/Algorithm.vue b/front/src/views/capacityOnTheShelf/Algorithm.vue
index 1dc59bbb..78cf6caa 100644
--- a/front/src/views/capacityOnTheShelf/Algorithm.vue
+++ b/front/src/views/capacityOnTheShelf/Algorithm.vue
@@ -7,19 +7,17 @@
 -->
 <template>
   <div class="box">
-    <!-- <div class="header">能力上架申请</div> -->
+    <div class="header">能力上架申请</div>
     <div class="top">
       <div
         v-for="(nav, index) in navList"
         :key="nav"
-        :class="[index <= navList2.indexOf(showView) ? 'finish' : 'ff']"
+        :class="[index <= navList2.indexOf(showView) ? 'finish' : '']"
       >
-        <div class="wai">
-          <span class="bg-box">
-            <span>{{ index + 1 }}</span>
-          </span>
-          <span class="bg-name">{{ nav.name }}</span>
-        </div>
+        <span class="bg-box">
+          <span>{{ index + 1 }}</span>
+        </span>
+        <span>{{ nav.name }}</span>
         <div class="line" v-if="index !== navList.length - 1"></div>
       </div>
     </div>
@@ -81,10 +79,37 @@
         :required="required"
         :notFilled="notFilled"
       ></put-on-the-shelf>
-   
+      <!-- <algorithm-essential-information
+        v-if="showView === '基本信息' && refData.name"
+        :refData="refData"
+        :dataFrom="dataFrom"
+        :videoList="videoList"
+      ></algorithm-essential-information>
+      <algorithm-advantage
+        v-else-if="showView === '算法优势'"
+        :refData="refData"
+        :dataFrom="dataFrom"
+      ></algorithm-advantage>
+      <algorithm-scenarios
+        v-else-if="showView === '应用场景'"
+        :refData="refData"
+        :dataFrom="dataFrom"
+      ></algorithm-scenarios> -->
+      <!-- <algorithm-scenarios
+        v-else-if="showView === '应用场景'"
+        :refData="refData"
+        :dataFrom="dataFrom"
+      ></algorithm-scenarios> -->
+      <!-- <algorithm-deployment-use
+        v-else-if="showView === '部署与使用'"
+        :refData="refData"
+        :dataFrom="dataFrom"
+        :fileList="fileList"
+        :imgList="imgList"
+      ></algorithm-deployment-use> -->
     </div>
     <div class="btn" :class="showView === '基本信息' ? 'first' : ''">
-     
+      <button @click="close()">取消</button>
       <a-popconfirm
         v-if="
           showView == '算法优势' &&
@@ -98,7 +123,7 @@
         @confirm="changeSfys('上一步')"
         @cancel="cancel"
       >
-        <button  class="buzhou">上一步</button>
+        <button>上一步</button>
       </a-popconfirm>
       <button
         v-else-if="
@@ -107,7 +132,6 @@
             sfys[0].list.length
         "
         @click="changeSfys('上一步')"
-        class="buzhou"
       >
         上一步
       </button>
@@ -124,7 +148,7 @@
         @confirm="changeYycj('上一步')"
         @cancel="cancel"
       >
-        <button class="buzhou">上一步</button>
+        <button>上一步</button>
       </a-popconfirm>
       <button
         v-else-if="
@@ -133,11 +157,10 @@
             yycj[0].list.length
         "
         @click="changeYycj('上一步')"
-        class="buzhou"
       >
         上一步
       </button>
-      <button class="buzhou" v-else-if="showView !== '基本信息'" @click="back()">
+      <button v-else-if="showView !== '基本信息'" @click="back()">
         上一步
       </button>
       <a-popconfirm
@@ -154,9 +177,9 @@
         @confirm="changeBs('预览')"
         @cancel="cancel"
       >
-        <button class="buzhou">预览</button>
+        <button>预览</button>
       </a-popconfirm>
-      <button v-else-if="showView === '部署与使用'" @click="preview()" class="buzhou">
+      <button v-else-if="showView === '部署与使用'" @click="preview()">
         预览
       </button>
       <a-popconfirm
@@ -172,7 +195,7 @@
         @confirm="changeSfys('下一步')"
         @cancel="cancel"
       >
-        <button class="buzhou">下一步</button>
+        <button>下一步</button>
       </a-popconfirm>
       <button
         v-else-if="
@@ -181,7 +204,6 @@
             sfys[0].list.length
         "
         @click="changeSfys('下一步')"
-        class="buzhou"
       >
         下一步
       </button>
@@ -198,7 +220,7 @@
         @confirm="changeYycj('下一步')"
         @cancel="cancel"
       >
-        <button class="buzhou">下一步</button>
+        <button>下一步</button>
       </a-popconfirm>
       <button
         v-else-if="
@@ -207,11 +229,10 @@
             yycj[0].list.length
         "
         @click="changeYycj('下一步')"
-        class="buzhou"
       >
         下一步
       </button>
-      <button class="buzhou" v-else-if="showView !== '部署与使用'" @click="next()">
+      <button v-else-if="showView !== '部署与使用'" @click="next()">
         下一步
       </button>
       <a-popconfirm
@@ -228,697 +249,704 @@
         @confirm="changeBs('提交')"
         @cancel="cancel"
       >
-        <button class="buzhou">提交</button>
+        <button>提交</button>
       </a-popconfirm>
-      <button class="buzhou" v-else-if="服务商联系电话 === '部署与使用'" @click="submit()">
+      <button v-else-if="showView === '部署与使用'" @click="submit()">
         提交
       </button>
-       <button class="quxiao" @click="close()">取消</button>
     </div>
   </div>
 </template>
 <script setup>
-// import AlgorithmEssentialInformation from '@/views/capacityOnTheShelf/components/AlgorithmEssentialInformation.vue'
-// import AlgorithmAdvantage from '@/views/capacityOnTheShelf/components/AlgorithmAdvantage.vue'
-// import AlgorithmScenarios from '@/views/capacityOnTheShelf/components/AlgorithmScenarios.vue'
-import PutOnTheShelf from '@/views/capacityOnTheShelf/components/PutOnTheShelf.vue'
-// import AlgorithmDeploymentUse from '@/views/capacityOnTheShelf/components/AlgorithmDeploymentUse.vue'
-import { ref, onBeforeUnmount } from 'vue'
-import { useRouter } from 'vue-router'
-import { getCategoryTree } from '@/api/personalCenter'
-import { shangjiainsert, shangjiaapply } from '@/api/personalCenter'
-import {
-  getUser,
-  getUserInfo,
-  selectOne,
-  updateRes,
-  relaunch,
-} from '@/api/home'
-import { message } from 'ant-design-vue'
-import mybus from '@/myplugins/mybus'
-const router = useRouter()
-const showView = ref('基本信息')
-const sfys = ref([
-  {
-    name: '算法优势',
-    list: [
-      {
-        name: '算法优势名称',
-        field: 'name',
-        type: 'input',
-        note1: '',
-      },
-      {
-        name: '算法优势描述',
-        field: 'desc',
-        type: 'textArea',
-        note1: '',
-      },
-    ],
-  },
-])
-const yycj = ref([
-  {
-    name: '应用场景',
-    list: [
-      {
-        name: '应用场景名称',
-        field: 'name',
-        type: 'input',
-        note1: '',
-      },
-      {
-        name: '应用场景描述',
-        field: 'desc',
-        type: 'textArea',
-        note1: '',
-      },
-      {
-        name: '应用场景图片',
-        field: 'img',
-        type: 'image',
-        note1: '',
-      },
-    ],
-  },
-])
-const bs = ref([
-  {
-    name: '计费标准信息',
-    list: [
-      {
-        name: '计费方式',
-        field: 'type',
-        type: 'radio',
-        options: ['一次性买断', '按调用次数', '按并发路数', '按年计费'],
-        note1: '一次性买断',
-      },
-      {
-        name: '计费标准',
-        field: 'price',
-        type: 'input2',
-        // company: '元',
-        note1: '',
-      },
-      {
-        name: '计费标准描述',
-        field: 'desc',
-        type: 'textArea',
-        note1: '',
-      },
-    ],
-  },
-  {
-    name: '常见问题',
-    list: [
-      {
-        name: '问题',
-        field: 'question',
-        type: 'textArea',
-        note1: '',
-      },
-      {
-        name: '答复',
-        field: 'answer',
-        type: 'textArea',
-        note1: '',
-      },
-    ],
-  },
-])
-let shiyongshouce = ref({})
-const navList = ref([])
-const navList2 = ref([])
-const fileList = ref({})
-const packageList = ref({})
-const accessoryList = ref({})
-const imgList = ref({})
-const videoList = ref({})
-const data = ref({})
-const refData = ref({})
-const submitFlag = ref(true)
-const dataFrom = ref({
-  infoList: [
+  // import AlgorithmEssentialInformation from '@/views/capacityOnTheShelf/components/AlgorithmEssentialInformation.vue'
+  // import AlgorithmAdvantage from '@/views/capacityOnTheShelf/components/AlgorithmAdvantage.vue'
+  // import AlgorithmScenarios from '@/views/capacityOnTheShelf/components/AlgorithmScenarios.vue'
+  import PutOnTheShelf from '@/views/capacityOnTheShelf/components/PutOnTheShelf.vue'
+  // import AlgorithmDeploymentUse from '@/views/capacityOnTheShelf/components/AlgorithmDeploymentUse.vue'
+  import { ref, onBeforeUnmount } from 'vue'
+  import { useRouter } from 'vue-router'
+  import { getCategoryTree } from '@/api/personalCenter'
+  import { shangjiainsert, shangjiaapply } from '@/api/personalCenter'
+  import {
+    getUser,
+    getUserInfo,
+    selectOne,
+    updateRes,
+    relaunch,
+  } from '@/api/home'
+  import { message } from 'ant-design-vue'
+  import mybus from '@/myplugins/mybus'
+  const router = useRouter()
+  const showView = ref('基本信息')
+  const sfys = ref([
     {
-      attrType: '组件类型',
-      attrValue: '智能算法',
-      delFlag: 0,
+      name: '算法优势',
+      list: [
+        {
+          name: '算法优势名称',
+          field: 'name',
+          type: 'input',
+          note1: '',
+        },
+        {
+          name: '算法优势描述',
+          field: 'desc',
+          type: 'textArea',
+          note1: '',
+        },
+      ],
     },
-  ],
-  delFlag: 0,
-  type: '组件服务',
-  deptId: '',
-})
-const required = ref([
-  '归属部门',
-  '部门联系人',
-  '部门联系人电话',
-  '应用领域',
-  '共享条件',
-  '算法名称',
-  '算法描述',
-  '图层名称',
-  '图层描述',
-  '组件名称',
-  '组件描述',
-  '组件地址',
-  '服务地址',
-  '服务接口',
-  '接口请求方式',
-  '算法类别',
-])
-const notFilled = ref([])
-getUser().then((res) => {
-  dataFrom.value.deptId = res.data.data.deptId
-})
-const close = () => {
-  window.close()
-}
-const back = () => {
-  navList.value.forEach((val, index) => {
-    if (val.key === showView.value && index > 0) {
-      showView.value = navList2.value[index - 1]
-      refData.value = data.value.filter(
-        (item) => item.name === showView.value
-      )[0]
-      console.log('表单数据=============>', dataFrom.value)
-    }
+  ])
+  const yycj = ref([
+    {
+      name: '应用场景',
+      list: [
+        {
+          name: '应用场景名称',
+          field: 'name',
+          type: 'input',
+          note1: '',
+        },
+        {
+          name: '应用场景描述',
+          field: 'desc',
+          type: 'textArea',
+          note1: '',
+        },
+        {
+          name: '应用场景图片',
+          field: 'img',
+          type: 'image',
+          note1: '',
+        },
+      ],
+    },
+  ])
+  const bs = ref([
+    {
+      name: '计费标准信息',
+      list: [
+        {
+          name: '计费方式',
+          field: 'type',
+          type: 'radio',
+          options: ['一次性买断', '按调用次数', '按并发路数', '按年计费'],
+          note1: '一次性买断',
+        },
+        {
+          name: '计费标准',
+          field: 'price',
+          type: 'input2',
+          // company: '元',
+          note1: '',
+        },
+        {
+          name: '计费标准描述',
+          field: 'desc',
+          type: 'textArea',
+          note1: '',
+        },
+      ],
+    },
+    {
+      name: '常见问题',
+      list: [
+        {
+          name: '问题',
+          field: 'question',
+          type: 'textArea',
+          note1: '',
+        },
+        {
+          name: '答复',
+          field: 'answer',
+          type: 'textArea',
+          note1: '',
+        },
+      ],
+    },
+  ])
+  let shiyongshouce = ref({})
+  const navList = ref([])
+  const navList2 = ref([])
+  const fileList = ref({})
+  const packageList = ref({})
+  const accessoryList = ref({})
+  const imgList = ref({})
+  const videoList = ref({})
+  const data = ref({})
+  const refData = ref({})
+  const submitFlag = ref(true)
+  const dataFrom = ref({
+    infoList: [
+      {
+        attrType: '组件类型',
+        attrValue: '智能算法',
+        delFlag: 0,
+      },
+    ],
+    delFlag: 0,
+    type: '组件服务',
+    deptId: '',
   })
-}
-const next = () => {
-  notFilled.value = []
-  console.log(dataFrom.value, 'dataFrom.value.name')
-  if (!dataFrom.value.name) {
-    notFilled.value.push('算法名称')
+  const required = ref([
+    '归属部门',
+    '部门联系人',
+    '部门联系人电话',
+    '应用领域',
+    '共享条件',
+    '算法名称',
+    '算法描述',
+    '图层名称',
+    '图层描述',
+    '组件名称',
+    '组件描述',
+    '组件地址',
+    '服务地址',
+    '服务接口',
+    '接口请求方式',
+    '算法类别',
+  ])
+  const notFilled = ref([])
+  getUser().then((res) => {
+    dataFrom.value.deptId = res.data.data.deptId
+  })
+  const close = () => {
+    window.close()
   }
-  if (!dataFrom.value.description) {
-    notFilled.value.push('算法描述')
-  }
-  if (!dataFrom.value.shareCondition) {
-    notFilled.value.push('共享条件')
-  }
-  if (!dataFrom.value.deptId) {
-    notFilled.value.push('归属部门')
-  }
-  if (!dataFrom.value.deptContacts) {
-    notFilled.value.push('部门联系人')
-  }
-  if (!dataFrom.value.deptPhone) {
-    notFilled.value.push('部门联系人电话')
-  }
-  if (
-    !dataFrom.value.infoList.filter((val) => val.attrType === '算法类别')[0] ||
-    !dataFrom.value.infoList.filter((val) => val.attrType === '算法类别')[0]
-      .attrValue
-  ) {
-    notFilled.value.push('算法类别')
-  }
-  if (
-    !dataFrom.value.infoList.filter((val) => val.attrType === '应用领域')[0] ||
-    !dataFrom.value.infoList.filter((val) => val.attrType === '应用领域')[0]
-      .attrValue
-  ) {
-    console.log('应用领域==========>', dataFrom.value.infoList)
-    notFilled.value.push('应用领域')
-  }
-  if (notFilled.value.length > 0) {
-    message.warning('请填写必填字段')
-    console.log(notFilled.value)
-  } else {
-    let i = -1
+  const back = () => {
     navList.value.forEach((val, index) => {
-      if (val.key === showView.value && index < navList.value.length - 1) {
-        i = index + 1
+      if (val.key === showView.value && index > 0) {
+        showView.value = navList2.value[index - 1]
+        refData.value = data.value.filter(
+          (item) => item.name === showView.value
+        )[0]
+        console.log('表单数据=============>', dataFrom.value)
       }
     })
-    if (i !== -1) {
-      showView.value = navList2.value[i]
-      refData.value = data.value.filter(
-        (item) => item.name === showView.value
-      )[0]
-      console.log('表单数据=============>', dataFrom.value, refData.value)
-    }
   }
-}
-// 预览
-const preview = () => {
-  notFilled.value = []
-  console.log(dataFrom.value, 'dataFrom.value.name')
-  if (
-    dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0] &&
-    dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0]
-      .attrValue == '调用接口'
-  ) {
+  const next = () => {
+    notFilled.value = []
+    console.log(dataFrom.value, 'dataFrom.value.name')
+    if (!dataFrom.value.name) {
+      notFilled.value.push('算法名称')
+    }
+    if (!dataFrom.value.description) {
+      notFilled.value.push('算法描述')
+    }
+    if (!dataFrom.value.shareCondition) {
+      notFilled.value.push('共享条件')
+    }
+    if (!dataFrom.value.deptId) {
+      notFilled.value.push('归属部门')
+    }
+    if (!dataFrom.value.deptContacts) {
+      notFilled.value.push('部门联系人')
+    }
+    if (!dataFrom.value.deptPhone) {
+      notFilled.value.push('部门联系人电话')
+    }
     if (
       !dataFrom.value.infoList.filter(
-        (val) => val.attrType === '服务接口'
+        (val) => val.attrType === '算法类别'
       )[0] ||
-      !dataFrom.value.infoList.filter((val) => val.attrType === '服务接口')[0]
+      !dataFrom.value.infoList.filter((val) => val.attrType === '算法类别')[0]
         .attrValue
     ) {
-      notFilled.value.push('服务接口')
+      notFilled.value.push('算法类别')
     }
-    if (!dataFrom.value.apiMethodType) {
-      notFilled.value.push('接口请求方式')
-    }
-  }
-  if (notFilled.value.length > 0) {
-    message.warning('请填写必填字段')
-    console.log(notFilled.value)
-  } else {
-    dataFrom.value.infoList = dataFrom.value.infoList.filter(
-      (item) => item.attrValue !== ''
-    )
-    console.log('预览==============>', dataFrom.value)
-    window.sessionStorage.setItem('preview', JSON.stringify(dataFrom.value))
-    const newpage = router.resolve({
-      path: '/details',
-    })
-    window.open(newpage.href, '_blank')
-  }
-}
-const submit = () => {
-  notFilled.value = []
-  console.log(dataFrom.value, 'dataFrom.value.name')
-  if (
-    dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0] &&
-    dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0]
-      .attrValue == '调用接口'
-  ) {
     if (
       !dataFrom.value.infoList.filter(
-        (val) => val.attrType === '服务接口'
+        (val) => val.attrType === '应用领域'
       )[0] ||
-      !dataFrom.value.infoList.filter((val) => val.attrType === '服务接口')[0]
+      !dataFrom.value.infoList.filter((val) => val.attrType === '应用领域')[0]
         .attrValue
     ) {
-      notFilled.value.push('服务接口')
+      console.log('应用领域==========>', dataFrom.value.infoList)
+      notFilled.value.push('应用领域')
     }
-    if (!dataFrom.value.apiMethodType) {
-      notFilled.value.push('接口请求方式')
+    if (notFilled.value.length > 0) {
+      message.warning('请填写必填字段')
+      console.log(notFilled.value)
+    } else {
+      let i = -1
+      navList.value.forEach((val, index) => {
+        if (val.key === showView.value && index < navList.value.length - 1) {
+          i = index + 1
+        }
+      })
+      if (i !== -1) {
+        showView.value = navList2.value[i]
+        refData.value = data.value.filter(
+          (item) => item.name === showView.value
+        )[0]
+        console.log('表单数据=============>', dataFrom.value, refData.value)
+      }
     }
   }
-  if (notFilled.value.length > 0) {
-    message.warning('请填写必填字段')
-    console.log(notFilled.value)
-  } else {
-    console.log('提交数据=============>', dataFrom.value)
-    if (submitFlag.value) {
-      submitFlag.value = false
+  // 预览
+  const preview = () => {
+    notFilled.value = []
+    console.log(dataFrom.value, 'dataFrom.value.name')
+    if (
+      dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0] &&
+      dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0]
+        .attrValue == '调用接口'
+    ) {
+      if (
+        !dataFrom.value.infoList.filter(
+          (val) => val.attrType === '服务接口'
+        )[0] ||
+        !dataFrom.value.infoList.filter((val) => val.attrType === '服务接口')[0]
+          .attrValue
+      ) {
+        notFilled.value.push('服务接口')
+      }
+      if (!dataFrom.value.apiMethodType) {
+        notFilled.value.push('接口请求方式')
+      }
+    }
+    if (notFilled.value.length > 0) {
+      message.warning('请填写必填字段')
+      console.log(notFilled.value)
+    } else {
       dataFrom.value.infoList = dataFrom.value.infoList.filter(
         (item) => item.attrValue !== ''
       )
-      if (resourceId) {
-        delete dataFrom.value.createDate
-        delete dataFrom.value.updateDate
-        dataFrom.value.infoList.map((del) => {
-          delete del.createDate
-          delete del.updateDate
-        })
-        updateRes(dataFrom.value).then((upres) => {
-          if (upres.data.code == 0) {
-            relaunch({ data: dataFrom.value, taskId: taskId }).then((res) => {
-              console.log('驳回================>', res)
-              if (res.data.code == 0) {
-                message.success('重新发起流程成功！')
-                submitFlag.value = true
-                window.setTimeout(() => {
-                  window.close()
-                }, 1000)
-              } else {
-                message.error('重新发起流程失败！')
-                submitFlag.value = true
-              }
-            })
-          } else {
-            message.error('数据更新失败！')
-            submitFlag.value = true
-          }
-        })
-      } else {
-        shangjiainsert(dataFrom.value).then((res) => {
-          const instanceId = res.data.data
-          dataFrom.value.id = res.data.data
-          getUser().then((res6) => {
-            getUserInfo(res6.data.data.id).then((res2) => {
-              const deptId = dataFrom.value.deptId
-              const userId = res2.data.data.id
-              const userName = res2.data.data.realName
-              const params = {
-                instanceId: instanceId,
-                deptId: deptId,
-                userId: userId,
-                userName: userName,
-                resourceDTO: [dataFrom.value],
-              }
-              shangjiaapply(params).then((res3) => {
-                console.log('res3', res3)
-                if (res3.data.code == 0) {
-                  message.success('上架申请提交成功，请注意查看消息通知！')
+      console.log('预览==============>', dataFrom.value)
+      window.sessionStorage.setItem('preview', JSON.stringify(dataFrom.value))
+      const newpage = router.resolve({
+        path: '/details',
+      })
+      window.open(newpage.href, '_blank')
+    }
+  }
+  const submit = () => {
+    notFilled.value = []
+    console.log(dataFrom.value, 'dataFrom.value.name')
+    if (
+      dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0] &&
+      dataFrom.value.infoList.filter((val) => val.attrType === '使用方式')[0]
+        .attrValue == '调用接口'
+    ) {
+      if (
+        !dataFrom.value.infoList.filter(
+          (val) => val.attrType === '服务接口'
+        )[0] ||
+        !dataFrom.value.infoList.filter((val) => val.attrType === '服务接口')[0]
+          .attrValue
+      ) {
+        notFilled.value.push('服务接口')
+      }
+      if (!dataFrom.value.apiMethodType) {
+        notFilled.value.push('接口请求方式')
+      }
+    }
+    if (notFilled.value.length > 0) {
+      message.warning('请填写必填字段')
+      console.log(notFilled.value)
+    } else {
+      console.log('提交数据=============>', dataFrom.value)
+      if (submitFlag.value) {
+        submitFlag.value = false
+        dataFrom.value.infoList = dataFrom.value.infoList.filter(
+          (item) => item.attrValue !== ''
+        )
+        if (resourceId) {
+          delete dataFrom.value.createDate
+          delete dataFrom.value.updateDate
+          dataFrom.value.infoList.map((del) => {
+            delete del.createDate
+            delete del.updateDate
+          })
+          updateRes(dataFrom.value).then((upres) => {
+            if (upres.data.code == 0) {
+              relaunch({ data: dataFrom.value, taskId: taskId }).then((res) => {
+                console.log('驳回================>', res)
+                if (res.data.code == 0) {
+                  message.success('重新发起流程成功！')
+                  submitFlag.value = true
                   window.setTimeout(() => {
                     window.close()
-                    submitFlag.value = true
                   }, 1000)
+                } else {
+                  message.error('重新发起流程失败！')
+                  submitFlag.value = true
                 }
               })
+            } else {
+              message.error('数据更新失败！')
+              submitFlag.value = true
+            }
+          })
+        } else {
+          shangjiainsert(dataFrom.value).then((res) => {
+            const instanceId = res.data.data
+            dataFrom.value.id = res.data.data
+            getUser().then((res6) => {
+              getUserInfo(res6.data.data.id).then((res2) => {
+                const deptId = dataFrom.value.deptId
+                const userId = res2.data.data.id
+                const userName = res2.data.data.realName
+                const params = {
+                  instanceId: instanceId,
+                  deptId: deptId,
+                  userId: userId,
+                  userName: userName,
+                  resourceDTO: [dataFrom.value],
+                }
+                shangjiaapply(params).then((res3) => {
+                  console.log('res3', res3)
+                  if (res3.data.code == 0) {
+                    message.success('上架申请提交成功，请注意查看消息通知！')
+                    window.setTimeout(() => {
+                      window.close()
+                      submitFlag.value = true
+                    }, 1000)
+                  }
+                })
+              })
             })
           })
-        })
+        }
       }
     }
   }
-}
-const init = () => {
-  getCategoryTree().then((res) => {
-    // console.clear()
-    res.data.data = res.data.data
-      .filter((item) => item.name === '组件服务一')[0]
-      .children.filter((item) => item.name === '智能算法')[0]
-    navList.value = []
-    navList2.value = []
-    res.data.data.children.forEach((val) => {
-      // console.log('val================>', val, echoData.value)
-      navList.value.push({
-        name: val.name,
-        key: val.name,
-      })
-      navList2.value.push(val.name)
-      if (val.name === '部署与使用') {
-        console.log(val, '部署与使用')
-        val.children.forEach((valChild) => {
-          if (valChild.name === '使用方式') {
-            valChild.children.forEach((valChilds) => {
-              if (valChilds.name === '使用方式') {
-                valChilds.note1 = '调用接口'
-              }
-            })
-          }
+  const init = () => {
+    getCategoryTree().then((res) => {
+      // console.clear()
+      res.data.data = res.data.data
+        .filter((item) => item.name === '组件服务一')[0]
+        .children.filter((item) => item.name === '智能算法')[0]
+      navList.value = []
+      navList2.value = []
+      res.data.data.children.forEach((val) => {
+        // console.log('val================>', val, echoData.value)
+        navList.value.push({
+          name: val.name,
+          key: val.name,
         })
-      }
-      // 回填数据
-      if (resourceId) {
-        val.children.map((item) => {
-          if (item.children.length > 0) {
-            item.children.map((child) => {
-              switch (child.name) {
-                case '算法名称':
-                  child.note1 = echoData.value.name
-                  break
-                case '算法描述':
-                  child.note1 = echoData.value.description
-                  break
-                case '共享条件':
-                  child.note1 = echoData.value.shareCondition
-                  break
-                case '归属部门':
-                  child.note1 = echoData.value.deptId
-                  break
-                case '部门联系人':
-                  child.note1 = echoData.value.deptContacts
-                  break
-                case '部门联系人电话':
-                  child.note1 = echoData.value.deptPhone
-                  break
-                case '接口请求方式':
-                  child.note1 = echoData.value.apiMethodType
-                  break
-                case '应用领域':
-                  if (
-                    echoData.value.infoList &&
-                    echoData.value.infoList.filter(
-                      (fil) => fil.attrType == child.name
-                    )[0]
-                  ) {
-                    child.note1 = echoData.value.infoList.filter(
-                      (fil) => fil.attrType == child.name
-                    )[0].attrValue
-                    child.note2 = echoData.value.infoList
-                      .filter((fil) => fil.attrType == child.name)[0]
-                      .attrValue.split(';')
-                  }
-                  break
-                case '算法介绍视频':
-                  if (
-                    echoData.value.infoList &&
-                    echoData.value.infoList.filter(
-                      (fil) => fil.attrType == child.name
-                    )[0]
-                  ) {
-                    videoList.value = [
-                      {
-                        uid: echoData.value.infoList.filter(
-                          (fil) => fil.attrType == child.name
-                        )[0].id,
-                        name:
-                          echoData.value.infoList.filter(
+        navList2.value.push(val.name)
+        if (val.name === '部署与使用') {
+          console.log(val, '部署与使用')
+          val.children.forEach((valChild) => {
+            if (valChild.name === '使用方式') {
+              valChild.children.forEach((valChilds) => {
+                if (valChilds.name === '使用方式') {
+                  valChilds.note1 = '调用接口'
+                }
+              })
+            }
+          })
+        }
+        // 回填数据
+        if (resourceId) {
+          val.children.map((item) => {
+            if (item.children.length > 0) {
+              item.children.map((child) => {
+                switch (child.name) {
+                  case '算法名称':
+                    child.note1 = echoData.value.name
+                    break
+                  case '算法描述':
+                    child.note1 = echoData.value.description
+                    break
+                  case '共享条件':
+                    child.note1 = echoData.value.shareCondition
+                    break
+                  case '归属部门':
+                    child.note1 = echoData.value.deptId
+                    break
+                  case '部门联系人':
+                    child.note1 = echoData.value.deptContacts
+                    break
+                  case '部门联系人电话':
+                    child.note1 = echoData.value.deptPhone
+                    break
+                  case '接口请求方式':
+                    child.note1 = echoData.value.apiMethodType
+                    break
+                  case '应用领域':
+                    if (
+                      echoData.value.infoList &&
+                      echoData.value.infoList.filter(
+                        (fil) => fil.attrType == child.name
+                      )[0]
+                    ) {
+                      child.note1 = echoData.value.infoList.filter(
+                        (fil) => fil.attrType == child.name
+                      )[0].attrValue
+                      child.note2 = echoData.value.infoList
+                        .filter((fil) => fil.attrType == child.name)[0]
+                        .attrValue.split(';')
+                    }
+                    break
+                  case '算法介绍视频':
+                    if (
+                      echoData.value.infoList &&
+                      echoData.value.infoList.filter(
+                        (fil) => fil.attrType == child.name
+                      )[0]
+                    ) {
+                      videoList.value = [
+                        {
+                          uid: echoData.value.infoList.filter(
                             (fil) => fil.attrType == child.name
-                          )[0].note3 || '--',
-                        status: 'done',
-                        url: echoData.value.infoList.filter(
-                          (fil) => fil.attrType == child.name
-                        )[0].attrValue,
-                        thumbUrl: echoData.value.infoList.filter(
-                          (fil) => fil.attrType == child.name
-                        )[0].attrValue,
-                      },
-                    ]
-                  }
-                  break
-                default:
-                  if (
-                    echoData.value.infoList &&
-                    echoData.value.infoList.filter(
-                      (fil) => fil.attrType == child.name
-                    )[0]
-                  ) {
-                    child.note1 = echoData.value.infoList.filter(
-                      (fil) => fil.attrType == child.name
-                    )[0].attrValue
-                  }
-                  break
-              }
-            })
-          }
-          console.log('item================>', item, echoData.value)
-        })
-      }
+                          )[0].id,
+                          name:
+                            echoData.value.infoList.filter(
+                              (fil) => fil.attrType == child.name
+                            )[0].note3 || '--',
+                          status: 'done',
+                          url: echoData.value.infoList.filter(
+                            (fil) => fil.attrType == child.name
+                          )[0].attrValue,
+                          thumbUrl: echoData.value.infoList.filter(
+                            (fil) => fil.attrType == child.name
+                          )[0].attrValue,
+                        },
+                      ]
+                    }
+                    break
+                  default:
+                    if (
+                      echoData.value.infoList &&
+                      echoData.value.infoList.filter(
+                        (fil) => fil.attrType == child.name
+                      )[0]
+                    ) {
+                      child.note1 = echoData.value.infoList.filter(
+                        (fil) => fil.attrType == child.name
+                      )[0].attrValue
+                    }
+                    break
+                }
+              })
+            }
+            console.log('item================>', item, echoData.value)
+          })
+        }
+      })
+      data.value = res.data.data.children
+      refData.value = data.value.filter(
+        (item) => item.name === showView.value
+      )[0]
+      console.log('所有编目结构==============>', data.value)
     })
-    data.value = res.data.data.children
-    refData.value = data.value.filter((item) => item.name === showView.value)[0]
-    console.log('所有编目结构==============>', data.value)
-  })
-}
-const resourceId = router.currentRoute.value.query.id
-const taskId = router.currentRoute.value.query.taskId
-const echoData = ref({})
-if (resourceId) {
-  // 回显数据
-  selectOne(resourceId).then((res) => {
-    echoData.value = res.data.data
-    dataFrom.value = echoData.value
+  }
+  const resourceId = router.currentRoute.value.query.id
+  const taskId = router.currentRoute.value.query.taskId
+  const echoData = ref({})
+  if (resourceId) {
+    // 回显数据
+    selectOne(resourceId).then((res) => {
+      echoData.value = res.data.data
+      dataFrom.value = echoData.value
+      init()
+      // console.log('驳回修改===================>', echoData.value)
+    })
+  } else {
     init()
-    // console.log('驳回修改===================>', echoData.value)
+  }
+  // 特殊字段处理
+  const refPutOnTheShelf = ref(null)
+  const changeSfys = (type) => {
+    console.log(refPutOnTheShelf, sfys.value)
+    refPutOnTheShelf.value.add('算法优势', true, type)
+  }
+  const changeYycj = (type) => {
+    console.log(refPutOnTheShelf)
+    refPutOnTheShelf.value.add('应用场景', true, type)
+  }
+  const changeBs = (type) => {
+    console.log(refPutOnTheShelf)
+    refPutOnTheShelf.value.add('计费标准信息', true)
+    refPutOnTheShelf.value.add('常见问题', true, type)
+  }
+  mybus.on('chageDataFrom', (obj) => {
+    if (obj.attrType == '技术文档' && obj.attrValue != null) {
+      shiyongshouce.value = obj
+    }
+    dataFrom.value.infoList = dataFrom.value.infoList.filter(
+      (item) => item.attrType !== obj.attrType
+    )
+    if (obj.attrValue == [] || obj.attrValue == '[]' || obj.attrValue == null) {
+      obj.attrValue = ''
+    }
+    dataFrom.value.infoList.push(obj)
+    if (shiyongshouce.value.attrValue) {
+      dataFrom.value.infoList.map((syscitem, syscindex) => {
+        if (syscitem.attrType == '技术文档') {
+          dataFrom.value.infoList[syscindex] = shiyongshouce.value
+        }
+      })
+    }
+    console.log('数据变更=================》', obj, dataFrom.value.infoList)
+  })
+  mybus.on('chageFileList', (obj) => {
+    fileList.value = obj
+  })
+  mybus.on('chagePackageList', (obj) => {
+    packageList.value = obj
+  })
+  mybus.on('chageAccessory', (obj) => {
+    accessoryList.value = obj
+  })
+  mybus.on('chageImgList', (obj) => {
+    imgList.value = obj
+  })
+  mybus.on('chageVideoList', (obj) => {
+    videoList.value = obj
+  })
+  //datafrom外面数据
+  mybus.on('chageDataFromDwon', (obj) => {
+    switch (obj.attrType) {
+      case '算法名称':
+        dataFrom.value.name = obj.attrValue
+        break
+      case '算法描述':
+        dataFrom.value.description = obj.attrValue
+        break
+      case '共享条件':
+        dataFrom.value.shareCondition = obj.attrValue
+        break
+      case '共享类型':
+        dataFrom.value.shareType = obj.attrValue
+        break
+      case '服务接口':
+        dataFrom.value.apiUrl = obj.attrValue
+        break
+      case '接口请求方式':
+        dataFrom.value.apiMethodType = obj.attrValue
+        break
+      case '归属部门':
+        dataFrom.value.deptId = obj.attrValue
+        if (obj.attrValueTwo) {
+          dataFrom.value.deptName = obj.attrValueTwo.label
+        }
+        break
+      case '部门联系人':
+        dataFrom.value.deptContacts = obj.attrValue
+        break
+      case '部门联系人电话':
+        dataFrom.value.deptPhone = obj.attrValue
+        break
+    }
+    // console.log('dataFrom.value', dataFrom.value)
+  })
+  onBeforeUnmount(() => {
+    mybus.off('chageDataFrom')
+    mybus.off('chageFileList')
+    mybus.off('chageImgList')
+    mybus.off('chageDataFromDwon')
+    mybus.off('chageVideoList')
+    mybus.off('chagePackageList')
+    mybus.off('chageAccessory')
   })
-} else {
-  init()
-}
-// 特殊字段处理
-const refPutOnTheShelf = ref(null)
-const changeSfys = (type) => {
-  console.log(refPutOnTheShelf, sfys.value)
-  refPutOnTheShelf.value.add('算法优势', true, type)
-}
-const changeYycj = (type) => {
-  console.log(refPutOnTheShelf)
-  refPutOnTheShelf.value.add('应用场景', true, type)
-}
-const changeBs = (type) => {
-  console.log(refPutOnTheShelf)
-  refPutOnTheShelf.value.add('计费标准信息', true)
-  refPutOnTheShelf.value.add('常见问题', true, type)
-}
-mybus.on('chageDataFrom', (obj) => {
-  if (obj.attrType == '技术文档' && obj.attrValue != null) {
-    shiyongshouce.value = obj
-  }
-  dataFrom.value.infoList = dataFrom.value.infoList.filter(
-    (item) => item.attrType !== obj.attrType
-  )
-  if (obj.attrValue == [] || obj.attrValue == '[]' || obj.attrValue == null) {
-    obj.attrValue = ''
-  }
-  dataFrom.value.infoList.push(obj)
-  if (shiyongshouce.value.attrValue) {
-    dataFrom.value.infoList.map((syscitem, syscindex) => {
-      if (syscitem.attrType == '技术文档') {
-        dataFrom.value.infoList[syscindex] = shiyongshouce.value
-      }
-    })
-  }
-  console.log('数据变更=================》', obj, dataFrom.value.infoList)
-})
-mybus.on('chageFileList', (obj) => {
-  fileList.value = obj
-})
-mybus.on('chagePackageList', (obj) => {
-  packageList.value = obj
-})
-mybus.on('chageAccessory', (obj) => {
-  accessoryList.value = obj
-})
-mybus.on('chageImgList', (obj) => {
-  imgList.value = obj
-})
-mybus.on('chageVideoList', (obj) => {
-  videoList.value = obj
-})
-//datafrom外面数据
-mybus.on('chageDataFromDwon', (obj) => {
-  switch (obj.attrType) {
-    case '算法名称':
-      dataFrom.value.name = obj.attrValue
-      break
-    case '算法描述':
-      dataFrom.value.description = obj.attrValue
-      break
-    case '共享条件':
-      dataFrom.value.shareCondition = obj.attrValue
-      break
-    case '共享类型':
-      dataFrom.value.shareType = obj.attrValue
-      break
-    case '服务接口':
-      dataFrom.value.apiUrl = obj.attrValue
-      break
-    case '接口请求方式':
-      dataFrom.value.apiMethodType = obj.attrValue
-      break
-    case '归属部门':
-      dataFrom.value.deptId = obj.attrValue
-      if (obj.attrValueTwo) {
-        dataFrom.value.deptName = obj.attrValueTwo.label
-      }
-      break
-    case '部门联系人':
-      dataFrom.value.deptContacts = obj.attrValue
-      break
-    case '部门联系人电话':
-      dataFrom.value.deptPhone = obj.attrValue
-      break
-  }
-  // console.log('dataFrom.value', dataFrom.value)
-})
-onBeforeUnmount(() => {
-  mybus.off('chageDataFrom')
-  mybus.off('chageFileList')
-  mybus.off('chageImgList')
-  mybus.off('chageDataFromDwon')
-  mybus.off('chageVideoList')
-  mybus.off('chagePackageList')
-  mybus.off('chageAccessory')
-})
 </script>
 <style lang="less" scoped>
-.box {
-  position: relative;
-  top: 0.64rem;
-  // margin: 0.15rem 3rem;
-  padding: 0.1rem;
-  background: #fff;
-  .header {
-    font-size: 0.28rem;
-    font-weight: 600;
-  }
-  .vue-box {
-    padding: 0 1rem;
-  }
-  .top {
-    font-size: 16px;
-    margin: 0.32px 0.4px 0;
-    padding: 24px 24pxs;
-    display: flex;
-    justify-content: center;
-    .ff {
-      color: #b3b3b3;
-      display: inline-flex;
-      justify-content: center;
-      align-items: center;
-      .wai {
-        margin-top: 14px;
-        .bg-box {
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          width: 32px;
-          height: 32px;
-          border-radius: 50%;
-          // border: 0.01rem solid rgb(214, 214, 214);
-          margin: 0px 16px;
-          transition: all 0.3s ease;
-          span {
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            width: 32px;
-            height: 32px;
-            border-radius: 50%;
-            border: 1px solid #d9d9d9;
-          }
-        }
-        .bg-name {
-          color: #b3b3b3;
-        }
-      }
-      .line {
-        // margin-left: 16px;
-        width: 326px;
-        height: 2px;
-        background: #d9d9d9;
-      }
+  .box {
+    position: relative;
+    top: 0.64rem;
+    margin: 0.15rem 4rem;
+    padding: 0.1rem;
+    background: #fff;
+    .header {
+      font-size: 0.28rem;
+      font-weight: 600;
     }
-    .finish {
-      color: #fff;
-      display: inline-flex;
-      justify-content: center;
-      align-items: center;
-      .wai {
-        margin-top: 14px;
+    .vue-box {
+      padding: 0 1rem;
+    }
+    .top {
+      margin: 0.1rem 0.2rem 0;
+      padding: 0.15rem 0.3rem;
+      background: #edf4fc;
+      display: flex;
+      justify-content: space-between;
+      div {
+        font-size: 0.18rem;
+        color: #999;
+        display: flex;
+        justify-content: center;
+        align-items: center;
         .bg-box {
           display: flex;
           justify-content: center;
           align-items: center;
-          width: 32px;
-          height: 32px;
+          width: 0.45rem;
+          height: 0.45rem;
           border-radius: 50%;
-          // border: 0.01rem solid rgb(214, 214, 214);
-          margin: 0px 16px;
+          border: 0.01rem solid rgb(214, 214, 214);
+          margin-right: 0.1rem;
           transition: all 0.3s ease;
           span {
-            background: #0058e1;
             display: flex;
             justify-content: center;
             align-items: center;
-            width: 32px;
-            height: 32px;
+            width: 0.3rem;
+            height: 0.3rem;
             border-radius: 50%;
-            border: 1px solid solid #0058e1;
+            border: 0.01rem solid #999;
           }
         }
-        .bg-name {
-          color: #212121;
-          font-weight: bold;
+        .line {
+          margin-left: 0.1rem;
+          width: 1.3rem;
+          height: 0.01rem;
+          background: #999;
         }
       }
-      .line {
-        // margin-left: 16px;
-        width: 326px;
-        height: 2px;
-        background: #0058e1;
+      .finish {
+        color: #0087ff;
+        .bg-box {
+          background: #9ccefa;
+          color: #fff;
+          border: 0.01rem solid #9ccefa;
+          span {
+            background: #0087ff;
+            border: 0.01rem solid #0087ff;
+          }
+        }
+        .line {
+          background: #0087ff;
+        }
+      }
+      .btn {
+        display: flex;
+        justify-content: space-around;
+        padding: 0.1rem 3.5rem 0;
+        button {
+          cursor: pointer;
+          font-size: 0.14rem;
+          width: 0.8rem;
+          height: 0.35rem;
+          text-align: center;
+          color: #fff;
+          border: 0.01rem solid #9ccefa;
+          span {
+            background: #0087ff;
+            border: 0.01rem solid #0087ff;
+          }
+        }
+        .line {
+          background: #0087ff;
+        }
+        button:nth-of-type(1) {
+          color: #0087ff;
+          background: #e1edfa;
+        }
+        button:nth-of-type(2) {
+          background: #01c5dc;
+        }
+      }
+      .first {
+        justify-content: space-around;
       }
     }
     .btn {
       display: flex;
-      justify-content: space-around;
+      justify-content: space-between;
       padding: 0.1rem 3.5rem 0;
       button {
         cursor: pointer;
@@ -927,13 +955,8 @@ onBeforeUnmount(() => {
         height: 0.35rem;
         text-align: center;
         color: #fff;
-        border: 0.01rem solid #9ccefa;
-        span {
-          background: #0087ff;
-          border: 0.01rem solid #0087ff;
-        }
-      }
-      .line {
+        border: none;
+        border-radius: 0.06rem;
         background: #0087ff;
       }
       button:nth-of-type(1) {
@@ -945,55 +968,7 @@ onBeforeUnmount(() => {
       }
     }
     .first {
-      justify-content: center;
+      justify-content: space-around;
     }
   }
-  .btn {
-    display: flex;
-    justify-content: center;
-    padding: 0.1rem 3.5rem 0;
-   //  button {
-      // cursor: pointer;
-      // font-size: 14px;
-      // text-align: center;
-      // color: #fff;
-      // border: none;
-      // border-radius: 0.06rem;
-      // background: #0087ff;
-      // margin-right:12px;
-    //  margin-right:12px;
-    .quxiao{
-      margin-right:12px;
-      cursor: pointer;
-      width: 90px;
-      height: 32px;
-      background: #ffffff;
-      color:#0058e1;
-      border-radius: 2px;
-      border: 1px #0058e1 solid;
-    }
-    // .quxiao:hover{
-    //   background: #0058e1;
-    //   color:#ffffff;   
-    // }
-    .buzhou{
-      margin-right:12px;
-      cursor: pointer;
-      background: #0058e1;
-      color:#ffffff;
-      width: 90px;
-      height: 32px;
-      border-radius: 2px;
-      border: 1px #0058e1 solid;
-  }
-  // .buzhou:hover{  
-  //     background: #ffffff;
-  //     color:#0058e1;  
-  // }
-    
-  }
-  .first {
-    justify-content: center;
-  }
-}
 </style>
diff --git a/front/src/views/capacityOnTheShelf/components/PutOnTheShelf.vue b/front/src/views/capacityOnTheShelf/components/PutOnTheShelf.vue
index 370ea9d9..6dc48660 100644
--- a/front/src/views/capacityOnTheShelf/components/PutOnTheShelf.vue
+++ b/front/src/views/capacityOnTheShelf/components/PutOnTheShelf.vue
@@ -8,18 +8,46 @@
 <template>
   <div class="put-on-the-shelf">
     <div v-for="title in props.refData.children" :key="title.id">
-      <!-- <div class="top">
+      <div class="top">
         <div></div>
         <div>{{ title.name }}</div>
         <div></div>
-      </div> -->
+      </div>
       <template v-if="title.isConfigure">
         <div class="bottom">
+          <!-- <div class="items" v-if="data[title.name].length > 0">
+            <div
+              class="item"
+              v-for="(val, index) in data[title.name]"
+              :key="'key1' + val.name + index"
+            >
+              <p>
+                <span>{{ title.name }}-{{ index + 1 }}</span>
+                <span></span>
+              </p>
+              <p
+                v-for="attr in props.configure.filter(
+                  (item, index2) => item.name === title.name
+                )[0].list"
+                :key="'key2' + attr.name + index2"
+              >
+                <span>{{ attr.name }}</span>
+                <span v-if="attr.type === 'image'">
+                  <a-image :width="85" :height="60" :src="val.img" />
+                </span>
+                <span v-else>{{ val[attr.field] + (attr.company || '') }}</span>
+              </p>
+              <div class="del">
+                <i class="delImg" @click="del(title.name, index)"></i>
+                <div @click="del(title.name, index)">删除</div>
+              </div>
+            </div>
+          </div> -->
           <div
             v-for="(val, index) in data[title.name]"
             :key="'key1' + val.name + index"
           >
-            <!-- <div
+            <div
               style="
                 font-size: 0.18rem;
                 font-weight: 600;
@@ -39,28 +67,6 @@
                   <div>删除</div>
                 </div>
               </a-popconfirm>
-            </div> -->
-            <div
-              style="
-                  font-size: 16px;
-                 display: flex;
-                float: right;
-                top:0px;
-                margin-right: 28px;
-              "
-            >
-              <!-- <span>{{ title.name }}-{{ index + 1 }}</span> -->
-              <a-popconfirm
-                :title="'是否删除该条' + title.name + '?'"
-                ok-text="是"
-                cancel-text="否"
-                @confirm="del(title.name, index)"
-              >
-                <div class="del">
-                  <i class="delImg"></i>
-                  <div>删除</div>
-                </div>
-              </a-popconfirm>
             </div>
             <div
               class="form"
@@ -69,10 +75,8 @@
               )[0].list"
               :key="'key2' + attr.name + index2"
             >
-            
-            <span ><front style="color:#e83a48"> *</front>{{ attr.name }}:</span>
+              <span>{{ attr.name }}</span>
               <a-input
-              style="width:280px"
                 disabled
                 v-model:value="val[attr.field]"
                 :maxlength="24"
@@ -81,30 +85,25 @@
               />
               <template v-if="attr.type == 'input2'">
                 <a-input
-                style="width:280px"
-                   disabled
+                  disabled
                   :maxLength="1000"
                   v-model:value="val[attr.field]"
                   :placeholder="'请填写' + attr.name"
                 />
               </template>
-              <template v-else-if="attr.type == 'textArea'">
-              <a-input
-                style="width:1120px"
+              <a-textarea
                 disabled
-                v-model:value="val[attr.field]"
-                :maxlength="1000"
-                :placeholder="'请填写' + attr.name + ',不超过1000个字符'"
-               
-              />
-            </template>
-              <!-- <a-textarea
-              disabled
                 v-model:value="val[attr.field]"
                 :showCount="true"
                 :maxlength="1000"
                 :placeholder="'请填写' + attr.name"
                 v-else-if="attr.type == 'textArea'"
+              />
+              <!-- <a-radio-group
+                v-model:value="val[attr.field]"
+                :options="val.options"
+                @change="radioChange"
+                v-else-if="attr.type == 'radio'"
               /> -->
               <div v-else-if="attr.type == 'radio'">
                 {{ val[attr.field] + (attr.company || '') }}
@@ -112,13 +111,24 @@
               <span v-else-if="attr.type === 'image'">
                 <a-image :width="85" :height="60" :src="val.img" />
               </span>
+              <!-- <upload
+                :key="showKey"
+                type="图片"
+                btnName="上传图片"
+                :maxCount="1"
+                :data="val"
+                :list="[]"
+                tip="支持图片类型，大小不超过100M"
+                v-else-if="val.type == 'image'"
+              ></upload> -->
             </div>
-            <div style="margin-top:24px;height:1px;border-top: 1px dashed #dddee1; width: 1240px;font-size: 18px;"></div>
           </div>
-      
-          <!-- <div style="font-size: 0.18rem; font-weight: 600border-top: 1px dashed grey; width: 1240px;font-size: 18px;">
-            <span>{{ title.name }}-{{ data[title.name].length + 1 }}</span>
+          <!-- <div class="add" @click="add(title.name)">
+            添加更多{{ title.name }}
           </div> -->
+          <div style="font-size: 0.18rem; font-weight: 600">
+            <span>{{ title.name }}-{{ data[title.name].length + 1 }}</span>
+          </div>
           <div
             class="form"
             v-for="(val, index) in props.configure.filter(
@@ -126,9 +136,8 @@
             )[0].list"
             :key="'key3' + val.name + index"
           >
-          <span ><front style="color:#e83a48"> *</front>{{ val.name }}:</span>
+            <span>{{ val.name }}</span>
             <a-input
-            style="width:280px"
               v-model:value="val.note1"
               :maxlength="24"
               :placeholder="'请填写' + val.name + ',不超过24个字符'"
@@ -136,7 +145,6 @@
             />
             <template v-if="val.type == 'input2'">
               <a-input
-                style="width:280px"
                 :maxLength="1000"
                 v-model:value="val.note1"
                 :placeholder="'请填写' + val.name"
@@ -155,23 +163,13 @@
                 }}
               </span>
             </template>
-            <template  v-else-if="val.type == 'textArea'">
-              <a-input
-                style="width:1120px"
-                :showCount="true"
-                v-model:value="val.note1"
-                :maxlength="1000"
-                :placeholder="'请填写' + val.name + ',不超过1000个字符'"
-           
-              />
-            </template>
-            <!-- <a-textarea
+            <a-textarea
               v-model:value="val.note1"
               :showCount="true"
               :maxlength="1000"
               :placeholder="'请填写' + val.name"
               v-else-if="val.type == 'textArea'"
-            /> -->
+            />
             <a-input-number
               v-model:value="val.note1"
               :min="0"
@@ -181,31 +179,12 @@
               :placeholder="'请填写' + val.name"
               v-else-if="val.type == 'number'"
             />
-            <!-- <a-radio-group
+            <a-radio-group
               v-model:value="val.note1"
               :options="val.options"
               @change="radioChange"
               v-else-if="val.type == 'radio'"
-            /> -->
-            <div
-            v-else-if="val.type == 'radio'"
-                class="danxuan-Area"
-                id="danxuan-Area"
-              >
-                <div
-                  v-for="itemSelect in val.options"
-                  :key="itemSelect"
-                  class="danxuan-Area-son"
-                  @click="radioChangeNew(val, itemSelect)"
-                  :class="
-                    val.note1 && val.note1=== itemSelect
-                      ? 'danxuan-Area-down'
-                      : ''
-                  "
-                >
-                  {{ itemSelect }}
-                </div>
-              </div>
+            />
             <upload
               :key="showKey"
               type="图片"
@@ -217,15 +196,9 @@
               v-else-if="val.type == 'image'"
             ></upload>
           </div>
-          <div style="margin-top:24px;height:1px;border-top: 1px dashed #dddee1; width: 1240px;font-size: 18px;"></div>
           <div class="submit">
             <a-button type="primary" @click="add(title.name)">
-              <img
-                style="height: 12px; width: 12px;margin-top: -2px;"
-                src="../../../assets/home/zhengjia.png"
-                alt=""
-              />
-              <span style="margin-left: 4px">添加多个{{ title.name }}</span>
+              添加更多{{ title.name }}
             </a-button>
           </div>
         </div>
@@ -255,7 +228,7 @@
                 <b class="required" v-if="required.indexOf(item.name) > -1">
                   *
                 </b>
-                {{ item.name }} :
+                {{ item.name }}
               </div>
               <a-input
                 :maxLength="1000"
@@ -273,59 +246,26 @@
                 :placeholder="'请输入' + item.name + '，不超过50个字符'"
                 @change="changeIiem(item.name, item.note1)"
               />
-              <!-- <a-radio-group
+              <a-radio-group
                 v-else-if="item.type == 'radio'"
                 v-model:value="item.note1"
                 :options="item.options"
                 @change="changeIiem(item.name, item.note1)"
-              /> -->  
-              <!-- 接口请求方式  单选框样式改变 -->
-              <!-- <div  v-else-if="item.type == 'radio'">ddd </div> -->
-              <div
-              v-else-if="item.type == 'radio'"
-                class="danxuan-Area"
-                id="danxuan-Area"
-              >
-                <div
-                  v-for="itemSelect in item.options"
-                  :key="itemSelect"
-                  class="danxuan-Area-son"
-                  @click="danxuanRadio(item, itemSelect)"
-                  :class="
-                    item.note1 && item.note1 === itemSelect
-                      ? 'danxuan-Area-down'
-                      : ''
-                  "
-                >
-                  {{ itemSelect }}
-                </div>
-              </div>
-              <!-- <a-input
+              />
+              <a-input
                 v-else-if="item.type == 'AbilityType'"
                 :maxLength="1000"
                 v-model:value="item.note1"
                 :placeholder="'请输入' + item.name"
                 :disabled="true"
-              /> -->
-              <span
-                v-else-if="item.type == 'AbilityType'"
-                style="font-weight: bold; color: #212121"
-              >
-                {{ item.note1 }}
-              </span>
-              <span
-                v-else-if="item.type == 'ComponentType'"
-                style="font-weight:bold;color:#212121}"
-              >
-                {{ item.note1 }}
-              </span>
-              <!-- <a-input
+              />
+              <a-input
                 v-else-if="item.type == 'ComponentType'"
                 v-model:value="item.note1"
                 :maxLength="1000"
                 :placeholder="'请输入' + item.name"
                 :disabled="true"
-              /> -->
+              />
               <a-textarea
                 v-else-if="item.type == 'textArea'"
                 v-model:value="item.note1"
@@ -405,18 +345,15 @@
                   <VueTemplateDemo :dataFrom="props.dataFrom"></VueTemplateDemo>
                 </div>
               </div>
-
-
               <upload
                 v-else-if="item.type == 'video'"
                 type="视频"
-                btnName="请上传视频"
+                btnName="上传视频"
                 :maxCount="1"
                 :data="item"
                 :list="props.videoList"
                 tip="支持视频类型，大小不超过100M"
               ></upload>
-
               <!-- <a-button
               v-else-if="item.type == 'AssociatedApplication'"
               @click="sourceClick"
@@ -456,11 +393,11 @@
                   {{ itemSelect.dictLabel }}
                 </a-select-option>
               </a-select>
-              <!-- <a-select
+              <a-select
                 v-else-if="item.type == 'select' && item.name !== '归属部门'"
                 style="width: 2.4rem"
                 v-model:value="item.note1"
-                :placeholder="'请选择11' + item.name"
+                :placeholder="'请选择' + item.name"
                 @change="changeIiem(item.name, item.note1)"
               >
                 <a-select-option
@@ -470,27 +407,7 @@
                 >
                   {{ itemSelect.dictLabel }}
                 </a-select-option>
-              </a-select> -->
-              <div
-                v-else-if="item.type == 'select' && item.name !== '归属部门'"
-                class="danxuan-Area"
-                id="danxuan-Area"
-              >
-                <div
-                  v-for="(itemSelect, indexSelect) in item.options"
-                  :key="indexSelect"
-                  :value="itemSelect.dictLabel"
-                  class="danxuan-Area-son"
-                  @click="danxuanArea(item, item.name, itemSelect.dictLabel)"
-                  :class="
-                    item.note1 && item.note1 === itemSelect.dictLabel
-                      ? 'danxuan-Area-down'
-                      : ''
-                  "
-                >
-                  {{ itemSelect.dictLabel }}
-                </div>
-              </div>
+              </a-select>
               <a-select
                 v-else-if="item.name === '归属部门'"
                 style="width: 2.4rem"
@@ -521,7 +438,6 @@
                   "
                 >
                   {{ itemson.dictLabel }}
-                  <div class="application-Area-son-son"></div>
                 </div>
               </div>
             </div>
@@ -600,1029 +516,906 @@
   </div>
 </template>
 <script setup>
-import VueTemplateDemo from '@/views/personalCenter/VueTemplateDemo'
-import { placeHolderWords } from '@/utils/placeHolder'
-import {
-  ref,
-  defineProps,
-  watch,
-  onMounted,
-  defineExpose,
-  defineEmits,
-} from 'vue'
-import mybus from '@/myplugins/mybus'
-import upload from '@/views/components/upload'
-import { message } from 'ant-design-vue'
-import { getUserInfo, getDeptAll } from '@/api/user'
-import {
-  getCategoryTreePage,
-  queryApplicationRelByResourceId,
-  queryResourceRelByKeyId,
-  filesUpload,
-} from '@/api/personalCenter'
-import { useRouter } from 'vue-router'
-const router = useRouter()
-const abilityToType = router.currentRoute.value.query.abilityToType
-const componentTypeValue = router.currentRoute.value.query.componentTypeValue
-const changeField = ref([])
-//选取的数据
-const chooseField = ref([])
-const props = defineProps({
-  // 展示数据
-  refData: { type: Object, default: null },
-  // 表单数据
-  dataFrom: { type: Array, default: null },
-  // 文件回显
-  fileList: { type: Array, default: null },
-  fileList2: { type: Array, default: null },
-  // 压缩包回显
-  packageList: { type: Array, default: null },
-  // 图片回显
-  imgList: { type: Array, default: null },
-  // 视频回显
-  videoList: { type: Array, default: null },
-  // 外部字段
-  externalField: { type: Array, default: null },
-  // 多条的配置
-  configure: { type: Array, default: null },
-  required: { type: Array, default: null },
-  notFilled: { type: Array, default: null },
-  // [{
-  //   name:'计费标准信息',
-  //   list:[
-  //     {
-  //       name:'计费方式',
-  //       type:'radio',
-  //       field:'type',
-  //       options:
-  //         {
-  //           name:'一次性买断',
-  //           value:'1'
-  //         },
-  //         {
-  //           name:'按调用次数',
-  //           value:'2'
-  //         },
-  //         {
-  //           name:'按并发路数',
-  //           value:'3'
-  //         },
-  //         {
-  //           name:'按年计费',
-  //           value:'4'
-  //         }
-  //       ],
-  //       note1:''
-  //     },
-  //     {
-  //       name:'计费标准',
-  //       field:'price',
-  //       type:'number',
-  //       company:'元',
-  //       note1: ''
-  //     },
-  //     {
-  //       name:'计费标准描述',
-  //       field:'desc',
-  //       type:'textArea',
-  //       note1:''
-  //     }
-  //   ]
-  // }]
-})
-const emit = defineEmits(['next', 'back', 'submit', 'preview'])
-
-const changeAdd = () => {}
-const data = ref({
-  list: [],
-})
-const showKey = ref(0)
-const numType = ref('一次性买断')
-const radioChange = (e) => {
-  numType.value = e.target.value
-}
-const radioChangeNew = (item,itemSelect) => {
-  if (item.note1) {
-    if (item.note1 === itemSelect) {
-      item.note1 = null
-    } else {
-      item.note1 = itemSelect
-    }
-  } else {
-    item.note1 = itemSelect
-  }
-
-  numType.value =itemSelect
-}
-const changeIiem = (name, value) => {
-  if (value && value !== '' && changeField.value.indexOf(name) == -1) {
-    changeField.value.push(name)
-  } else if (!value || value == '') {
-    if (changeField.value.indexOf(name) > -1) {
-      changeField.value.splice(changeField.value.indexOf(name), 1)
-    }
-  }
-}
-
-props.refData.children.map((item) => {
-  if (item.name == '基本信息') {
-    item.children.map((val) => {
-      if (val.name == '能力类型') {
-        val.note1 = abilityToType
-      }
-      if (val.name == '组件类型') {
-        val.note1 = componentTypeValue
-      }
-    })
-  }
-  if (
-    props.configure &&
-    props.configure.filter((val) => val.name === item.name).length > 0
-  ) {
-    item.isConfigure = true
-    data.value[item.name] = []
-  } else {
-    item.isConfigure = false
-  }
-})
-let arr = props.refData.children.filter((item) => {
-  if (props.configure) {
-    if (!item.isConfigure) {
-      return item
-    }
-  } else {
-    return item
-  }
-})
-data.value.list = []
-// 获取字典数据
-arr.forEach((val) => {
-  val.children.forEach((item) => {
-    if (item.isLinkToDic === 'true' && item.linkValue) {
-      getCategoryTreePage({
-        page: 1,
-        limit: 20,
-        dictTypeId: item.linkValue,
-        deFlage: 0,
-      }).then((res) => {
-        if (item.type === 'radio') {
-          item.options = res.data.data.list.map((radio) => radio.dictLabel)
-        } else if (item.type === 'select' || item.type === 'checkBox') {
-          if (item.type === 'checkBox') {
-            if (!item.note2) {
-              item.note2 = []
-            }
-          }
-          item.options = res.data.data.list
-        }
-        data.value.list.push(item)
-      })
-    } else if (item.name === '归属部门') {
-      getDeptAll().then((res) => {
-        const dataList = []
-        res.data.data.forEach((element) => {
-          dataList.push({
-            value: element.id,
-            label: element.name,
-          })
-        })
-        item.options = dataList
-        if (!item.note1) {
-          getUserInfo().then(({ data: res1 }) => {
-            item.note1 = res1.data.deptId
-            item.note2 = item.options.filter(
-              (val) => val.value == item.note1
-            )[0]
-
-            data.value.list.push(item)
-          })
-        } else {
-          data.value.list.push(item)
-        }
-      })
-    }
-    // else if (item.name === '部门联系人') {
-    //   if (!item.note1) {
-    //     getUserInfo().then(({ data: res1 }) => {
-    //       console.log(res1.data)
-    //       item.note1 = res1.data.realName || ''
-    //     })
-    //     data.value.list.push(item)
-    //   } else {
-    //     data.value.list.push(item)
-    //   }
-    // } else if (item.name === '部门联系人电话') {
-    //   if (!item.note1) {
-    //     getUserInfo().then(({ data: res1 }) => {
-    //       console.log(res1.data)
-    //       item.note1 = res1.data.mobile || ''
-    //     })
-    //     data.value.list.push(item)
-    //   } else {
-    //     data.value.list.push(item)
-    //   }
-    // }
-    else if (item.name === '来源应用') {
-      queryApplicationRelByResourceId({
-        referenceId: 0,
-      }).then((res) => {
-        const dataList = []
-        res.data.data.notLinked.forEach((element) => {
-          dataList.push({
-            value: element.id,
-            label: element.name,
-          })
-        })
-        item.options = dataList
-        data.value.list.push(item)
-      })
-    } else {
-      data.value.list.push(item)
-    }
+  import VueTemplateDemo from '@/views/personalCenter/VueTemplateDemo'
+  import { placeHolderWords } from '@/utils/placeHolder'
+  import {
+    ref,
+    defineProps,
+    watch,
+    onMounted,
+    defineExpose,
+    defineEmits,
+  } from 'vue'
+  import mybus from '@/myplugins/mybus'
+  import upload from '@/views/components/upload'
+  import { message } from 'ant-design-vue'
+  import { getUserInfo, getDeptAll } from '@/api/user'
+  import {
+    getCategoryTreePage,
+    queryApplicationRelByResourceId,
+    queryResourceRelByKeyId,
+    filesUpload,
+  } from '@/api/personalCenter'
+  import { useRouter } from 'vue-router'
+  const router = useRouter()
+  const abilityToType = router.currentRoute.value.query.abilityToType
+  const componentTypeValue = router.currentRoute.value.query.componentTypeValue
+  const changeField = ref([])
+  const props = defineProps({
+    // 展示数据
+    refData: { type: Object, default: null },
+    // 表单数据
+    dataFrom: { type: Array, default: null },
+    // 文件回显
+    fileList: { type: Array, default: null },
+    fileList2: { type: Array, default: null },
+    // 压缩包回显
+    packageList: { type: Array, default: null },
+    // 图片回显
+    imgList: { type: Array, default: null },
+    // 视频回显
+    videoList: { type: Array, default: null },
+    // 外部字段
+    externalField: { type: Array, default: null },
+    // 多条的配置
+    configure: { type: Array, default: null },
+    required: { type: Array, default: null },
+    notFilled: { type: Array, default: null },
+    // [{
+    //   name:'计费标准信息',
+    //   list:[
+    //     {
+    //       name:'计费方式',
+    //       type:'radio',
+    //       field:'type',
+    //       options:
+    //         {
+    //           name:'一次性买断',
+    //           value:'1'
+    //         },
+    //         {
+    //           name:'按调用次数',
+    //           value:'2'
+    //         },
+    //         {
+    //           name:'按并发路数',
+    //           value:'3'
+    //         },
+    //         {
+    //           name:'按年计费',
+    //           value:'4'
+    //         }
+    //       ],
+    //       note1:''
+    //     },
+    //     {
+    //       name:'计费标准',
+    //       field:'price',
+    //       type:'number',
+    //       company:'元',
+    //       note1: ''
+    //     },
+    //     {
+    //       name:'计费标准描述',
+    //       field:'desc',
+    //       type:'textArea',
+    //       note1:''
+    //     }
+    //   ]
+    // }]
   })
-})
-if (props.dataFrom) {
-  props.dataFrom.infoList.forEach((item) => {
+  const emit = defineEmits(['next', 'back', 'submit', 'preview'])
+  // console.log('props==========>', props)
+  const changeAdd = () => {
+    console.log('子组件方法触发~')
+  }
+  const data = ref({
+    list: [],
+  })
+  const showKey = ref(0)
+  const numType = ref('一次性买断')
+  const radioChange = (e) => {
+    numType.value = e.target.value
+  }
+  const changeIiem = (name, value) => {
+    if (value && value !== '' && changeField.value.indexOf(name) == -1) {
+      changeField.value.push(name)
+    } else if (!value || value == '') {
+      if (changeField.value.indexOf(name) > -1) {
+        changeField.value.splice(changeField.value.indexOf(name), 1)
+      }
+    }
+  }
+  props.refData.children.map((item) => {
+    if (item.name == '基本信息') {
+      item.children.map((val) => {
+        if (val.name == '能力类型') {
+          val.note1 = abilityToType
+        }
+        if (val.name == '组件类型') {
+          val.note1 = componentTypeValue
+        }
+      })
+    }
     if (
       props.configure &&
-      props.configure.filter((val) => val.name === item.attrType).length > 0
+      props.configure.filter((val) => val.name === item.name).length > 0
     ) {
-      data.value[item.attrType] = JSON.parse(item.attrValue)
-    } else if (item.attrType === '应用领域') {
-      props.refData.children.forEach((val) => {
-        val.children.forEach((child) => {
-          if (child.name === item.attrType) {
-            // 通过;分割成数组
-            child.note2 = item.attrValue.split(';')
-            showKey.value++
+      item.isConfigure = true
+      data.value[item.name] = []
+    } else {
+      item.isConfigure = false
+    }
+  })
+  let arr = props.refData.children.filter((item) => {
+    if (props.configure) {
+      if (!item.isConfigure) {
+        return item
+      }
+    } else {
+      return item
+    }
+  })
+  data.value.list = []
+  // 获取字典数据
+  arr.forEach((val) => {
+    val.children.forEach((item) => {
+      if (item.isLinkToDic === 'true' && item.linkValue) {
+        getCategoryTreePage({
+          page: 1,
+          limit: 20,
+          dictTypeId: item.linkValue,
+          deFlage: 0,
+        }).then((res) => {
+          if (item.type === 'radio') {
+            item.options = res.data.data.list.map((radio) => radio.dictLabel)
+          } else if (item.type === 'select' || item.type === 'checkBox') {
+            if (item.type === 'checkBox') {
+              if (!item.note2) {
+                item.note2 = []
+              }
+            }
+            item.options = res.data.data.list
+          }
+          data.value.list.push(item)
+        })
+      } else if (item.name === '归属部门') {
+        getDeptAll().then((res) => {
+          const dataList = []
+          res.data.data.forEach((element) => {
+            dataList.push({
+              value: element.id,
+              label: element.name,
+            })
+          })
+          item.options = dataList
+          if (!item.note1) {
+            getUserInfo().then(({ data: res1 }) => {
+              console.log(res1.data)
+              item.note1 = res1.data.deptId
+              item.note2 = item.options.filter(
+                (val) => val.value == item.note1
+              )[0]
+              console.log('默认部门=========>', item, res1.data)
+              data.value.list.push(item)
+            })
+          } else {
+            data.value.list.push(item)
           }
         })
-      })
-      //  item.note1 = item.attrValue.split(';')
-    }
-  })
-}
-//显示富文本
-let showText = ref(false)
-const showTextFunction = () => {
-  showText.value = true
-}
-mybus.on('showTextFunctionEmit', (show) => {
-  showText.value = show
-})
-mybus.off('func')
-const add = (title, addFlag, type) => {
-  let list = props.configure.filter((item) => item.name === title)[0].list
-  let flag = true
-  list.forEach((item) => {
-    if (item.type !== 'number' && !item.note1.length > 0) {
-      flag = false
-    } else if (item.type === 'number' && !item.note1 > 0) {
-      flag = false
-    }
-  })
-  if (flag) {
-    let obj = {}
-    let sfFlag = false
-    list.forEach((item) => {
-      if (item.type === 'input2') {
-        sfFlag = data.value[title].filter(
-          (val) => val.type === numType.value
-        )[0]
-        if (sfFlag) {
-          message.warning('已添加过该类型！')
-          return
-        }
-        obj[item.field] =
-          item.note1 +
-          (numType.value == '一次性买断'
-            ? '元'
-            : numType.value == '按调用次数'
-            ? '元/次'
-            : numType.value == '按并发路数'
-            ? '元/路'
-            : numType.value == '按年计费'
-            ? '元/年'
-            : '')
+      }
+      // else if (item.name === '部门联系人') {
+      //   if (!item.note1) {
+      //     getUserInfo().then(({ data: res1 }) => {
+      //       console.log(res1.data)
+      //       item.note1 = res1.data.realName || ''
+      //     })
+      //     data.value.list.push(item)
+      //   } else {
+      //     data.value.list.push(item)
+      //   }
+      // } else if (item.name === '部门联系人电话') {
+      //   if (!item.note1) {
+      //     getUserInfo().then(({ data: res1 }) => {
+      //       console.log(res1.data)
+      //       item.note1 = res1.data.mobile || ''
+      //     })
+      //     data.value.list.push(item)
+      //   } else {
+      //     data.value.list.push(item)
+      //   }
+      // }
+      else if (item.name === '来源应用') {
+        queryApplicationRelByResourceId({
+          referenceId: 0,
+        }).then((res) => {
+          const dataList = []
+          res.data.data.notLinked.forEach((element) => {
+            dataList.push({
+              value: element.id,
+              label: element.name,
+            })
+          })
+          item.options = dataList
+          data.value.list.push(item)
+        })
       } else {
-        obj[item.field] = item.note1
+        data.value.list.push(item)
       }
     })
-    if (!sfFlag) {
-      data.value[title].push(obj)
+    console.log('props.dataFrom', data.value.list)
+  })
+  if (props.dataFrom) {
+    // console.log(props.dataFrom, data.value.list)
+    props.dataFrom.infoList.forEach((item) => {
+      if (
+        props.configure &&
+        props.configure.filter((val) => val.name === item.attrType).length > 0
+      ) {
+        data.value[item.attrType] = JSON.parse(item.attrValue)
+      } else if (item.attrType === '应用领域') {
+        props.refData.children.forEach((val) => {
+          val.children.forEach((child) => {
+            if (child.name === item.attrType) {
+              // 通过;分割成数组
+              child.note2 = item.attrValue.split(';')
+              showKey.value++
+              // console.log('应用领域', item, item.attrValue.split(';'), child)
+            }
+          })
+        })
+        //  item.note1 = item.attrValue.split(';')
+      }
+    })
+  }
+  //显示富文本
+  let showText = ref(false)
+  const showTextFunction = () => {
+    console.log('点击富文本=========================>')
+    showText.value = true
+  }
+  mybus.on('showTextFunctionEmit', (show) => {
+    console.log('ssdcsd')
+    showText.value = show
+  })
+  mybus.off('func')
+  const add = (title, addFlag, type) => {
+    console.log(title, 'title')
+    let list = props.configure.filter((item) => item.name === title)[0].list
+    let flag = true
+    list.forEach((item) => {
+      // console.log(item)
+      if (item.type !== 'number' && !item.note1.length > 0) {
+        flag = false
+      } else if (item.type === 'number' && !item.note1 > 0) {
+        flag = false
+      }
+    })
+    if (flag) {
+      let obj = {}
+      let sfFlag = false
+      list.forEach((item) => {
+        if (item.type === 'input2') {
+          sfFlag = data.value[title].filter(
+            (val) => val.type === numType.value
+          )[0]
+          if (sfFlag) {
+            message.warning('已添加过该类型！')
+            return
+          }
+          obj[item.field] =
+            item.note1 +
+            (numType.value == '一次性买断'
+              ? '元'
+              : numType.value == '按调用次数'
+              ? '元/次'
+              : numType.value == '按并发路数'
+              ? '元/路'
+              : numType.value == '按年计费'
+              ? '元/年'
+              : '')
+        } else {
+          obj[item.field] = item.note1
+        }
+      })
+      if (!sfFlag) {
+        data.value[title].push(obj)
+      }
+      // console.log(data.value[title])
+      mybus.emit('chageDataFrom', {
+        attrType: title,
+        attrValue: JSON.stringify(data.value[title]),
+        delFlag: 0,
+      })
+      list.forEach((item) => {
+        item.note1 = ''
+        showKey.value++
+      })
+      if (addFlag) {
+        if (type == '上一步') {
+          emit('back')
+        } else if (type == '下一步') {
+          emit('next')
+        } else if (type == '提交') {
+          emit('submit')
+        } else if (type == '预览') {
+          emit('preview')
+        }
+      }
+    } else {
+      if (!addFlag) {
+        message.warning('请填写完整')
+      } else {
+        list.forEach((item) => {
+          item.note1 = ''
+          showKey.value++
+        })
+        if (type == '上一步') {
+          emit('back')
+        } else if (type == '下一步') {
+          emit('next')
+        } else if (type == '提交') {
+          emit('submit')
+        } else if (type == '预览') {
+          emit('preview')
+        }
+      }
     }
-
+  }
+  const del = (title, index) => {
+    data.value[title].splice(index, 1)
     mybus.emit('chageDataFrom', {
       attrType: title,
       attrValue: JSON.stringify(data.value[title]),
       delFlag: 0,
     })
-    list.forEach((item) => {
-      item.note1 = ''
-      showKey.value++
-    })
-    if (addFlag) {
-      if (type == '上一步') {
-        emit('back')
-      } else if (type == '下一步') {
-        emit('next')
-      } else if (type == '提交') {
-        emit('submit')
-      } else if (type == '预览') {
-        emit('preview')
-      }
-    }
-  } else {
-    if (!addFlag) {
-      message.warning('请填写完整')
+  }
+  const ApplicationArea = (item, itemson) => {
+    // console.log('点击=========》', item, itemson)
+    // console.log(item, itemson)
+    if (item.note2.indexOf(itemson.dictLabel) === -1) {
+      item.note2.push(itemson.dictLabel)
     } else {
-      list.forEach((item) => {
-        item.note1 = ''
-        showKey.value++
-      })
-      if (type == '上一步') {
-        emit('back')
-      } else if (type == '下一步') {
-        emit('next')
-      } else if (type == '提交') {
-        emit('submit')
-      } else if (type == '预览') {
-        emit('preview')
-      }
+      item.note2.splice(item.note2.indexOf(itemson.dictLabel), 1)
     }
-  }
-}
-const del = (title, index) => {
-  data.value[title].splice(index, 1)
-  mybus.emit('chageDataFrom', {
-    attrType: title,
-    attrValue: JSON.stringify(data.value[title]),
-    delFlag: 0,
-  })
-}
-const ApplicationArea = (item, itemson) => {
-  if (item.note2.indexOf(itemson.dictLabel) === -1) {
-    item.note2.push(itemson.dictLabel)
-  } else {
-    item.note2.splice(item.note2.indexOf(itemson.dictLabel), 1)
-  }
-  // 多选判断是否为空
-  if (item.note2.length !== 0 && changeField.value.indexOf('应用领域') == -1) {
-    changeField.value.push('应用领域')
-  } else if (item.note2.length == 0) {
-    if (changeField.value.indexOf('应用领域') > -1) {
-      changeField.value.splice(changeField.value.indexOf('应用领域'), 1)
-    }
-  }
-  mybus.emit('chageDataFrom', {
-    attrType: item.name,
-    attrValue: item.note2.join(';'),
-    delFlag: 0,
-  })
-}
-const danxuanArea = (item, itemSelect, indexSelect) => {
-  if (item.note1) {
-    if (item.note1 === indexSelect) {
-      item.note1 = null
-    } else {
-      item.note1 = indexSelect
-    }
-  } else {
-    item.note1 = indexSelect
-  }
-
-  changeIiem(itemSelect, indexSelect)
-}
-const danxuanRadio= (item, itemSelect) => {
-  if (item.note1) {
-    if (item.note1 === itemSelect) {
-      item.note1 = null
-    } else {
-      item.note1 = itemSelect
-    }
-  } else {
-    item.note1 = itemSelect
-  }
-
-  changeIiem(item.name, item.note1)
-}
-// 来源应用
-const visibleAssociatedApplication = ref(false)
-const visibleAssociatedApplicationOther = ref(false)
-const mockData = ref([])
-const mockDataOther = ref([])
-const titles = ref(['未关联的应用名称', '已关联的应用名称'])
-const titleName = ref('来源应用')
-const targetKeys = ref([])
-const targetKeysOther = ref([])
-// 上一步关联数据
-// const targetKeysBack = ref([])
-// 来源应用-back
-const sourceClick = () => {
-  mockData.value = []
-  visibleAssociatedApplication.value = true
-  props.dataFrom.infoList.forEach((val) => {
-    if (val.attrType === '来源应用' && val.attrValue != '') {
-      queryApplicationRelByResourceId({
-        referenceId: 0,
-      }).then((res) => {
-        res.data.data.notLinked.forEach((val, index) => {
-          mockData.value.push({
-            key: val.id,
-            title: val.name,
-            description: val.id,
-          })
-        })
-      })
-      targetKeys.value = []
-      val.attrValue.split(',').forEach((item) => {
-        targetKeys.value.push(item)
-      })
-    } else if (val.attrType === '来源应用' && val.attrValue == '') {
-      queryApplicationRelByResourceId({
-        referenceId: 0,
-      }).then((res) => {
-        res.data.data.notLinked.forEach((val, index) => {
-          mockData.value.push({
-            key: val.id,
-            title: val.name,
-            description: val.id,
-          })
-        })
-      })
-    }
-  })
-}
-// 关联组件
-const componentsClick = () => {
-  titles.value = ['未关联的组件名称', '已关联的组件名称']
-  titleName.value = '关联组件'
-  visibleAssociatedApplicationOther.value = true
-  mockDataOther.value = []
-  props.dataFrom.infoList.forEach((val) => {
-    if (val.attrType === '关联组件信息' && val.attrValue != '') {
-      queryResourceRelByKeyId({
-        keyId: 0,
-        type: '组件服务',
-        referenceName: '',
-      }).then((res) => {
-        res.data.data.notLinked.forEach((val, index) => {
-          mockDataOther.value.push({
-            key: val.id,
-            title: val.name,
-            description: val.name,
-          })
-        })
-      })
-      targetKeysOther.value = []
-      val.attrValue.split(',').forEach((item) => {
-        targetKeysOther.value.push(item)
-      })
-    } else if (val.attrType === '关联组件信息' && val.attrValue == '') {
-      queryResourceRelByKeyId({
-        keyId: 0,
-        type: '组件服务',
-        referenceName: '',
-      }).then((res) => {
-        res.data.data.notLinked.forEach((val, index) => {
-          mockDataOther.value.push({
-            key: val.id,
-            title: val.name,
-            description: val.name,
-          })
-        })
-      })
-    }
-  })
-}
-const selectedKeys = ref([])
-const selectedKeysOther = ref([])
-
-const handleChange = (nextTargetKeys, direction, moveKeys) => {
-  if (direction === 'right') {
-    targetKeys.value = moveKeys.filter((item, index) => index === 0)
-  }
-}
-const handleSelectChange = (sourceSelectedKeys, targetSelectedKeys) => {}
-const handleChangeOther = (nextTargetKeys, direction, moveKeys) => {}
-const handleSelectChangeOther = (sourceSelectedKeys, targetSelectedKeys) => {}
-
-const filterOptionTransfer = (inputValue, option) => {
-  return option.description.indexOf(inputValue) > -1
-}
-
-const handleOk = (e) => {
-  visibleAssociatedApplicationOther.value = false
-  visibleAssociatedApplication.value = false
-
-  data.value.list.map((item) => {
-    if (item.name === '来源应用') {
-      item.note1 = targetKeys.value + ''
-    } else if (item.name === '关联组件信息') {
-      item.note1 = targetKeysOther.value + ''
-    }
-  })
-}
-const handleCancel = (e) => {
-  visibleAssociatedApplicationOther.value = false
-  visibleAssociatedApplication.value = false
-}
-
-const showType = ref('')
-const showTypeClick = (e) => {
-  showType.value = e
-}
-showTypeClick('调用接口')
-
-watch(data.value.list, (newProps, oldProps) => {
-  newProps.forEach((val) => {
+    // 多选判断是否为空
     if (
-      props.configure &&
-      props.configure.filter((item) => item.name === val.name).length > 0
+      item.note2.length !== 0 &&
+      changeField.value.indexOf('应用领域') == -1
     ) {
-      mybus.emit('chageDataFrom', {
-        attrType: val.name,
-        attrValue: val.note1,
-        delFlag: 0,
-      })
-    } else if (
-      props.externalField &&
-      props.externalField.indexOf(val.name) > -1
-    ) {
-      let note2 = {} //储存归属部门的名字
-      if (val.options) {
-        note2 = val.options.filter((item) => item.value == val.note1)[0]
+      changeField.value.push('应用领域')
+      console.log('点击=========》1', changeField.value, item.note2)
+    } else if (item.note2.length == 0) {
+      if (changeField.value.indexOf('应用领域') > -1) {
+        changeField.value.splice(changeField.value.indexOf('应用领域'), 1)
+        console.log('点击=========》2', changeField.value, item.note2)
       }
+    }
+    mybus.emit('chageDataFrom', {
+      attrType: item.name,
+      attrValue: item.note2.join(';'),
+      delFlag: 0,
+    })
+  }
+  // 来源应用
+  const visibleAssociatedApplication = ref(false)
+  const visibleAssociatedApplicationOther = ref(false)
+  const mockData = ref([])
+  const mockDataOther = ref([])
+  const titles = ref(['未关联的应用名称', '已关联的应用名称'])
+  const titleName = ref('来源应用')
+  const targetKeys = ref([])
+  const targetKeysOther = ref([])
+  // 上一步关联数据
+  // const targetKeysBack = ref([])
+  // 来源应用-back
+  const sourceClick = () => {
+    mockData.value = []
+    visibleAssociatedApplication.value = true
+    props.dataFrom.infoList.forEach((val) => {
+      if (val.attrType === '来源应用' && val.attrValue != '') {
+        queryApplicationRelByResourceId({
+          referenceId: 0,
+        }).then((res) => {
+          // console.log(res.data.data.notLinked)
+          res.data.data.notLinked.forEach((val, index) => {
+            mockData.value.push({
+              key: val.id,
+              title: val.name,
+              description: val.id,
+            })
+          })
+        })
+        targetKeys.value = []
+        val.attrValue.split(',').forEach((item) => {
+          targetKeys.value.push(item)
+        })
+        console.log(targetKeys.value)
+        // console.log('wowowo')
+      } else if (val.attrType === '来源应用' && val.attrValue == '') {
+        queryApplicationRelByResourceId({
+          referenceId: 0,
+        }).then((res) => {
+          // console.log(res.data.data.notLinked)
+          res.data.data.notLinked.forEach((val, index) => {
+            mockData.value.push({
+              key: val.id,
+              title: val.name,
+              description: val.id,
+            })
+          })
+        })
+      }
+    })
+  }
+  // 关联组件
+  const componentsClick = () => {
+    titles.value = ['未关联的组件名称', '已关联的组件名称']
+    titleName.value = '关联组件'
+    visibleAssociatedApplicationOther.value = true
+    mockDataOther.value = []
+    props.dataFrom.infoList.forEach((val) => {
+      if (val.attrType === '关联组件信息' && val.attrValue != '') {
+        queryResourceRelByKeyId({
+          keyId: 0,
+          type: '组件服务',
+          referenceName: '',
+        }).then((res) => {
+          // console.log(res.data.data.notLinked)
+          res.data.data.notLinked.forEach((val, index) => {
+            mockDataOther.value.push({
+              key: val.id,
+              title: val.name,
+              description: val.name,
+            })
+          })
+        })
+        targetKeysOther.value = []
+        val.attrValue.split(',').forEach((item) => {
+          targetKeysOther.value.push(item)
+        })
+        console.log(targetKeysOther.value)
+        // console.log('wowowo')
+      } else if (val.attrType === '关联组件信息' && val.attrValue == '') {
+        queryResourceRelByKeyId({
+          keyId: 0,
+          type: '组件服务',
+          referenceName: '',
+        }).then((res) => {
+          // console.log(res.data.data.notLinked)
+          res.data.data.notLinked.forEach((val, index) => {
+            mockDataOther.value.push({
+              key: val.id,
+              title: val.name,
+              description: val.name,
+            })
+          })
+        })
+      }
+    })
+  }
+  const selectedKeys = ref([])
+  const selectedKeysOther = ref([])
 
-      mybus.emit('chageDataFromDwon', {
-        attrType: val.name,
-        attrValue: val.note1,
-        delFlag: 0,
-        attrValueTwo: note2,
-      })
-    } else {
-      if (val.name !== '应用领域' && val.name !== '发布端') {
-        if (val.name == '算法介绍视频') {
-          mybus.emit('chageDataFrom', {
-            attrType: val.name,
-            attrValue: val.note1,
-            delFlag: 0,
-            note3: val.note3,
-          })
-        } else {
-          mybus.emit('chageDataFrom', {
-            attrType: val.name,
-            attrValue: val.note1,
-            delFlag: 0,
-          })
+  const handleChange = (nextTargetKeys, direction, moveKeys) => {
+    console.log('targetKeys: ', nextTargetKeys)
+    console.log('direction: ', direction)
+    console.log('moveKeys: ', moveKeys)
+    if (direction === 'right') {
+      targetKeys.value = moveKeys.filter((item, index) => index === 0)
+    }
+  }
+  const handleSelectChange = (sourceSelectedKeys, targetSelectedKeys) => {
+    console.log('targetSelectedKeys: ', targetSelectedKeys, sourceSelectedKeys)
+  }
+  const handleChangeOther = (nextTargetKeys, direction, moveKeys) => {
+    console.log('targetKeys: ', nextTargetKeys)
+    console.log('direction: ', direction)
+    console.log('moveKeys: ', moveKeys)
+  }
+  const handleSelectChangeOther = (sourceSelectedKeys, targetSelectedKeys) => {
+    console.log('targetSelectedKeys: ', targetSelectedKeys, sourceSelectedKeys)
+  }
+
+  const filterOptionTransfer = (inputValue, option) => {
+    console.log(option, 'option')
+    return option.description.indexOf(inputValue) > -1
+  }
+
+  const handleOk = (e) => {
+    console.log(e)
+    visibleAssociatedApplicationOther.value = false
+    visibleAssociatedApplication.value = false
+    // console.log('2222222222222', props.refData)
+    data.value.list.map((item) => {
+      if (item.name === '来源应用') {
+        item.note1 = targetKeys.value + ''
+      } else if (item.name === '关联组件信息') {
+        item.note1 = targetKeysOther.value + ''
+      }
+    })
+  }
+  const handleCancel = (e) => {
+    console.log(e)
+    visibleAssociatedApplicationOther.value = false
+    visibleAssociatedApplication.value = false
+  }
+
+  const showType = ref('')
+  const showTypeClick = (e) => {
+    showType.value = e
+    console.log(e, 'showType', showType.value)
+  }
+  showTypeClick('调用接口')
+
+  watch(data.value.list, (newProps, oldProps) => {
+    console.log('数据发生改变==========>', newProps, oldProps)
+    newProps.forEach((val) => {
+      // console.log('数据发生改变==========>', val)
+      if (
+        props.configure &&
+        props.configure.filter((item) => item.name === val.name).length > 0
+      ) {
+        mybus.emit('chageDataFrom', {
+          attrType: val.name,
+          attrValue: val.note1,
+          delFlag: 0,
+        })
+      } else if (
+        props.externalField &&
+        props.externalField.indexOf(val.name) > -1
+      ) {
+        let note2 = {} //储存归属部门的名字
+        if (val.options) {
+          note2 = val.options.filter((item) => item.value == val.note1)[0]
+        }
+        console.log('chageDataFromDwon===================>', val)
+        mybus.emit('chageDataFromDwon', {
+          attrType: val.name,
+          attrValue: val.note1,
+          delFlag: 0,
+          attrValueTwo: note2,
+        })
+      } else {
+        if (val.name !== '应用领域' && val.name !== '发布端') {
+          if (val.name == '算法介绍视频') {
+            console.log('变更视频==================>', val)
+            mybus.emit('chageDataFrom', {
+              attrType: val.name,
+              attrValue: val.note1,
+              delFlag: 0,
+              note3: val.note3,
+            })
+          } else {
+            mybus.emit('chageDataFrom', {
+              attrType: val.name,
+              attrValue: val.note1,
+              delFlag: 0,
+            })
+          }
         }
       }
-    }
+    })
   })
-})
-const applicationsChange = (value) => {
-  data.value.list.map((item) => {
-    if (item.name === '来源应用') {
-      item.note1 = value
-    }
+  const applicationsChange = (value) => {
+    data.value.list.map((item) => {
+      if (item.name === '来源应用') {
+        item.note1 = value
+      }
+    })
+    console.log(`selected ${value}`)
+  }
+
+  const handleBlur = () => {
+    console.log('blur')
+  }
+  const applicationsBlur = () => {
+    console.log('blur')
+  }
+
+  const handleFocus = () => {
+    console.log('focus')
+  }
+  const applicationsFocus = () => {
+    console.log('focus')
+  }
+
+  const filterOption = (input, option) => {
+    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+  }
+  defineExpose({
+    add,
   })
-}
-
-const handleBlur = () => {}
-const applicationsBlur = () => {}
-
-const handleFocus = () => {}
-const applicationsFocus = () => {}
-
-const filterOption = (input, option) => {
-  return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
-}
-defineExpose({
-  add,
-})
-const applicationsOption = (input, option) => {
-  return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
-}
+  const applicationsOption = (input, option) => {
+    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+  }
 </script>
 <style></style>
 <style lang="less" scoped>
-:deep(.upload-list-inline .ant-upload .ant-btn) {
-  height: 150px;
-  width: 218px;
-  border: 1px solid rgba(198, 198, 198, 0.5);
-  border-radius: 2px;
-  background: rgba(0, 88, 225, 0.05);
-  color: #0087ff;
-  font-size: 14px;
-}
-
-:deep(.upload-list-inline .ant-upload .ant-btn > span) {
-  background: url('~@/assets/home/yuanjia.png') no-repeat;
-  color: #666666;
-  background-position: center;
-  text-align: center;
-  line-height: 120px;
-  height: 50px;
-}
-// 箭头大小以及位置
-:deep(.ant-select-arrow) {
-  background: url('~@/assets/home/huixia.png') no-repeat;
-  cursor: pointer;
-  margin-top: -4px;
-  margin-right: -4px;
-}
-
-// 隐藏三角
-:deep(.ant-select-arrow .anticon) {
-  vertical-align: top;
-  transition: transform 0.3s;
-  display: none;
-}
-// :deep(.ant-select-arrow :focus) {
-//   background:url('~@/assets/home/huishang.png') no-repeat ;
-// cursor: pointer;
-//   margin-top: -4px;
-//   margin-right: -4px;
-// }
-
-.put-on-the-shelf {
-  margin: 0.15rem 2rem;
-  background: rgb(246, 247, 249, 0.8);
-  height: 846px;
-  overflow: scroll;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  .Technical-text {
-    height: 0.3rem;
-    width: 1rem;
-    border: 0.01rem solid #bbd3ef;
-    border-radius: 0.06rem;
-    background: #edf4fc;
-    color: #0087ff;
-    font-size: 0.14rem;
-    text-align: center;
-    line-height: 0.3rem;
-  }
-  .Technical-text:hover {
-    cursor: pointer;
-  }
-
-  & > div {
-    padding: 0px 0px 24px 24px;
-    width: 100%;
-    font-size: 14px;
-
-    .top {
-      color: #333333;
-
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      margin-bottom: 0.25rem;
-
-      div:first-child,
-      div:last-child {
-        width: 2.45rem;
-        height: 0.01rem;
-        background: #f0f0f0;
-      }
-
-      div:nth-child(2) {
-        margin: 0 0.3rem;
-      }
+  .put-on-the-shelf {
+    height: 6.8rem;
+    overflow: scroll;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 0.5rem 1rem 0.25rem;
+    .Technical-text {
+      height: 0.3rem;
+      width: 1rem;
+      border: 0.01rem solid #bbd3ef;
+      border-radius: 0.06rem;
+      background: #edf4fc;
+      color: #0087ff;
+      font-size: 0.14rem;
+      text-align: center;
+      line-height: 0.3rem;
+    }
+    .Technical-text:hover {
+      cursor: pointer;
     }
 
-    .bottom {
-      // margin-top: 0.25rem;
+    & > div {
+      width: 100%;
+      margin-top: 0.6rem;
 
-      .items {
-        background: #fafafa;
-        padding: 0.1rem;
+      .top {
+        color: #333333;
+        font-size: 0.22rem;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        margin-bottom: 0.25rem;
 
-        p {
-          display: flex;
-          justify-content: space-between;
+        div:first-child,
+        div:last-child {
+          width: 2.45rem;
+          height: 0.01rem;
+          background: #f0f0f0;
+        }
 
-          span:nth-of-type(1) {
-            width: 2rem;
+        div:nth-child(2) {
+          margin: 0 0.3rem;
+        }
+      }
+
+      .bottom {
+        margin-top: 0.25rem;
+
+        .items {
+          background: #fafafa;
+          padding: 0.1rem;
+
+          p {
+            display: flex;
+            justify-content: space-between;
+
+            span:nth-of-type(1) {
+              width: 2rem;
+            }
+
+            span:nth-of-type(2) {
+              width: 100%;
+              font-weight: 600;
+            }
           }
 
-          span:nth-of-type(2) {
-            width: 100%;
+          p:nth-of-type(1) > span:nth-of-type(1) {
+            font-size: 0.18rem;
             font-weight: 600;
           }
         }
 
-        p:nth-of-type(1) > span:nth-of-type(1) {
-          font-size: 0.18rem;
-          font-weight: 600;
-        }
-      }
-
-      .add {
-        cursor: pointer;
-        margin-top: 0.1rem;
-        font-size: 0.16rem;
-        color: #007efb;
-      }
-
-      .form {
-        min-height: 32px;
-        margin-top: 24px;
-        display: flex;
-        justify-content: flex-start;
-        align-items: center;
-
-        span:first-child {
-          width: 1.0rem;
+        .add {
+          cursor: pointer;
+          margin-top: 0.1rem;
+          font-size: 0.16rem;
+          color: #007efb;
         }
 
-        :deep(.ant-input-textarea) {
-          width: 1000px;
+        .form {
+          margin-top: 0.2rem;
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+
+          span:first-child {
+            width: 1.2rem;
+          }
+
+          :deep(.ant-input-textarea) {
+            width: 5.2rem;
+          }
+
+          :deep(.ant-radio-group) {
+            width: 5.2rem;
+          }
+
+          :deep(.ant-input-number) {
+            width: 2rem;
+          }
+
+          :deep(.ant-input) {
+            resize: none;
+            width: 5.2rem;
+          }
+
+          .ant-btn {
+            width: 1.6rem;
+            height: 0.32rem;
+            text-align: center;
+            background: #edf4fc;
+            color: #0087ff;
+            border: 0.01rem solid #bbd3ef;
+            border-radius: 0.06rem;
+          }
         }
 
-        :deep(.ant-radio-group) {
-          width: 5.2rem;
-        }
+        .submit {
+          margin-top: 0.4rem;
+          font-size: 0.14rem;
+          display: flex;
+          justify-content: flex-end;
 
-        :deep(.ant-input-number) {
-          width: 2rem;
-        }
-
-        :deep(.ant-input) {
-          resize: none;
-          width: 5.2rem;
-        }
-
-        .ant-btn {
-          width: 1.6rem;
-          height: 0.32rem;
-          text-align: center;
-          background: #edf4fc;
-          color: #0087ff;
-          border: 0.01rem solid #bbd3ef;
-          border-radius: 0.06rem;
-        }
-      }
-
-      .submit {
-        margin-top: 0.4rem;
-        font-size: 0.14rem;
-        display: flex;
-        justify-content: center;
-
-        .ant-btn {
-          width: 260px;
-          height: 32px;
-          text-align: center;
-          background: #fff;
-          color: #0558e1;
-          border: 1px solid #0558e1;
-          border-radius: 2px;
-          font-size: 14px;
-        }
-        .ant-btn:hover{
-          background: #fff;
-          color: #0558e1;
-          opacity: 0.8;
-        }
-        .ant-btn:active{
-          background: #fff;
-          color: #0558e1;
-          opacity: 0.8
+          .ant-btn {
+            width: 1.8rem;
+            height: 0.3rem;
+            text-align: center;
+            background: #d9ebff;
+            color: #0087ff;
+            border: 0.01rem solid #0087ff;
+            border-radius: 0.06rem;
+          }
         }
       }
     }
-  }
 
-  & > div:nth-of-type(1) {
-    margin-top: 0;
-  }
-}
-.danxuan-Area {
-  display: grid;
-  margin-top: -0.05rem;
-  grid-template-columns: auto auto auto auto auto auto;
-  border-right: 1px #0558e1 solid;
-  .danxuan-Area-son {
-    cursor: pointer;
-    min-width: 80px;
-    height: 32px;
-    border-radius: 2px;
-    color: #0558e1;
-    background: #fff;
-    border-left: 1px #0558e1 solid;
-    border-bottom: 1px #0558e1 solid;
-    border-top: 1px #0558e1 solid;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-  .danxuan-Area-son:hover {
-    color: #fff;
-    background: #0558e1;
-  }
-
-  .danxuan-Area-down {
-    background: #0058e1;
-    color: #fff;
-    // border: 1px #0558e1 solid;
-  }
-}
-
-.application-Area {
-  display: grid;
-  margin-top: -0.05rem;
-  grid-template-columns: auto auto auto auto auto auto;
-
-  .application-Area-son {
-    cursor: pointer;
-    width: 162px;
-    height: 32px;
-    border-radius: 2px;
-    color: #212121;
-    background: rgba(96, 99, 104, 0.1);
-    border: 0.01rem rgba(96, 99, 104, 0.1) solid;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    margin-top: 8px;
-    margin-right: 8px;
-    position: relative;
-    .application-Area-son-son {
-      position: absolute;
-      right: 0px;
-      top: 0px;
-      z-index: 100;
-      width: 16px;
-      height: 16px;
-      background: url('~@/assets/home/kong.png') no-repeat;
-    }
-  }
-  .application-Area-son:hover {
-    opacity: 0.9;
-    color: #0058e1;
-    border: 1px #0558e1 solid;
-  }
-
-  .application-Area-down {
-    opacity: 0.9;
-    color: #0058e1;
-    border: 1px #0558e1 solid;
-    .application-Area-son-son {
-      position: absolute;
-      right: 0px;
-      top: 0px;
-      z-index: 100;
-      width: 16px;
-      height: 16px;
-      background: url('~@/assets/home/duihao.png') no-repeat;
-    }
-  }
-}
-
-:deep(.ant-image-img) {
-  width: 100%;
-  height: 100%;
-  object-fit: contain;
-}
-
-:deep(.ant-modal) {
-  width: 9.6rem;
-}
-
-:deep(.ant-transfer-list) {
-  width: 39.5%;
-  height: 5.2rem;
-}
-
-:deep(.ant-transfer-operation) {
-  flex-direction: row-reverse;
-  margin: 0 0.3rem;
-}
-
-:deep(.ant-btn) {
-  width: 0.56rem;
-  height: 0.4rem;
-  border-radius: 0.04rem;
-}
-
-:deep(.ant-btn:first-child) {
-  margin-left: 0.04rem;
-}
-
-:deep(.ant-modal-footer) {
-  border: 0;
-}
-
-:deep(.ant-modal-header) {
-  border: 0;
-}
-
-:deep(.ant-modal-title) {
-  line-height: 0.24rem;
-  font-size: 0.18rem;
-  color: #303133;
-}
-
-:deep(.ant-transfer-list-header) {
-  background: #f5f7fa;
-}
-
-:deep(.ant-transfer-list-header-selected) {
-  display: flex;
-  width: 90%;
-  flex-direction: row-reverse;
-  justify-content: space-between;
-  align-items: center;
-}
-
-:deep(.ant-transfer-list-header-title) {
-  font-size: 0.16rem;
-  color: #303133;
-  font-weight: 400;
-  text-align: left;
-}
-:deep(.ant-transfer-list-header .ant-checkbox-wrapper) {
-  display: none !important;
-}
-:deep(.ant-upload-list-item-name) {
-  width: 1rem;
-}
-
-.del {
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  font-size: 0.14rem;
-  margin-left: 0.2rem;
-
-  .delImg {
-    cursor: pointer;
-    display: inline-block;
-    width: 0.16rem;
-    height: 0.18rem;
-    background: url(~@/assets/home/sf_del.png) no-repeat;
-    margin-right: 0.05rem;
-  }
-
-  div {
-    cursor: pointer;
-  }
-}
-.item {
-  position: relative;
-  span:first-child {
-    width: unset;
-  }
-  .box {
-    display: flex;
-    align-items: center;
-    min-height: 32px;
-    // margin: 15px 0;
     & > div:nth-of-type(1) {
-      text-align: right;
-      width: 110px;
-      margin-right: 16px;
-      // display: flex;
-      align-items: center;
-    }
-    .required {
-      color: #e83e48;
-      margin-left: -6px;
+      margin-top: 0;
     }
   }
 
-  :deep(.the-new-release .box .first) {
-    justify-content: center !important;
+  .application-Area {
+    width: 5.2rem;
+    display: grid;
+    margin-top: -0.05rem;
+    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
 
-    padding: 10px 350px 0;
-    button {
+    .application-Area-son {
       cursor: pointer;
-      width: 80px;
-      height: 35px;
-      text-align: center;
+      font-size: 0.14rem;
+      width: 0.9rem;
+      height: 0.26rem;
+      border-radius: 0.13rem;
+      color: #333333;
+      background: #f5f5f5;
+      border: 0.01rem #cccccc solid;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      margin-top: 0.1rem;
+      font-weight: 500;
+    }
+
+    .application-Area-down {
+      background: #0087ff;
       color: #fff;
-      border: none;
-      border-radius: 6px;
-      background: yellow;
-    }
-    button:nth-of-type(1) {
-      color: red;
-      background: #e1edfa;
-    }
-    button:nth-of-type(2) {
-      background: yellow;
     }
   }
 
-  .requiredTips {
-    font-size: 14px;
-    color: #e83e48;
-    position: absolute;
-    bottom: -20px;
-    left: 110px;
+  :deep(.ant-image-img) {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+
+  :deep(.ant-modal) {
+    width: 9.6rem;
+  }
+
+  :deep(.ant-transfer-list) {
+    width: 39.5%;
+    height: 5.2rem;
+  }
+
+  :deep(.ant-transfer-operation) {
+    flex-direction: row-reverse;
+    margin: 0 0.3rem;
+  }
+
+  :deep(.ant-btn) {
+    width: 0.56rem;
+    height: 0.4rem;
+    border-radius: 0.04rem;
+  }
+
+  :deep(.ant-btn:first-child) {
+    margin-left: 0.04rem;
+  }
+
+  :deep(.ant-modal-footer) {
+    border: 0;
+  }
+
+  :deep(.ant-modal-header) {
+    border: 0;
+  }
+
+  :deep(.ant-modal-title) {
+    line-height: 0.24rem;
+    font-size: 0.18rem;
+    color: #303133;
+  }
+
+  :deep(.ant-transfer-list-header) {
+    background: #f5f7fa;
+  }
+
+  :deep(.ant-transfer-list-header-selected) {
+    display: flex;
+    width: 90%;
+    flex-direction: row-reverse;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  :deep(.ant-transfer-list-header-title) {
+    font-size: 0.16rem;
+    color: #303133;
+    font-weight: 400;
+    text-align: left;
+  }
+  :deep(.ant-transfer-list-header .ant-checkbox-wrapper) {
+    display: none !important;
+  }
+  :deep(.ant-upload-list-item-name) {
+    width: 1rem;
+  }
+
+  .del {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    font-size: 0.14rem;
+    margin-left: 0.2rem;
+
+    .delImg {
+      cursor: pointer;
+      display: inline-block;
+      width: 0.16rem;
+      height: 0.18rem;
+      background: url(~@/assets/home/sf_del.png) no-repeat;
+      margin-right: 0.05rem;
+    }
+
+    div {
+      cursor: pointer;
+    }
+  }
+  .item {
+    position: relative;
+    span:first-child {
+      width: unset;
+    }
+    .box {
+      display: flex;
+      align-items: center;
+      // margin: 15px 0;
+      & > div:nth-of-type(1) {
+        width: 105px;
+        display: flex;
+        align-items: center;
+      }
+      .required {
+        color: #f56c6c;
+        margin-right: 3px;
+      }
+    }
+    .requiredTips {
+      font-size: 14px;
+      color: #f56c6c;
+      position: absolute;
+      bottom: -20px;
+      left: 110px;
+    }
   }
-}
 </style>