Merge branch 'hi-ucs-dev' of http://15.2.21.221:3000/wuhongjian/hi-ucs into hi-ucs-dev

2022-06-29 18:37:29 +08:00 · 2022-06-29 18:37:29 +08:00 · ab7e377dea
parent ffaabe340a 50d0576a70
commit ab7e377dea
47 changed files with 2306 additions and 482 deletions
--- a/back/public/index.html
+++ b/back/public/index.html
@ -2,7 +2,7 @@
 * @Author: hisense.wuhongjian
 * @Date: 2022-04-11 10:11:40
 * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-06-23 18:30:45
+ * @LastEditTime: 2022-06-29 16:59:38
 * @Description: 告诉大家这是什么
 -->
 <!DOCTYPE html>
@ -42,8 +42,9 @@
  <% if (process.env.VUE_APP_NODE_ENV === 'dev') { %>
    <script>
      // window.SITE_CONFIG['apiURL'] = 'http://15.2.21.166:8888/renren-admin';
-    window.SITE_CONFIG['apiURL'] = 'http://124.222.94.39:8888/renren-admin';
-    // window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
+    // window.SITE_CONFIG['apiURL'] = 'http://124.222.94.39:8888/renren-admin';
+    window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
+    window.SITE_CONFIG['previewUrl'] = 'http://15.2.21.238:9796/';
    // window.SITE_CONFIG['apiURL'] = 'http://15.2.23.141:8000/renren-admin';
    // WebSocket地址
    window.SITE_CONFIG['socketURL'] ='ws://localhost:8080/renren-admin/websocket';
--- a/back/src/assets/img/workBench/NO1.png
+++ b/back/src/assets/img/workBench/NO1.png
--- a/back/src/assets/img/workBench/NO2.png
+++ b/back/src/assets/img/workBench/NO2.png
--- a/back/src/assets/img/workBench/NO3.png
+++ b/back/src/assets/img/workBench/NO3.png
--- a/back/src/assets/img/workBench/hasToDo.png
+++ b/back/src/assets/img/workBench/hasToDo.png
--- a/back/src/assets/img/workBench/one.png
+++ b/back/src/assets/img/workBench/one.png
--- a/back/src/assets/img/workBench/publish.png
+++ b/back/src/assets/img/workBench/publish.png
--- a/back/src/assets/img/workBench/todo.png
+++ b/back/src/assets/img/workBench/todo.png
--- a/back/src/assets/img/workBench/two.png
+++ b/back/src/assets/img/workBench/two.png
--- a/back/src/views/modules/ability/bsinfrastructure.vue
+++ b/back/src/views/modules/ability/bsinfrastructure.vue
@ -46,8 +46,8 @@
 <script>
 import mixinViewModule from '@/mixins/view-module'
 // import AddOrUpdate from './order-add-or-update'
-import {addDynamicRoute} from "@/router";
-import RelateApplication from "./bsabilityai-relate-application.vue"
+import { addDynamicRoute } from '@/router'
+import RelateApplication from './bsabilityai-relate-application.vue'
 export default {
  mixins: [mixinViewModule],
  data () {
@ -62,7 +62,7 @@ export default {
        orderId: '',
        status: '',
        userId: '',
-        type: "基础设施",
+        type: '基础设施'
      },
      // 关联应用弹窗
      relateApplicationVisible: false,
@ -75,31 +75,31 @@ export default {
  },
  components: {
    // AddOrUpdate,
-    RelateApplication,
+    RelateApplication
  },
  methods: {
-     //重置
-     resetDataList(){
-        this.dataForm=this.noDataForm;
-        this.page=1;                    // 当前页码
-        this.query();
+    // 重置
+    resetDataList () {
+      this.dataForm.orderId = ''
+      this.page = 1 // 当前页码
+      this.query()
    },
    // 点击关联应用按钮
-    showRelateApplication(row){
+    showRelateApplication (row) {
      this.$http.get(`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`).then(({ data: res }) => {
-        if( res && res.data ) {
-          this.relateApplicationVisible = true;
+        if (res && res.data) {
+          this.relateApplicationVisible = true
          this.relateInfo = {
            id: row.id,
            responseData: res.data,
            linkType: '2'
-          };
+          }
        }
      }).catch(() => { })
    },
    // 是否展示关联应用弹窗
-    handleIsShowRelatePopup(type) {
-      this.relateApplicationVisible = type;
+    handleIsShowRelatePopup (type) {
+      this.relateApplicationVisible = type
    }

  }
--- a/back/src/views/modules/activiti/demo/correction-process2.vue
+++ b/back/src/views/modules/activiti/demo/correction-process2.vue
@ -241,106 +241,105 @@ export default {
 }
 </script>
 <style scoped lang="scss">
-::v-deep .big-BOX{
-  background:rgba(244,245,248,0.8);
-  padding:24px;
-  h3{
-    font-size:16px;
-    color:#212121
+::v-deep .big-BOX {
+  background: rgba(244, 245, 248, 0.8);
+  padding: 24px;
+  h3 {
+    font-size: 16px;
+    color: #212121;
  }
-  p{
-    width:78%;
-    display:flex;
+  p {
+    width: 78%;
+    display: flex;
    justify-content: space-between;
-    color:#212121;
-    font-size:14px;
-    span{
-      display:inline-block;
-      margin-left:8px;
-      line-height:32px;
-      span{
-        font-weight:bold;
+    color: #212121;
+    font-size: 14px;
+    span {
+      display: inline-block;
+      margin-left: 8px;
+      line-height: 32px;
+      span {
+        font-weight: bold;
      }
    }
  }
-  p:last-of-type{
-    margin-top:16px;
-    width:100%;
-    span{
-      display:flex;
-      span{
-      padding:0 12px;
-      height:32px;
-      background:rgba(232,234,239,1);
-      border-radius:2px;
-      button{
-        background:unset;
-        border:0;
-        color:#0558e1;
-        font-size:14px;
+  p:last-of-type {
+    margin-top: 16px;
+    width: 100%;
+    span {
+      display: flex;
+      span {
+        padding: 0 12px;
+        height: 32px;
+        background: rgba(232, 234, 239, 1);
+        border-radius: 2px;
+        button {
+          background: unset;
+          border: 0;
+          color: #0558e1;
+          font-size: 14px;
        }
      }
    }
  }
 }
-::v-deep .AbilityApply{
-    margin-top:32px;
+::v-deep .AbilityApply {
+  margin-top: 32px;

-  h3{
-     font-size:16px;
-    color:#212121;
-    border-bottom:1px solid #dddee1;
-    padding-bottom:10px;
+  h3 {
+    font-size: 16px;
+    color: #212121;
+    border-bottom: 1px solid #dddee1;
+    padding-bottom: 10px;
  }
-  ul{
+  ul {
    padding-left: 0px;
-     li{
-      list-style:none;
+    li {
+      list-style: none;
      padding: 30px 0;
      border-bottom: 1px solid #dddee1;
-    display:flex;
-    img{
-      width:100px;
-      height:100px;
+      display: flex;
+      img {
+        width: 100px;
+        height: 100px;
      }
-    div{
-      margin-left:16px;
+      div {
+        margin-left: 16px;
        display: flex;
        flex-direction: column;
        justify-content: center;
-    h2{
-      margin-bottom:20px;
-      font-size:20px;
-      color:#000;
-      display:flex;
-      span{
-        display:block;
-        font-size:14px;
-        color:#ffffff;
-        margin-left:8px;
-        background:rgba(0,184,230,0.8);
+        h2 {
+          margin-bottom: 20px;
+          font-size: 20px;
+          color: #000;
+          display: flex;
+          span {
+            display: block;
+            font-size: 14px;
+            color: #ffffff;
+            margin-left: 8px;
+            background: rgba(0, 184, 230, 0.8);
            display: flex;
            align-items: center;
            padding: 0 5px;
            border-radius: 4px;
          }
        }
-     p{
-      margin-bottom:0;
+        p {
+          margin-bottom: 0;
        }
      }
    }
-    .clearfix:after{
-      display:block;
-      content:"";
-      clear:both;
+    .clearfix:after {
+      display: block;
+      content: "";
+      clear: both;
    }
-    .title{
-      color:#0558e1;
-      font-size:18px;
-      padding-bottom:0;
+    .title {
+      color: #0558e1;
+      font-size: 18px;
+      padding-bottom: 0;
      border-bottom: 0;
-
    }
    .title:before {
      content: "";
@ -353,68 +352,66 @@ export default {
      margin-right: 10px;
      margin-top: 6px;
    }
-
  }
 }
-::v-deep .agreeOr>div{
-  display:flex;
+::v-deep .agreeOr > div {
+  display: flex;
  align-items: center;
-  .el-input{
+  .el-input {
    margin-right: 10px;
    margin-left: 32px;
  }
-
 }
-::v-deep   .agreeOr>div:last-of-type{
-    margin-top:15px;
+::v-deep .agreeOr > div:last-of-type {
+  margin-top: 15px;
+}
+.blueAll {
+  ::v-deep .el-radio-button__inner {
+    width: 80px;
+    height: 32px;
+    line-height: 32px;
+    padding: 0;
+    border-radius: 2px;
+    background: #ffffff;
+    color: #0558e1;
+    border: 1px solid #0558e1;
  }
-  .blueAll{
-    ::v-deep .el-radio-button__inner{
-    width:80px;
-    height:32px;
-    line-height:32px;
-    padding:0;
-    border-radius:2px;
-    background:#ffffff;
-    color:#0558e1;
-    border:1px solid #0558e1;
-  }
-   ::v-deep .el-radio-button__orig-radio:checked+.el-radio-button__inner{
+  ::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
    box-shadow: unset !important;
-    background:#0558e1;
-    color:#ffffff;
+    background: #0558e1;
+    color: #ffffff;
  }
+}
+.inputBule {
+  width: 55px;
+  height: 32px;
+  line-height: 32px;
+  padding: 0;
+  border-radius: 2px;
+  background: #0558e1;
+  color: #ffffff;
+  border: 1px solid #0558e1;
+}
+.redAll {
+  margin-left: 10px;
+  ::v-deep .el-radio-button__inner {
+    width: 80px;
+    height: 32px;
+    line-height: 32px;
+    padding: 0;
+    border-radius: 2px;
+    border: 1px solid #e83a48;
+    background: #ffffff;
+    color: #e83a48;
+    margin-left: 10px;
  }
-  .inputBule{
-     width:55px;
-    height:32px;
-    line-height:32px;
-    padding:0;
-    border-radius:2px;
-    background:#0558e1;
-    color:#ffffff;
-    border:1px solid #0558e1;
-  }
-  .redAll{
-    margin-left:10px;
-    ::v-deep .el-radio-button__inner{
-    width:80px;
-    height:32px;
-    line-height:32px;
-    padding:0;
-    border-radius:2px;
-   border:1px solid #e83a48;
-    background:#ffffff;
-    color:#e83a48;
-    margin-left:10px;
-    }
-    ::v-deep .el-radio-button__orig-radio:checked+.el-radio-button__inner{
+  ::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
    box-shadow: unset !important;
-       color:#ffffff;
+    color: #ffffff;
    background: #e83a48;
  }
-  }
-  .blueInput{
-    width:55px;
-  }
+}
+.blueInput {
+  width: 55px;
+}
 </style>
--- a/back/src/views/modules/activiti/my-work-dynamics.vue
+++ b/back/src/views/modules/activiti/my-work-dynamics.vue
@ -132,7 +132,7 @@
            show-word-limit
          ></el-input>
        </el-form-item>
-        <el-form-item prop="title" label="摘要">
+        <el-form-item prop="note1" label="摘要">
          <el-input
            v-model="addDataFrom.note1"
            autocomplete="off"
@ -224,7 +224,7 @@
            show-word-limit
          ></el-input>
        </el-form-item>
-        <el-form-item prop="title" label="摘要">
+        <el-form-item prop="note1" label="摘要">
          <el-input
            v-model="eidtDataForm.note1"
            autocomplete="off"
@ -340,15 +340,15 @@
 <script>
 // @ is an alias to /src
 export default {
-  data() {
+  data () {
    return {
-      fileUploadUrl: window.SITE_CONFIG.apiURL + "/upload",
+      fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload',
      // 表格筛选条件对象
      queryData: {
-        keyworld: "",
+        keyworld: '',
        pageIndex: 1,
        pageSize: 10,
-        total: 0,
+        total: 0
      },
      // 表格数据数组对象
      tableData: [],
@ -359,307 +359,307 @@ export default {
      // imageUrl: '',
      // 新增数据表单对象
      addDataFrom: {
-        title: "",
-        note1: "",
-        content: "",
-        imageUrl: "",
-        delFlag: 0,
+        title: '',
+        note1: '',
+        content: '',
+        imageUrl: '',
+        delFlag: 0
      },
      // 新增数据表单验证对象
      addDataFromRules: {
-        title: [{ required: true, message: "请输入标题", trigger: "blur" }],
-        note1: [{ required: true, message: "请输入摘要", trigger: "blur" }],
-        content: [{ required: true, message: "请输入内容", trigger: "blur" }],
+        title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
+        note1: [{ required: true, message: '请输入摘要', trigger: 'blur' }],
+        content: [{ required: true, message: '请输入内容', trigger: 'blur' }],
        imageUrl: [
-          { required: true, message: "请输入图片地址", trigger: "blur" },
-        ],
+          { required: true, message: '请输入图片地址', trigger: 'blur' }
+        ]
      },
      editDataDialogVisabled: false,
      eidtDataForm: {
-        title: "",
-        note1: "",
-        content: "",
-        imageUrl: "",
+        title: '',
+        note1: '',
+        content: '',
+        imageUrl: ''
      },
      eidtDataFromRules: {
-        title: [{ required: true, message: "请输入标题", trigger: "blur" }],
-        note1: [{ required: true, message: "请输入摘要", trigger: "blur" }],
-        content: [{ required: true, message: "请输入内容", trigger: "blur" }],
+        title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
+        note1: [{ required: true, message: '请输入摘要', trigger: 'blur' }],
+        content: [{ required: true, message: '请输入内容', trigger: 'blur' }],
        imageUrl: [
-          { required: true, message: "请输入图片地址", trigger: "blur" },
-        ],
+          { required: true, message: '请输入图片地址', trigger: 'blur' }
+        ]
      },
      perviewDataDialogVisabled: false,
      previewData: {
-        title: "",
-        note1: "",
-        content: "",
-        imageUrl: "",
-        delFlag: 0,
+        title: '',
+        note1: '',
+        content: '',
+        imageUrl: '',
+        delFlag: 0
      },
-      previewImg: "", // 预览图片
+      previewImg: '', // 预览图片
      deleteDataArr: [],
-      dialogVisibleImg: false,
-    };
+      dialogVisibleImg: false
+    }
  },
-  created() {
-    this.getTableData();
+  created () {
+    this.getTableData()
  },
  methods: {
-    tableChange(val) {
-      this.deleteDataArr = val.map((item) => item.id);
-      console.log(this.deleteDataArr);
+    tableChange (val) {
+      this.deleteDataArr = val.map((item) => item.id)
+      console.log(this.deleteDataArr)
    },
-    restTableData() {
-      this.queryData.keyworld = "";
-      this.getTableData();
+    restTableData () {
+      this.queryData.keyworld = ''
+      this.getTableData()
    },
-    showView(file) {
-      this.previewImg = file.url;
-      this.dialogVisibleImg = true;
+    showView (file) {
+      this.previewImg = file.url
+      this.dialogVisibleImg = true
    },
-    getTableData() {
+    getTableData () {
      this.$http
-        .get("/workdynamics/page", {
+        .get('/workdynamics/page', {
          params: {
            limit: this.queryData.pageSize,
            page: this.queryData.pageIndex,
-            name: this.queryData.keyworld,
-          },
+            name: this.queryData.keyworld
+          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
-            return this.$message.error(res.msg);
+            return this.$message.error(res.msg)
          }
-          this.tableData = res.data.list;
-          this.queryData.total = res.data.total;
+          this.tableData = res.data.list
+          this.queryData.total = res.data.total
        })
-        .catch(() => {});
+        .catch(() => {})
    },
-    flashTableData() {
-      this.queryData.pageIndex = 1;
-      this.getTableData();
+    flashTableData () {
+      this.queryData.pageIndex = 1
+      this.getTableData()
    },
    // 分页大小更改
-    handleSizeChange(value) {
-      this.queryData.pageSize = value;
-      this.getTableData();
+    handleSizeChange (value) {
+      this.queryData.pageSize = value
+      this.getTableData()
    },
    // 当前索引更改
-    handleCurrentChange(val) {
-      this.queryData.pageIndex = val;
-      this.getTableData();
+    handleCurrentChange (val) {
+      this.queryData.pageIndex = val
+      this.getTableData()
    },
    // 新增数据窗口关闭事件
-    addDataDialogClose() {
-      this.$refs.addDataFormRef.resetFields();
-      this.addDataFrom.imageUrl = "";
-      this.$refs.addUpload.clearFiles();
+    addDataDialogClose () {
+      this.$refs.addDataFormRef.resetFields()
+      this.addDataFrom.imageUrl = ''
+      this.$refs.addUpload.clearFiles()
      // this.addDataFrom.imagesFiles = []
      // this.$refs.addDataFromUploadRef.clearFiles()
    },
-    editDataDialogClose() {
-      this.$refs.editDataFormRef.resetFields();
-      this.eidtDataForm.imageUrl = "";
-      this.$refs.editUpload.clearFiles();
+    editDataDialogClose () {
+      this.$refs.editDataFormRef.resetFields()
+      this.eidtDataForm.imageUrl = ''
+      this.$refs.editUpload.clearFiles()
    },
    // 追加数据
-    addDataDialogConfirm() {
+    addDataDialogConfirm () {
      this.$refs.addDataFormRef.validate(async (valid) => {
        if (valid) {
-          //console.log("新增新增", this.addDataFrom);
+          // console.log("新增新增", this.addDataFrom);
          this.$http
-            .post("/workdynamics/insert", this.addDataFrom)
+            .post('/workdynamics/insert', this.addDataFrom)
            .then(({ data: res }) => {
              if (res.code !== 0) {
-                return this.$message.error(res.msg);
+                return this.$message.error(res.msg)
              }
-              this.$message.success("新增成功");
-              this.addDataDialogVisabled = false;
-              this.getTableData();
+              this.$message.success('新增成功')
+              this.addDataDialogVisabled = false
+              this.getTableData()
            })
-            .catch(() => {});
+            .catch(() => {})
        } else {
-          this.$message.success("表单数据填写不完整");
+          this.$message.success('表单数据填写不完整')
        }
-      });
+      })
    },
    // 限定图片
-    handleExceed() {
-      this.$message({ type: "error", message: "最多支持一张图片上传" });
+    handleExceed () {
+      this.$message({ type: 'error', message: '最多支持一张图片上传' })
    },
    // 限制标题
-    titleExceed(str) {
+    titleExceed (str) {
      if (str.length >= 200) {
-        this.$message.error("标题文字不能超过200字");
+        this.$message.error('标题文字不能超过200字')
      }
    },
    // 限制内容
-    contentExceed(str) {
+    contentExceed (str) {
      if (str.length >= 2000) {
-        this.$message.error("内容文字不能超过2000字");
+        this.$message.error('内容文字不能超过2000字')
      }
    },
-    //限制摘要
-    noteExceed(str) {
+    // 限制摘要
+    noteExceed (str) {
      if (str.length >= 1000) {
-        this.$message.error("摘要文字不能超过1000字");
+        this.$message.error('摘要文字不能超过1000字')
      }
    },
    // 删除数据
-    deleteData(row) {
-      console.log(row);
-      this.$confirm("此操作将删除当前数据, 是否继续?", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
+    deleteData (row) {
+      console.log(row)
+      this.$confirm('此操作将删除当前数据, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
      })
        .then(async () => {
-          let ids = [];
+          let ids = []
          if (this.deleteDataArr.length > 1) {
-            ids = this.deleteDataArr;
+            ids = this.deleteDataArr
          } else {
-            ids = [row.id];
+            ids = [row.id]
          }
-          console.log(ids);
+          console.log(ids)
          this.$http
-            .delete("/workdynamics/delete", {
-              data: ids,
+            .delete('/workdynamics/delete', {
+              data: ids
            })
            .then(({ data: res }) => {
              if (res.code !== 0) {
-                return this.$message.error(res.msg);
+                return this.$message.error(res.msg)
              }
              this.$message({
-                type: "success",
-                message: "删除成功!",
-              });
-              this.getTableData();
-            });
+                type: 'success',
+                message: '删除成功!'
+              })
+              this.getTableData()
+            })
        })
        .catch(() => {
          this.$message({
-            type: "info",
-            message: "已取消删除",
-          });
-        });
+            type: 'info',
+            message: '已取消删除'
+          })
+        })
    },
-    //预览工作动态信息
-    async openPreviewData(row) {
-      console.log("预览预览", row);
+    // 预览工作动态信息
+    async openPreviewData (row) {
+      console.log('预览预览', row)
      const { data: res } = await this.$http.get(
        `workdynamics/select/${row.id}`
-      );
+      )

      if (res.code !== 0) {
-        return this.$message.error(res.msg);
+        return this.$message.error(res.msg)
      }

-      this.previewData = res.data;
+      this.previewData = res.data

-      this.perviewDataDialogVisabled = true;
+      this.perviewDataDialogVisabled = true
    },
-    perviewDataDialogClose() {
-      this.perviewDataDialogVisabled = false;
+    perviewDataDialogClose () {
+      this.perviewDataDialogVisabled = false
    },
-    handleAvatarSuccess(res, file) {
+    handleAvatarSuccess (res, file) {
      if (res.code !== 0) {
-        return this.$message.error(res.msg);
+        return this.$message.error(res.msg)
      }

-      this.addDataFrom.imageUrl = res.data;
+      this.addDataFrom.imageUrl = res.data
      // this.imageUrl = URL.createObjectURL(file.raw);
    },
-    beforeAvatarUpload(file) {
+    beforeAvatarUpload (file) {
      const isImage =
-        file.type === "image/jpeg" ||
-        file.type === "image/jpg" ||
-        file.type === "image/png";
-      const isLt2M = file.size / 1024 / 1024 < 2;
+        file.type === 'image/jpeg' ||
+        file.type === 'image/jpg' ||
+        file.type === 'image/png'
+      const isLt2M = file.size / 1024 / 1024 < 2

      if (!isImage) {
-        this.$message.error("上传头像图片只能是 JPG 格式!");
+        this.$message.error('上传头像图片只能是 JPG 格式!')
      }
      if (!isLt2M) {
-        this.$message.error("上传头像图片大小不能超过 2MB!");
+        this.$message.error('上传头像图片大小不能超过 2MB!')
      }
-      return isImage && isLt2M;
+      return isImage && isLt2M
    },
-    eidtHandleAvatarSuccess(res, file) {
+    eidtHandleAvatarSuccess (res, file) {
      if (res.code !== 0) {
-        return this.$message.error(res.msg);
+        return this.$message.error(res.msg)
      }

-      this.eidtDataForm.imageUrl = res.data;
+      this.eidtDataForm.imageUrl = res.data
      // this.imageUrl = URL.createObjectURL(file.raw);
    },
-    editBeforeAvatarUpload(file) {
+    editBeforeAvatarUpload (file) {
      const isImage =
-        file.type === "image/jpeg" ||
-        file.type === "image/jpg" ||
-        file.type === "image/png";
-      const isLt2M = file.size / 1024 / 1024 < 2;
+        file.type === 'image/jpeg' ||
+        file.type === 'image/jpg' ||
+        file.type === 'image/png'
+      const isLt2M = file.size / 1024 / 1024 < 2

      if (!isImage) {
-        this.$message.error("上传头像图片只能是 JPG 格式!");
+        this.$message.error('上传头像图片只能是 JPG 格式!')
      }
      if (!isLt2M) {
-        this.$message.error("上传头像图片大小不能超过 2MB!");
+        this.$message.error('上传头像图片大小不能超过 2MB!')
      }
-      return isImage && isLt2M;
+      return isImage && isLt2M
    },
-    async openEditDialog(row) {
+    async openEditDialog (row) {
      const { data: res } = await this.$http.get(
        `workdynamics/select/${row.id}`
-      );
+      )

      if (res.code !== 0) {
-        return this.$message.error(res.msg);
+        return this.$message.error(res.msg)
      }

-      this.eidtDataForm = res.data;
+      this.eidtDataForm = res.data

-      this.editDataDialogVisabled = true;
+      this.editDataDialogVisabled = true
    },
-    eidtDataDialogConfirm() {
+    eidtDataDialogConfirm () {
      this.$refs.editDataFormRef.validate(async (valid) => {
        if (valid) {
-          console.log(this.eidtDataForm);
+          console.log(this.eidtDataForm)
          this.$http
-            .put("/workdynamics/update", this.eidtDataForm)
+            .put('/workdynamics/update', this.eidtDataForm)
            .then(({ data: res }) => {
              if (res.code !== 0) {
-                return this.$message.error(res.msg);
+                return this.$message.error(res.msg)
              }
-              this.$message.success("编辑成功");
-              this.editDataDialogVisabled = false;
-              this.getTableData();
+              this.$message.success('编辑成功')
+              this.editDataDialogVisabled = false
+              this.getTableData()
            })
-            .catch(() => {});
+            .catch(() => {})
        } else {
-          this.$message.success("表单数据填写不完整");
+          this.$message.success('表单数据填写不完整')
        }
-      });
+      })
    },
-    addUploadRemoveFile(file, fileList) {
-      this.$refs.addUpload.clearFiles();
-      this.addDataFrom.imageUrl = "";
-    },
-    editUploadRemoveFile(file, fileList) {
-      this.$refs.editUpload.clearFiles();
-      this.eidtDataForm.imageUrl = "";
+    addUploadRemoveFile (file, fileList) {
+      this.$refs.addUpload.clearFiles()
+      this.addDataFrom.imageUrl = ''
    },
+    editUploadRemoveFile (file, fileList) {
+      this.$refs.editUpload.clearFiles()
+      this.eidtDataForm.imageUrl = ''
+    }
  },
  computed: {
-    editDialogShowFileList() {
+    editDialogShowFileList () {
      if (this.eidtDataForm.imageUrl) {
        return [
-          { name: this.eidtDataForm.imageUrl, url: this.eidtDataForm.imageUrl },
-        ];
+          { name: this.eidtDataForm.imageUrl, url: this.eidtDataForm.imageUrl }
+        ]
      }
-    },
-  },
-};
+    }
+  }
+}
 </script>
 <style scoped lang="scss">
 ::v-deep .el-checkbox__input.is-checked .el-checkbox__inner,
@ -728,7 +728,7 @@ export default {

  .preview-title {
    width: 100%;
-    height: 90px;
+    min-height: 90px;
    //margin-top: -40px;
    border-bottom: solid #c6c6c6 1px;
    .title-text {
@ -752,7 +752,7 @@ export default {
  }
  .preview-note {
    width: 100%;
-    height: 100px;
+    min-height: 100px;
    text-align: left;
    margin-top: 24px;
    text-indent: 2em;
--- a/back/src/views/modules/myAgent/CompetencyApplication.vue
+++ b/back/src/views/modules/myAgent/CompetencyApplication.vue
@ -2,7 +2,7 @@
 * @Author: hisense.liangjunhua
 * @Date: 2022-06-27 11:27:22
 * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-06-27 11:50:45
+ * @LastEditTime: 2022-06-29 16:31:26
 * @Description: 能力申请
 -->
 <template>
@ -43,11 +43,7 @@
        <el-table-column label="申请人" header-align="center" align="center">
          <template slot-scope="scope">
            <span>{{
-              (scope.row.params && scope.row.params.user) ||
-              (scope.row.params && scope.row.params.applyUserName) ||
-              (scope.row.params && scope.row.params.userName) ||
-              (scope.row.params && scope.row.params.undercarriageUserName)||
-              (scope.row.params && scope.row.params.name)
+              (scope.row.params && scope.row.params.tAbilityApplicationDTOList[0].user)
            }}</span>
          </template>
        </el-table-column>
@ -58,13 +54,7 @@
        >
          <template slot-scope="scope">
            <span>{{
-              (scope.row.params && scope.row.params.system) ||
-              (scope.row.params && scope.row.params.demandSubject) ||
-              (scope.row.params &&
-                scope.row.params.resourceDTO &&
-                scope.row.params.resourceDTO.name) ||
-              (scope.row.params && scope.row.params.undercarriageReason)||
-              (scope.row.params && scope.row.params.comment)
+              (scope.row.params && scope.row.params.tAbilityApplicationDTOList[0].title)
            }}</span>
          </template>
        </el-table-column>
@ -104,12 +94,12 @@
              @click="taskHandle(scope.row)"
              >{{ $t("manage") }}</el-button
            >
-            <el-button
+            <!-- <el-button
              type="text"
              size="small"
              @click="taskDetail(scope.row)"
              >{{ $t("process.viewFlowImage") }}</el-button
-            >
+            > -->
          </template>
        </el-table-column>
      </el-table>
@ -143,7 +133,8 @@ export default {
      },
      dataForm: {
        taskName: '',
-        taskId: ''
+        taskId: '',
+        processDefinitionKey: 'abilityprocess_v2'
      },
      processInstanceId: ''
    }
--- a/back/src/views/modules/myAgent/demo/competency-application.vue
+++ b/back/src/views/modules/myAgent/demo/competency-application.vue
@ -0,0 +1,459 @@
+<!--
+ * @Author: hisense.liangjunhua
+ * @Date: 2022-06-29 15:59:51
+ * @LastEditors: hisense.liangjunhua
+ * @LastEditTime: 2022-06-29 18:17:07
+ * @Description: 告诉大家这是什么
+-->
+<!--  流程业务表单   -->
+<template>
+  <el-card shadow="never" class="aui-card--fill" :key='showKey'>
+  <!-- 申请人详情 -->
+  <div>
+     <h3>申请人信息</h3>
+    <div class="big-BOX">
+      <p>
+        <span class="text">申请人：<span> {{dataForm.content.user || '--'}}</span></span>
+        <span class="text">电话：<span>{{dataForm.content.phone || '--'}}</span></span>
+        <span class="text">单位：<span>{{dataForm.content.unit || '--'}}</span></span>
+      </p>
+      <p>
+        <span class="text"> 能力申请标题：<span> {{dataForm.content.title|| '--'}}</span></span>
+        <span class="text">应用系统：<span>{{dataForm.content.applicationSystem || '--'}}</span></span>
+        <span class="text">应用场景：<span> {{dataForm.content.applicationSceneStr || '--'}}</span></span>
+      </p>
+      <p>
+        <span> 能力应用期望效果：<span> {{dataForm.content.effectWish|| '--'}}</span></span>
+      </p>
+      <p v-if="dataForm.content.enclosure">
+      <span> 申请附件：<span> {{dataForm.content.enclosure|| '--'}}<button  @click="downloadFile2(dataForm.content.enclosure)">预览</button></span></span>
+
+      </p>
+    </div>
+  </div>
+
+  <!-- 申请能力 -->
+  <div class="AbilityApply">
+     <h3>申请能力</h3>
+    <ul  v-for="item in dataList" :key="item.id">
+      <!-- <li class="title">{{item.address}}</li> -->
+      <li class="clearfix">
+            <img
+              src="~@/assets/img/imgLeft.png"
+            />
+            <div>
+            <h2>{{item.name}}<span>{{item.type}}</span></h2>
+            <p>{{item.describe}}</p>
+            </div>
+      </li>
+    </ul>
+  </div>
+    <!--  流程综合组件   -->
+  <!--   <ren-process-multiple
+      v-if="processVisible"
+      updateInstanceIdUrl="/processForm/tabilityapplication/updateInstanceId"
+      saveFormUrl="/processForm/tabilityapplication"
+      dataFormName="dataForm"
+      ref="renProcessMultiple"
+    ></ren-process-multiple> -->
+
+    <!-- 审批 -->
+    <div class="agreeOr">
+      <h3>审批</h3>
+      <div>
+        <el-radio-group v-model="agreeOrList" style="width:230px;">
+          <el-radio-button label="同意" class="blueAll">同意</el-radio-button>
+          <el-radio-button label="退回" class="redAll">退回</el-radio-button>
+        </el-radio-group>
+        <el-input v-if="agreeOrList ==='同意' " v-model="inputAgree" placeholder="请输入同意意见"></el-input>
+        <el-input v-if="agreeOrList ==='退回'" v-model="inputNo" placeholder="请输入退回意见"></el-input>
+         <el-button class="inputBule" @click="agreeOrNot">提交</el-button>
+      </div>
+    </div>
+
+ <!--  流程详情   -->
+    <ren-process-detail></ren-process-detail>
+  </el-card>
+</template>
+
+<script>
+// 引入工作流公共方法
+import processModule from '@/mixins/process-module'
+import debounce from 'lodash/debounce'
+import qs from 'qs'
+import RenProcessDetail from '@/components/ren-process-detail/src/ren-process-detail'
+export default {
+  // 注入公共方法
+  mixins: [processModule],
+  data () {
+    return {
+      visible: true,
+      showKey: 0,
+      // 表单属性是否可编辑
+      // fieldDisabled: false,
+      // dataForm: {
+      //   id: '',
+      //   user: '',
+      //   phone: '',
+      //   unit: '',
+      //   area: '',
+      //   system: '',
+      //   scene: '',
+      //   basis: ''
+      // }
+      dataForm: {
+        id: '',
+        content: {}
+      },
+      dataList: [],
+      inputAgree: '',
+      inputNo: '',
+      agreeOrList: '同意'
+    }
+  },
+  created () {
+    // 将业务KEY赋值给表单
+    console.log('params=================>', this.$route, this.$route.params)
+    this.dataForm.taskId = this.$route.params.taskId
+    this.init()
+    // // 流程回调
+    var callbacks = {
+      startProcessSuccessCallback: this.closeCurrentTab,
+      startProcessErrorCallback: this.startProcessErrorCallback,
+      taskHandleSuccessCallback: this.closeCurrentTab,
+      taskHandleErrorCallback: this.taskHandleErrorCallback,
+      formSaveSuccessCallback: null,
+      formSaveErrorCallback: null
+    }
+    // 初始化综合组件
+    this.initProcessMultiple(callbacks)
+  },
+  computed: {
+    // dataRule () {
+    //   return {
+    //     inputAgree: [
+    //       { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+    //     ],
+    //     inputNo: [
+    //       { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+    //     ]
+    //   }
+    // }
+  },
+  components: {
+    RenProcessDetail
+  },
+  methods: {
+    init () {
+      // this.visible = true
+      this.$nextTick(() => {
+        // this.$refs.dataForm.resetFields()
+        if (this.dataForm.taskId) {
+          // 如业务KEY已存在，不允许编辑
+          // this.fieldDisabled = true
+          this.getInfo()
+          console.log(this.dataForm, 'init')
+        }
+      })
+    },
+    downloadFile2 (url) {
+      window.open(
+        window.SITE_CONFIG.previewUrl +
+        'hisense_office/onlinePreview?url=' +
+        btoa(encodeURI(url))
+      )
+    },
+    // 获取信息
+    getInfo () {
+      this.$http
+        .get(`/act/task/getTaskVariables?taskId=${this.dataForm.taskId}&variableName=tAbilityApplicationDTOList`)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            console.log(res.data)
+            return this.$message.error(res.msg)
+          }
+          console.log(res.data, this.dataForm, 'elas============================')
+          if (res.data.tAbilityApplicationDTOList[0].applicationScene) {
+            res.data.tAbilityApplicationDTOList[0].applicationSceneStr = ''
+            res.data.tAbilityApplicationDTOList[0].applicationScene.map((val, index) => {
+              res.data.tAbilityApplicationDTOList[0].applicationSceneStr += val
+              if (index < res.data.tAbilityApplicationDTOList[0].applicationScene.length - 1) {
+                res.data.tAbilityApplicationDTOList[0].applicationSceneStr += '、'
+              }
+            })
+          }
+          this.dataForm.content = res.data.tAbilityApplicationDTOList[0]
+          res.data.tAbilityApplicationDTOList.map(val => {
+            this.$http.get('/resource/' + val.resourceId).then(res1 => {
+              console.log(res1.data.data, '1111111111111111111111111111111111')
+              this.dataList.push({
+                name: res1.data.data.name,
+                type: res1.data.data.type,
+                describe: res1.data.data.description
+              })
+            })
+          })
+        })
+        .catch(() => {})
+    },
+    // 申请能力
+    applyData () {
+      this.$http
+        .get(`/resource/select/${this.dataForm.instanceId}`)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            console.log(res.data, 'hhhhh')
+            // return this.$message.error(res.msg)
+          }
+          // console.log(res.data, 'elas')
+          // this.dataForm.content = res.data
+          // console.log(this.dataForm, 'ela')
+        })
+        .catch(() => {})
+    },
+    // 同意与退回
+    agreeOrNot: debounce(function () {
+      if (this.agreeOrList === '同意') {
+        console.log('this.dataForm', this.dataForm)
+        const params = qs.stringify({
+          taskId: this.dataForm.taskId,
+          comment: this.inputAgree
+        })
+        console.log(params)
+        this.$http.post('/act/task/complete?' + params).then(({ data: res }) => {
+          if (res.code !== 0) {
+            this.$message.error(res.msg)
+            if (this.callbacks.taskHandleErrorCallback) {
+              this.callbacks.taskHandleErrorCallback(res)
+            }
+            return
+          }
+          this.$message({
+            message: this.$t('prompt.success'),
+            type: 'success',
+            duration: 500,
+            onClose: () => {
+              this.visible = false
+              if (this.callbacks.taskHandleSuccessCallback) {
+                this.callbacks.taskHandleSuccessCallback(res)
+              }
+            }
+          })
+        }).catch(() => {})
+      } else if (this.agreeOrList === '退回') {
+        const params = qs.stringify({
+          taskId: this.dataForm.taskId,
+          comment: this.inputNo
+        })
+        this.$http.post('/act/task/backToFirst?', params).then(({ data: res }) => {
+          if (res.code !== 0) {
+            this.$message.error(res.msg)
+            if (this.callbacks.taskHandleErrorCallback) {
+              this.callbacks.taskHandleErrorCallback(res)
+            }
+            return
+          }
+          this.$message({
+            message: this.$t('prompt.success'),
+            type: 'success',
+            duration: 500,
+            onClose: () => {
+              this.visible = false
+              if (this.callbacks.taskHandleSuccessCallback) {
+                this.callbacks.taskHandleSuccessCallback(res)
+              }
+            }
+          })
+        })
+      }
+    }, 1000, { leading: true, trailing: false }),
+    // 启动流程出错回调
+    startProcessErrorCallback (data) {
+      console.log(data)
+    },
+    // 任务处理出错回调
+    taskHandleErrorCallback (data) {}
+  },
+  mounted () {
+    // this.applyData()
+  }
+}
+</script>
+<style scoped lang="scss">
+::v-deep .big-BOX {
+  background: rgba(244, 245, 248, 0.8);
+  padding: 24px;
+  h3 {
+    font-size: 16px;
+    color: #212121;
+  }
+  p {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    color: #212121;
+    font-size: 14px;
+    span {
+      display: inline-block;
+      margin-left: 8px;
+      line-height: 32px;
+      span {
+        font-weight: bold;
+      }
+    }
+    .text {
+      width: 500px;
+    }
+  }
+  p:last-of-type {
+    margin-top: 16px;
+    width: 100%;
+    span {
+      display: flex;
+      span {
+        padding: 0 12px;
+        height: 32px;
+        background: rgba(232, 234, 239, 1);
+        border-radius: 2px;
+        button {
+          background: unset;
+          border: 0;
+          color: #0558e1;
+          font-size: 14px;
+        }
+      }
+    }
+  }
+}
+::v-deep .AbilityApply {
+  margin-top: 32px;
+
+  h3 {
+    font-size: 16px;
+    color: #212121;
+    border-bottom: 1px solid #dddee1;
+    padding-bottom: 10px;
+  }
+  ul {
+    padding-left: 0px;
+    li {
+      list-style: none;
+      padding: 30px 0;
+      border-bottom: 1px solid #dddee1;
+      display: flex;
+      img {
+        width: 100px;
+        height: 100px;
+      }
+      div {
+        margin-left: 16px;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        h2 {
+          margin-bottom: 20px;
+          font-size: 20px;
+          color: #000;
+          display: flex;
+          span {
+            display: block;
+            font-size: 14px;
+            color: #ffffff;
+            margin-left: 8px;
+            background: rgba(0, 184, 230, 0.8);
+            display: flex;
+            align-items: center;
+            padding: 0 5px;
+            border-radius: 4px;
+          }
+        }
+        p {
+          margin-bottom: 0;
+        }
+      }
+    }
+    .clearfix:after {
+      display: block;
+      content: "";
+      clear: both;
+    }
+    .title {
+      color: #0558e1;
+      font-size: 18px;
+      padding-bottom: 0;
+      border-bottom: 0;
+    }
+    .title:before {
+      content: "";
+      width: 6px;
+      height: 6px;
+      display: inline-block;
+      border-radius: 50%;
+      background: #0558e1;
+      vertical-align: middle;
+      margin-right: 10px;
+      margin-top: 6px;
+    }
+  }
+}
+::v-deep .agreeOr > div {
+  display: flex;
+  align-items: center;
+  .el-input {
+    margin-right: 10px;
+    margin-left: 32px;
+  }
+}
+::v-deep .agreeOr > div:last-of-type {
+  margin-top: 15px;
+}
+.blueAll {
+  ::v-deep .el-radio-button__inner {
+    width: 80px;
+    height: 32px;
+    line-height: 32px;
+    padding: 0;
+    border-radius: 2px;
+    background: #ffffff;
+    color: #0558e1;
+    border: 1px solid #0558e1;
+  }
+  ::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
+    box-shadow: unset !important;
+    background: #0558e1;
+    color: #ffffff;
+  }
+}
+.inputBule {
+  width: 55px;
+  height: 32px;
+  line-height: 32px;
+  padding: 0;
+  border-radius: 2px;
+  background: #0558e1;
+  color: #ffffff;
+  border: 1px solid #0558e1;
+}
+.redAll {
+  margin-left: 10px;
+  ::v-deep .el-radio-button__inner {
+    width: 80px;
+    height: 32px;
+    line-height: 32px;
+    padding: 0;
+    border-radius: 2px;
+    border: 1px solid #e83a48;
+    background: #ffffff;
+    color: #e83a48;
+    margin-left: 10px;
+  }
+  ::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
+    box-shadow: unset !important;
+    color: #ffffff;
+    background: #e83a48;
+  }
+}
+.blueInput {
+  width: 55px;
+}
+</style>
--- a/back/src/views/modules/workBench/api.js
+++ b/back/src/views/modules/workBench/api.js
@ -0,0 +1,46 @@
+// /resource/getByDept
+import http from '@/utils/request';
+
+function Request({
+    methods, url, data, success, fali
+}) {
+    let _key = methods == 'get' ? 'params' : 'data';
+    return new Promise((resolve, reject) => {
+        http[methods](url, {
+            [_key]: data
+        }).then(res => {
+            resolve(res)
+        }, err => {
+            reject(err)
+        })
+    })
+
+}
+
+// /resource/getByDept:获取当前登录用户所在部门发布的资源
+
+// 部门待办列表
+export const getToDoTask = (data, success, fail) => {
+    Request({
+        methods: 'get',
+        url: '/act/task/deptToDoTaskPage',
+        data
+    }).then(res => {
+        success && success(res)
+    }).catch(err => {
+        fail && fail(err)
+    })
+}
+
+// 部门已办列表
+export const getHasToDoTask = (data, success, fail) => {
+    Request({
+        methods: 'get',
+        url: '/act/his/getDeptHandledInstancePage',
+        data
+    }).then(res => {
+        success && success(res)
+    }).catch(err => {
+        fail && fail(err)
+    })
+}
--- a/back/src/views/modules/workBench/components/bottom-view.vue
+++ b/back/src/views/modules/workBench/components/bottom-view.vue
@ -0,0 +1,18 @@
+<template>
+    <div class="bottom-view">
+
+    </div>
+</template>
+<script>
+export default {
+
+}
+</script>
+<style lang="scss" scoped>
+.bottom-view {
+    width: 100%;
+    height: 335px;
+    background: green;
+    box-sizing: border-box;
+}
+</style>
--- a/back/src/views/modules/workBench/components/center-view.vue
+++ b/back/src/views/modules/workBench/components/center-view.vue
@ -0,0 +1,19 @@
+<template>
+    <div class="center-view">
+
+    </div>
+</template>
+<script>
+export default {
+
+}
+</script>
+<style lang="scss" scoped>
+.center-view {
+    width: 100%;
+    height: 335px;
+    margin-bottom: 16px;
+    background: blue;
+    box-sizing: border-box;
+}
+</style>
--- a/back/src/views/modules/workBench/components/dept-chart-view.vue
+++ b/back/src/views/modules/workBench/components/dept-chart-view.vue
@ -0,0 +1,22 @@
+<template>
+    <div class="dept-box">
+       
+    </div>
+</template>
+<script>
+export default {
+    data() {
+        return {
+
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.dept-box {
+    width: 394px;
+    height: 252px;
+    margin: 16px;
+    background: pink;
+}
+</style>
--- a/back/src/views/modules/workBench/components/dept-todo-view.vue
+++ b/back/src/views/modules/workBench/components/dept-todo-view.vue
@ -0,0 +1,140 @@
+<template>
+    <div class="dept-box" :class="dataInfo.noMarginleft ? 'no-margin-left' : ''">
+        <div class="left-box"
+            :style="{ 'background': dataInfo.bgColor, 'border-right': `1px solid ${dataInfo.borderColor}` }">
+            <div class="content">
+                <img class="img" :src="dataInfo.imgSrc" />
+                <div class="title">{{ title }}</div>
+                <div class="flex-row-bottom">
+                    <span class="num" :style="{ 'color': dataInfo.textColor }">{{ formatNum(dataInfo.num) }}</span>
+                    <span class="unit" :style="{ 'color': dataInfo.textColor }">{{ dataInfo.unit || '个' }}</span>
+                </div>
+            </div>
+        </div>
+        <div class="list-box" v-if="dataInfo.list.length > 0">
+            <div class="list-item" v-for="(item, i) in dataInfo.list" :key="i">
+                {{ item[dataInfo.nameStr] || '--' }}
+            </div>
+            <div class="more">
+                查看更多 >
+            </div>
+        </div>
+        <div class="list-box flex-row-center no-data" v-else>
+            暂无数据
+        </div>
+    </div>
+</template>
+<script>
+export default {
+    data() {
+        return {
+
+        }
+    },
+    props: {
+        dataInfo: {
+            type: Object,
+            default: () => { }
+        },
+        title: {
+            type: String,
+            default: ''
+        },
+    },
+    methods: {
+        formatNum(num) {
+            return num || num === 0 ? num : '--'
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.no-margin-left {
+    margin-left: 0;
+}
+
+.flex-row-bottom {
+    display: flex;
+    justify-content: center;
+    align-items: baseline;
+}
+
+.flex-row-center {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.dept-box {
+    display: flex;
+    align-items: center;
+    width: 394px;
+    height: 252px;
+    margin: 16px;
+    background: rgba($color: #f1f3f6, $alpha: 0.8);
+}
+
+.left-box {
+    display: flex;
+    justify-content: center;
+    width: 80px;
+    border-radius: 2px;
+    height: 100%;
+}
+
+.img {
+    height: 50px;
+    width: 50px;
+    margin: 0 auto;
+}
+
+.content {
+    // margin-top: 57px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.title {
+    font-size: 18px;
+    color: #000;
+    margin-top: 25px;
+    margin-bottom: 18px;
+}
+
+.num {
+    font-size: 30px;
+}
+
+.unit {
+    font-size: 16px;
+    margin-left: 2px;
+}
+
+.list-box {
+    width: 314px;
+    height: 252px;
+}
+
+.list-item {
+    height: 44px;
+    line-height: 44px;
+    box-sizing: border-box;
+    border-bottom: 1px dashed #c6c6c6;
+    font-size: 16px;
+    color: #212121;
+}
+
+.more {
+    color: #212121;
+    font-size: 14px;
+    height: 32px;
+    line-height: 32px;
+    text-align: right;
+}
+
+.no-data {
+    font-size: 16px;
+    color: #212121;
+}
+</style>
--- a/back/src/views/modules/workBench/workBench.vue
+++ b/back/src/views/modules/workBench/workBench.vue
@ -0,0 +1,130 @@
+<template>
+    <div class="work-brnch-box">
+        <!-- 上 -->
+        <div class="flex-row-start top">
+            <div class="flex-row-start dept-left">
+                <dept-todo-view title="部门待办" :dataInfo="toToData"></dept-todo-view>
+                <dept-todo-view title="部门已办" :dataInfo="hasToDodoData"></dept-todo-view>
+            </div>
+            <div class="dept-chart-box"></div>
+        </div>
+        <!-- 中 -->
+        <div class="center">
+            <center-view></center-view>
+        </div>
+        <!-- 下 -->
+        <div class="bottom">
+            <bottom-view></bottom-view>
+        </div>
+    </div>
+</template>
+<script>
+import BottomView from '../workBench/components/bottom-view.vue'
+import CenterView from '../workBench/components/center-view.vue'
+import deptTodoView from '../workBench/components/dept-todo-view.vue'
+import * as Apis from './api'
+
+export default {
+    components: {
+        deptTodoView,
+        BottomView,
+        CenterView,
+    },
+    data() {
+        return {
+            // 部门待办
+            toToData: {
+                color: '#f86f01',
+                imgSrc: require('@/assets/img/workBench/todo.png'),
+                bgColor: 'rgba(228,138,1,0.12)',
+                borderColor: 'rgba(250,123,12,0.54)',
+                textColor: '#f86f01',
+                num: 34,
+                list: [],
+                nameStr: 'taskName'
+            },
+            // 部门已办
+            hasToDodoData: {
+                noMarginleft: true,
+                color: '#21b107',
+                imgSrc: require('@/assets/img/workBench/hasToDo.png'),
+                bgColor: 'rgba(37,165,13,0.12)',
+                borderColor: 'rgba(49,194,20,0.54)',
+                textColor: '#21b107',
+                num: 34,
+                list: [],
+                nameStr: 'processDefinitionName'
+            }
+        }
+    },
+    mounted() {
+        this.getToDo()
+        this.getHasToDo()
+    },
+    methods: {
+        // 待办
+        getToDo() {
+            let data = {
+                limit: 5,
+                page: 1,
+            }
+            Apis.getToDoTask(data, res => {
+                if (res.data.code !== 0) {
+                    return;
+                }
+                console.log('res----待办-------->', res.data);
+                this.toToData.list = res.data.data.records || []
+            }, err => {
+                console.log('err-----待办------->', err);
+            })
+        },
+        // 已办
+        getHasToDo() {
+            let data = {
+                limit: 5,
+                page: 1,
+            }
+            Apis.getHasToDoTask(data, res => {
+                if (res.data.code !== 0) {
+                    return;
+                }
+                console.log('res----已办-------->', res.data);
+                this.hasToDodoData.list = res.data.data.records || []
+            }, err => {
+                console.log('err-----已办------->', err);
+            })
+        },
+    },
+}
+</script>
+
+
+<style lang="scss" scoped>
+.margin-h-16 {
+    margin: 0 16px;
+}
+
+.flex-row-start {
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+}
+
+.work-brnch-box {
+    .top {
+        height: 284px;
+        margin-bottom: 16px;
+        background: #fff;
+    }
+
+    .dept-left {
+        width: 836px;
+    }
+
+    .dept-chart-box {
+        width: 780px;
+        height: 100%;
+        background: orange;
+    }
+}
+</style>
--- a/front/public/index.html
+++ b/front/public/index.html
@ -2,7 +2,7 @@
 * @Author: hisense.wuhongjian
 * @Date: 2022-03-29 16:45:25
 * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-06-29 16:00:06
+ * @LastEditTime: 2022-06-29 18:37:11
 * @Description: 告诉大家这是什么
 -->
 <!DOCTYPE html>
@ -45,9 +45,9 @@
    // window.SITE_CONFIG['apiURL'] = 'http://10.134.135.9:8888/renren-admin';
    // 开发
    window.SITE_CONFIG['backUrl'] = 'http://15.2.21.238:9797';
-    window.SITE_CONFIG['previewUrl'] = 'http://15.2.21.238:9796';
+    window.SITE_CONFIG['previewUrl'] = 'http://15.2.21.238:9796/';
    window.SITE_CONFIG['frontUrl'] = 'http://15.2.21.238:9796/document/#/devModelFile/';
-    window.SITE_CONFIG['apiURL'] = 'http://15.2.21.239:8888/renren-admin';
+    window.SITE_CONFIG['apiURL'] = 'http://15.2.21.238:8888/renren-admin';
    window.SITE_CONFIG['POI_URL'] = 'http://15.2.21.238:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
    // 穿透版本
    // window.SITE_CONFIG['backUrl'] = 'http://124.222.94.39:9797';
--- a/front/src/api/home.js
+++ b/front/src/api/home.js
@ -1,8 +1,8 @@
 /*
 * @Author: hisense.wuhongjian
 * @Date: 2022-04-01 19:19:40
- * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-06-22 18:59:03
+ * @LastEditors: hisense.liangjunhua
+ * @LastEditTime: 2022-06-29 14:34:24
 * @Description: 告诉大家这是什么
 */
 import request from '@/utils/request'
@ -114,7 +114,7 @@ export function lastestPage(params) {
 // 提交申请
 export function submitApply(data) {
  return request({
-    url: '/ability/center/apply',
+    url: '/ability/center/v2/apply',
    method: 'post',
    data,
  })
@ -297,3 +297,11 @@ export function getDataResource(data) {
    data,
  })
 }
+//应用详情列表
+export function queryPartAppByKeyId(params) {
+  return request({
+    url: 'dataResourceRel/queryPart4AppByKeyId',
+    method: 'get',
+    params,
+  })
+}
--- a/front/src/api/personalCenter.js
+++ b/front/src/api/personalCenter.js
@ -150,6 +150,16 @@ export function nengliziyuanshangjiaapply(params) {
    params,
  })
 }
+export function getTaskVariables(params) {
+  return request({
+    url:
+      '/act/task/getTaskVariables?taskId=' +
+      params.taskId +
+      '&variableName=tAbilityApplicationDTOList',
+    method: 'get',
+    params,
+  })
+}
 // 能力下架申请
 export function undercarriage(data) {
  return request({
--- a/front/src/views/demandCenter/demandDetails.vue
+++ b/front/src/views/demandCenter/demandDetails.vue
@ -231,6 +231,7 @@
            size="small"
            pageSize="8"
            :total="total"
+            v-model:current="page"
            @change="handleCurrentChange"
          />
        </a-list>
@ -248,7 +249,7 @@
  import {
    demandComment,
    demandCommentPage,
-    demandCommentDelete,
+    // demandCommentDelete,
    demandCommentApply,
  } from '@/api/demandCenter'
  import { getUser, getUserInfo } from '@/api/home'
@ -264,15 +265,15 @@
    })
  })
  //删除提示框
-  const confirm = (item) => {
-    console.log(item)
-    evaluateDelete(item)
-  }
+  // const confirm = (item) => {
+  //   console.log(item)
+  //   evaluateDelete(item)
+  // }

-  const cancel = (e) => {
-    console.log(e)
-    message.error('已取消删除')
-  }
+  // const cancel = (e) => {
+  //   console.log(e)
+  //   message.error('已取消删除')
+  // }
  // const store = useStore()
  const router = useRouter()

@ -322,14 +323,14 @@
  //   })
  // }

-  const evaluateDelete = (item) => {
-    demandCommentDelete([item.id]).then((res) => {
-      if (res.data.code == 0) {
-        message.success('删除评论成功！')
-      }
-      evaluateList()
-    })
-  }
+  // const evaluateDelete = (item) => {
+  //   demandCommentDelete([item.id]).then((res) => {
+  //     if (res.data.code == 0) {
+  //       message.success('删除评论成功！')
+  //     }
+  //     evaluateList()
+  //   })
+  // }
  const evaluateList = () => {
    const params = {
      page: page.value,
@ -339,6 +340,7 @@
    demandCommentPage(params).then((res) => {
      evaluateData.value = res.data.data.list
      total.value = res.data.data.total
+      console.log(evaluateData, 'evaluateData')
    })
  }

@ -382,6 +384,7 @@
    // formName.value = formData.value
    const id = router.currentRoute.value.query.id
    getDemandForm(id).then((res) => {
+      console.log(res, 'res')
      const { data } = res.data
      formName.value.applyUserName = data.applyUserName
      formName.value.applyUserPhone = data.applyUserPhone
--- a/front/src/views/detailsAll/AlgorithmDetails.vue
+++ b/front/src/views/detailsAll/AlgorithmDetails.vue
@ -21,6 +21,12 @@
      id="algorithm-display"
      class="scrollBox"
    ></algorithm-display>
+    <!-- 关联能力 -->
+    <algorithm-associated-ability
+      :associatedComponents="associatedComponents"
+      id="algorithm-associated-ability"
+      class="scrollBox"
+    ></algorithm-associated-ability>
    <!-- 算法优势 -->
    <algorithm-advantage
      :dataList="dataList.data"
@ -70,6 +76,7 @@
 </template>
 <script setup>
  import AlgorithmTopDetails from '@/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue'
+  import AlgorithmAssociatedAbility from '@/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue'
  import AlgorithmNavigation from '@/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue'
  import AlgorithmDisplay from '@/views/detailsAll/components/Algorithm/AlgorithmDisplay.vue'
  import AlgorithmAdvantage from '@/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue'
@ -81,7 +88,7 @@
  import AlgorithmCommonProblem from '@/views/detailsAll/components/Algorithm/AlgorithmCommonProblem' //常见问题
  import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
  import { useRouter } from 'vue-router'
-  import { updateVisits, selectOne } from '@/api/home'
+  import { updateVisits, selectOne, queryPartAppByKeyId } from '@/api/home'
  import mybus from '@/myplugins/mybus'
  const router = useRouter()
  const scrollTop = ref(0)
@ -90,6 +97,11 @@
  const dataList = reactive({ data: {} })
  const id = router.currentRoute.value.query.id
  const obj = JSON.parse(window.sessionStorage.getItem('preview'))
+  const associatedComponents = ref([
+    { type: '应用资源', dataList: [] },
+    { type: '数据资源', dataList: [] },
+    { type: '基础设施', dataList: [] },
+  ])
  document.documentElement.style.transition = 'all 0.3s ease'
  document.documentElement.scrollTop = 0
  document.body.style.transition = 'all 0.3s ease'
@ -148,6 +160,15 @@
          })
        }
      })
+      associatedComponents.value.map((item, index) => {
+        let queryPartAppByKeyIdParams = {
+          keyId: id,
+          type: item.type,
+        }
+        queryPartAppByKeyId(queryPartAppByKeyIdParams).then((res) => {
+          associatedComponents.value[index].dataList = res.data.data
+        })
+      })
    } else if (obj) {
      dataList.data = obj
      console.log('预览==============', obj)
--- a/front/src/views/detailsAll/ApplicationDetails.vue
+++ b/front/src/views/detailsAll/ApplicationDetails.vue
@ -29,6 +29,12 @@
      id="application-associated-components"
      class="scrollBox"
    ></application-associated-components>
+    <!-- 关联能力 -->
+    <application-associated-ability
+      :associatedComponents="associatedComponents"
+      id="application-associated-ability"
+      class="scrollBox"
+    ></application-associated-ability>
    <!-- 功能介绍-->
    <application-function-intorduction
      :dataList="dataList.data"
@ -64,6 +70,7 @@
 <script setup>
  import ApplicationAbilityToise from '@/views/detailsAll/components/Application/ApplicationAbilityToise.vue'
  import ApplicationAssociatedComponents from '@/views/detailsAll/components/Application/ApplicationAssociatedComponents.vue'
+  import ApplicationAssociatedAbility from '@/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue'
  import ApplicationOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue'
  import ApplicationFunctionIntorduction from '@/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue'
  import ApplicationDeploymentAndSecurity from '@/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue'
@ -73,8 +80,13 @@
  import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
  import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
  import { useRouter } from 'vue-router'
-  import { updateVisits, selectOne } from '@/api/home'
+  import { updateVisits, selectOne, queryPartAppByKeyId } from '@/api/home'
  import mybus from '@/myplugins/mybus'
+  const associatedComponents = ref([
+    { type: '组件服务', dataList: [] },
+    { type: '数据资源', dataList: [] },
+    { type: '基础设施', dataList: [] },
+  ])
  const router = useRouter()
  const scrollTop = ref(0)
  const domArr = ref([])
@ -140,6 +152,15 @@
          })
        }
      })
+      associatedComponents.value.map((item, index) => {
+        let queryPartAppByKeyIdParams = {
+          keyId: id,
+          type: item.type,
+        }
+        queryPartAppByKeyId(queryPartAppByKeyIdParams).then((res) => {
+          associatedComponents.value[index].dataList = res.data.data
+        })
+      })
    } else if (obj) {
      dataList.data = obj
      console.log('预览==============', obj)
--- a/front/src/views/detailsAll/BusinessDetails.vue
+++ b/front/src/views/detailsAll/BusinessDetails.vue
@ -21,6 +21,12 @@
      id="business-presentation"
      class="scrollBox"
    ></business-presentation>
+    <!-- 关联能力 -->
+    <business-associated-ability
+      :associatedComponents="associatedComponents"
+      id="business-associated-ability"
+      class="scrollBox"
+    ></business-associated-ability>
    <!-- 功能介绍-->
    <business-function-intorduction
      :dataList="dataList.data"
@ -55,6 +61,7 @@
 </template>
 <script setup>
  import BusinessApplicationCase from '@/views/detailsAll/components/Business/BusinessApplicationCase.vue' // 应用案例
+  import BusinessAssociatedAbility from '@/views/detailsAll/components/Business/BusinessAssociatedAbility.vue'
  import BusinessApplicationScenarios from '@/views/detailsAll/components/Business/BusinessApplicationScenarios.vue' // 应用场景
  import BusinessFunctionIntorduction from '@/views/detailsAll/components/Business/BusinessFunctionIntorduction.vue' // 功能介绍
  import BusinessTopDetails from '@/views/detailsAll/components/Business/BusinessTopDetails.vue' // 头部基本信息
@ -64,7 +71,7 @@
  import BusinessCommonProblem from '@/views/detailsAll/components/Business/BusinessCommonProblem' //常见问题
  import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
  import { useRouter } from 'vue-router'
-  import { updateVisits, selectOne } from '@/api/home'
+  import { updateVisits, selectOne, queryPartAppByKeyId } from '@/api/home'
  import mybus from '@/myplugins/mybus'
  const router = useRouter()
  const scrollTop = ref(0)
@ -73,6 +80,11 @@
  const dataList = reactive({ data: {} })
  const id = router.currentRoute.value.query.id
  const obj = JSON.parse(window.sessionStorage.getItem('preview'))
+  const associatedComponents = ref([
+    { type: '应用资源', dataList: [] },
+    { type: '数据资源', dataList: [] },
+    { type: '基础设施', dataList: [] },
+  ])
  document.documentElement.style.transition = 'all 0.3s ease'
  document.documentElement.scrollTop = 0
  document.body.style.transition = 'all 0.3s ease'
@ -131,6 +143,15 @@
          })
        }
      })
+      associatedComponents.value.map((item, index) => {
+        let queryPartAppByKeyIdParams = {
+          keyId: id,
+          type: item.type,
+        }
+        queryPartAppByKeyId(queryPartAppByKeyIdParams).then((res) => {
+          associatedComponents.value[index].dataList = res.data.data
+        })
+      })
    } else if (obj) {
      dataList.data = obj
      console.log('预览==============', obj)
--- a/front/src/views/detailsAll/DeveloperComponents.vue
+++ b/front/src/views/detailsAll/DeveloperComponents.vue
@ -21,6 +21,12 @@
      id="eveloper-presentation"
      class="scrollBox"
    ></Developer-presentation>
+    <!-- 关联能力 -->
+    <developer-associated-ability
+      :associatedComponents="associatedComponents"
+      id="developer-associated-ability"
+      class="scrollBox"
+    ></developer-associated-ability>
    <!-- 功能介绍-->
    <developer-function-intorduction
      :dataList="dataList.data"
@ -61,6 +67,7 @@
 </template>
 <script setup>
  import DeveloperApplicationScenarios from '@/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue' //应用场景
+  import DeveloperAssociatedAbility from '@/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue'
  import DeveloperOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue' //使用方式
  import DeveloperFunctionIntorduction from '@/views/detailsAll/components/Developer/DeveloperFunctionIntorduction.vue' //功能介绍
  import DeveloperApplicationCase from '@/views/detailsAll/components/Developer/DeveloperApplicationCase' //应用案例
@ -71,7 +78,7 @@
  import DeveloperTrial from '@/views/detailsAll/components/Developer/DeveloperTrial' //组件试用
  import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
  import { useRouter } from 'vue-router'
-  import { updateVisits, selectOne } from '@/api/home'
+  import { updateVisits, selectOne, queryPartAppByKeyId } from '@/api/home'
  import mybus from '@/myplugins/mybus'
  const router = useRouter()
  const scrollTop = ref(0)
@ -80,6 +87,11 @@
  const dataList = reactive({ data: {} })
  const id = router.currentRoute.value.query.id
  const obj = JSON.parse(window.sessionStorage.getItem('preview'))
+  const associatedComponents = ref([
+    { type: '应用资源', dataList: [] },
+    { type: '数据资源', dataList: [] },
+    { type: '基础设施', dataList: [] },
+  ])
  document.documentElement.style.transition = 'all 0.3s ease'
  document.documentElement.scrollTop = 0
  document.body.style.transition = 'all 0.3s ease'
@ -138,6 +150,15 @@
          })
        }
      })
+      associatedComponents.value.map((item, index) => {
+        let queryPartAppByKeyIdParams = {
+          keyId: id,
+          type: item.type,
+        }
+        queryPartAppByKeyId(queryPartAppByKeyIdParams).then((res) => {
+          associatedComponents.value[index].dataList = res.data.data
+        })
+      })
    } else if (obj) {
      dataList.data = obj
      console.log('预览==============', obj)
--- a/front/src/views/detailsAll/LayerService.vue
+++ b/front/src/views/detailsAll/LayerService.vue
@ -29,6 +29,12 @@
      id="service-information"
      class="scrollBox"
    ></layer-service-information>
+    <!-- 关联能力 -->
+    <layer-service-associated-ability
+      :associatedComponents="associatedComponents"
+      id="layer-service-associated-ability"
+      class="scrollBox"
+    ></layer-service-associated-ability>
    <!-- 应用场景 -->
    <layer-service-application-scenarios
      :dataList="dataList.data"
@ -63,6 +69,7 @@
 </template>
 <script setup>
  import LayerServiceApplicationCase from '@/views/detailsAll/components/LayerService/LayerServiceApplicationCase' //应用案例
+  import LayerServiceAssociatedAbility from '@/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue'
  import LayerServiceApplicationScenarios from '@/views/detailsAll/components/LayerService/LayerServiceApplicationScenarios.vue' //应用场景
  import LayerServiceCommonProblem from '@/views/detailsAll/components/LayerService/LayerServiceCommonProblem' //常见问题
  import LayerServiceInformation from '@/views/detailsAll/components/LayerService/LayerServiceInformation.vue' //图层信息
@ -73,7 +80,7 @@
  import LayerServiceUsageMode from '@/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue' //使用方式
  import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
  import { useRouter } from 'vue-router'
-  import { updateVisits, selectOne } from '@/api/home'
+  import { updateVisits, selectOne, queryPartAppByKeyId } from '@/api/home'
  import mybus from '@/myplugins/mybus'
  const router = useRouter()
  const scrollTop = ref(0)
@ -82,6 +89,11 @@
  const dataList = reactive({ data: {} })
  const id = router.currentRoute.value.query.id
  const obj = JSON.parse(window.sessionStorage.getItem('preview'))
+  const associatedComponents = ref([
+    { type: '应用资源', dataList: [] },
+    { type: '数据资源', dataList: [] },
+    { type: '基础设施', dataList: [] },
+  ])
  document.documentElement.style.transition = 'all 0.3s ease'
  document.documentElement.scrollTop = 0
  document.body.style.transition = 'all 0.3s ease'
@ -140,6 +152,15 @@
          })
        }
      })
+      associatedComponents.value.map((item, index) => {
+        let queryPartAppByKeyIdParams = {
+          keyId: id,
+          type: item.type,
+        }
+        queryPartAppByKeyId(queryPartAppByKeyIdParams).then((res) => {
+          associatedComponents.value[index].dataList = res.data.data
+        })
+      })
    } else if (obj) {
      dataList.data = obj
      console.log('预览==============', obj)
--- a/front/src/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue
+++ b/front/src/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue
@ -0,0 +1,127 @@
+<template>
+  <div class="application-associated-ability" v-if="flag">
+    <detals-title title="关联能力" type="RELEVANCE"></detals-title>
+    <div class="application-associated-ability-main">
+      <div
+        class="associated-ability-card"
+        v-for="(item, index) in dataFrom"
+        :key="item.type"
+      >
+        <div class="associated-ability-card-title">
+          {{ item.type }}
+        </div>
+        <div class="associated-ability-card-content">
+          <div
+            class="associated-ability-card-content-font"
+            v-for="(dataListitem, dataListindex) in item.dataList"
+            :key="dataListitem.id"
+            @click="switchFunction(dataListitem.id)"
+          >
+            <span>{{ dataListindex + 1 }}、</span>
+            {{ dataListitem.name }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { ref, defineProps, watch } from 'vue'
+  import { useRouter } from 'vue-router'
+  const router = useRouter()
+  import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
+  const props = defineProps({
+    associatedComponents: { type: Array, default: null },
+  })
+  const dataFrom = ref([])
+  const flag = ref(true)
+  const oldid = router.currentRoute.value.query.id
+  //点击查看详情
+  const switchFunction = (id) => {
+    router.push({
+      path: '/details',
+      query: {
+        id: id,
+      },
+    })
+  }
+  if (props.associatedComponents) {
+    flag.value = true
+    dataFrom.value = props.associatedComponents
+    console.log('dataFrom.value', dataFrom.value)
+  } else {
+    flag.value = false
+  }
+  watch(
+    () => props.associatedComponents,
+    (val) => {
+      if (val) {
+        flag.value = true
+        dataFrom.value = props.associatedComponents
+        console.log('dataFrom.value', dataFrom.value)
+      } else {
+        flag.value = false
+      }
+    }
+  )
+  watch(
+    () => router.currentRoute.value.query.id,
+    (newValue, oldValue) => {
+      if (oldid != router.currentRoute.value.query.id) {
+        window.location.reload()
+      }
+    },
+    { immediate: true }
+  )
+</script>
+
+<style lang="less" scoped>
+  .application-associated-ability {
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .application-associated-ability-main {
+      margin-top: 0.4rem;
+      width: 13.14rem;
+      display: flex;
+      justify-content: space-between;
+      .associated-ability-card {
+        width: 4.28rem;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        border: 1px solid #e4e6f5;
+        border-radius: 0.1rem;
+        padding-bottom: 0.3rem;
+        cursor: pointer;
+        .associated-ability-card-title {
+          padding-top: 0.3rem;
+          font-size: 0.22rem;
+          text-align: center;
+        }
+        .associated-ability-card-content {
+          width: 100%;
+          margin-top: 0.25rem;
+          padding-left: 0.3rem;
+          .associated-ability-card-content-font {
+            font-size: 0.18rem;
+            color: #999;
+            margin-right: 0.15rem;
+            margin-top: 0.15rem;
+          }
+          .associated-ability-card-content-font:hover {
+            color: #0058e1;
+          }
+        }
+      }
+      .associated-ability-card:hover {
+        border-radius: 0.02rem;
+        border: 0.01rem solid #0058e1;
+        box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
+      }
+    }
+  }
+</style>
--- a/front/src/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue
+++ b/front/src/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue
@ -32,6 +32,10 @@
      name: '算法优势',
      key: 'algorithm-advantage',
    },
+    {
+      name: '关联能力',
+      key: 'algorithm-associated-ability',
+    },
    {
      name: '应用场景',
      key: 'application-scenarios',
@ -87,6 +91,7 @@
        list.value.push('使用方式')
      }
    })
+    list.value.push('关联能力')
    navList.value.forEach((item) => {
      console.log(item)
      if (list.value.indexOf(item.name) > -1) {
@ -131,6 +136,7 @@
            list.value.push('使用方式')
          }
        })
+        list.value.push('关联能力')
        navList.value.forEach((item) => {
          console.log(item)
          if (list.value.indexOf(item.name) > -1) {
--- a/front/src/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue
+++ b/front/src/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue
@ -0,0 +1,127 @@
+<template>
+  <div class="application-associated-ability" v-if="flag">
+    <detals-title title="关联能力" type="RELEVANCE"></detals-title>
+    <div class="application-associated-ability-main">
+      <div
+        class="associated-ability-card"
+        v-for="(item, index) in dataFrom"
+        :key="item.type"
+      >
+        <div class="associated-ability-card-title">
+          {{ item.type }}
+        </div>
+        <div class="associated-ability-card-content">
+          <div
+            class="associated-ability-card-content-font"
+            v-for="(dataListitem, dataListindex) in item.dataList"
+            :key="dataListitem.id"
+            @click="switchFunction(dataListitem.id)"
+          >
+            <span>{{ dataListindex + 1 }}、</span>
+            {{ dataListitem.name }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { ref, defineProps, watch } from 'vue'
+  import { useRouter } from 'vue-router'
+  const router = useRouter()
+  import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
+  const props = defineProps({
+    associatedComponents: { type: Array, default: null },
+  })
+  const dataFrom = ref([])
+  const flag = ref(true)
+  const oldid = router.currentRoute.value.query.id
+  //点击查看详情
+  const switchFunction = (id) => {
+    router.push({
+      path: '/details',
+      query: {
+        id: id,
+      },
+    })
+  }
+  if (props.associatedComponents) {
+    flag.value = true
+    dataFrom.value = props.associatedComponents
+    console.log('dataFrom.value', dataFrom.value)
+  } else {
+    flag.value = false
+  }
+  watch(
+    () => props.associatedComponents,
+    (val) => {
+      if (val) {
+        flag.value = true
+        dataFrom.value = props.associatedComponents
+        console.log('dataFrom.value', dataFrom.value)
+      } else {
+        flag.value = false
+      }
+    }
+  )
+  watch(
+    () => router.currentRoute.value.query.id,
+    (newValue, oldValue) => {
+      if (oldid != router.currentRoute.value.query.id) {
+        window.location.reload()
+      }
+    },
+    { immediate: true }
+  )
+</script>
+
+<style lang="less" scoped>
+  .application-associated-ability {
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .application-associated-ability-main {
+      margin-top: 0.4rem;
+      width: 13.14rem;
+      display: flex;
+      justify-content: space-between;
+      .associated-ability-card {
+        width: 4.28rem;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        border: 1px solid #e4e6f5;
+        border-radius: 0.1rem;
+        padding-bottom: 0.3rem;
+        cursor: pointer;
+        .associated-ability-card-title {
+          padding-top: 0.3rem;
+          font-size: 0.22rem;
+          text-align: center;
+        }
+        .associated-ability-card-content {
+          width: 100%;
+          margin-top: 0.25rem;
+          padding-left: 0.3rem;
+          .associated-ability-card-content-font {
+            font-size: 0.18rem;
+            color: #999;
+            margin-right: 0.15rem;
+            margin-top: 0.15rem;
+          }
+          .associated-ability-card-content-font:hover {
+            color: #0058e1;
+          }
+        }
+      }
+      .associated-ability-card:hover {
+        border-radius: 0.02rem;
+        border: 0.01rem solid #0058e1;
+        box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
+      }
+    }
+  }
+</style>
--- a/front/src/views/detailsAll/components/Application/ApplicationNavigation.vue
+++ b/front/src/views/detailsAll/components/Application/ApplicationNavigation.vue
@ -36,6 +36,10 @@
      name: '关联组件',
      key: 'application-associated-components',
    },
+    {
+      name: '关联能力',
+      key: 'application-associated-ability',
+    },
    {
      name: '使用能力',
      key: 'ability-to-use',
@ -77,6 +81,7 @@
        list.value.push('应用展示')
      }
    })
+    list.value.push('关联能力')
    navList.value.forEach((item) => {
      console.log(item)
      if (list.value.indexOf(item.name) > -1) {
@ -111,6 +116,7 @@
            list.value.push('应用展示')
          }
        })
+        list.value.push('关联能力')
        list.value.push('部署与安全')
        list.value.push('归属部门与服务商')
        navList.value.forEach((item) => {
--- a/front/src/views/detailsAll/components/Business/BusinessAssociatedAbility.vue
+++ b/front/src/views/detailsAll/components/Business/BusinessAssociatedAbility.vue
@ -0,0 +1,127 @@
+<template>
+  <div class="application-associated-ability" v-if="flag">
+    <detals-title title="关联能力" type="RELEVANCE"></detals-title>
+    <div class="application-associated-ability-main">
+      <div
+        class="associated-ability-card"
+        v-for="(item, index) in dataFrom"
+        :key="item.type"
+      >
+        <div class="associated-ability-card-title">
+          {{ item.type }}
+        </div>
+        <div class="associated-ability-card-content">
+          <div
+            class="associated-ability-card-content-font"
+            v-for="(dataListitem, dataListindex) in item.dataList"
+            :key="dataListitem.id"
+            @click="switchFunction(dataListitem.id)"
+          >
+            <span>{{ dataListindex + 1 }}、</span>
+            {{ dataListitem.name }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { ref, defineProps, watch } from 'vue'
+  import { useRouter } from 'vue-router'
+  const router = useRouter()
+  import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
+  const props = defineProps({
+    associatedComponents: { type: Array, default: null },
+  })
+  const dataFrom = ref([])
+  const flag = ref(true)
+  const oldid = router.currentRoute.value.query.id
+  //点击查看详情
+  const switchFunction = (id) => {
+    router.push({
+      path: '/details',
+      query: {
+        id: id,
+      },
+    })
+  }
+  if (props.associatedComponents) {
+    flag.value = true
+    dataFrom.value = props.associatedComponents
+    console.log('dataFrom.value', dataFrom.value)
+  } else {
+    flag.value = false
+  }
+  watch(
+    () => props.associatedComponents,
+    (val) => {
+      if (val) {
+        flag.value = true
+        dataFrom.value = props.associatedComponents
+        console.log('dataFrom.value', dataFrom.value)
+      } else {
+        flag.value = false
+      }
+    }
+  )
+  watch(
+    () => router.currentRoute.value.query.id,
+    (newValue, oldValue) => {
+      if (oldid != router.currentRoute.value.query.id) {
+        window.location.reload()
+      }
+    },
+    { immediate: true }
+  )
+</script>
+
+<style lang="less" scoped>
+  .application-associated-ability {
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .application-associated-ability-main {
+      margin-top: 0.4rem;
+      width: 13.14rem;
+      display: flex;
+      justify-content: space-between;
+      .associated-ability-card {
+        width: 4.28rem;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        border: 1px solid #e4e6f5;
+        border-radius: 0.1rem;
+        padding-bottom: 0.3rem;
+        cursor: pointer;
+        .associated-ability-card-title {
+          padding-top: 0.3rem;
+          font-size: 0.22rem;
+          text-align: center;
+        }
+        .associated-ability-card-content {
+          width: 100%;
+          margin-top: 0.25rem;
+          padding-left: 0.3rem;
+          .associated-ability-card-content-font {
+            font-size: 0.18rem;
+            color: #999;
+            margin-right: 0.15rem;
+            margin-top: 0.15rem;
+          }
+          .associated-ability-card-content-font:hover {
+            color: #0058e1;
+          }
+        }
+      }
+      .associated-ability-card:hover {
+        border-radius: 0.02rem;
+        border: 0.01rem solid #0058e1;
+        box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
+      }
+    }
+  }
+</style>
--- a/front/src/views/detailsAll/components/Business/BusinessNavigation.vue
+++ b/front/src/views/detailsAll/components/Business/BusinessNavigation.vue
@ -36,6 +36,10 @@
      name: '应用场景',
      key: 'application-scenarios',
    },
+    {
+      name: '关联能力',
+      key: 'business-associated-ability',
+    },
    {
      name: '应用案例',
      key: 'application-case',
@ -87,6 +91,7 @@
        list.value.push('组件展示')
      }
    })
+    list.value.push('关联能力')
    list.value.push('使用方式')
    navList.value.forEach((item) => {
      console.log(item)
@ -136,6 +141,7 @@
            list.value.push('组件展示')
          }
        })
+        list.value.push('关联能力')
        list.value.push('使用方式')
        navList.value.forEach((item) => {
          console.log(item)
--- a/front/src/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue
+++ b/front/src/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue
@ -0,0 +1,127 @@
+<template>
+  <div class="application-associated-ability" v-if="flag">
+    <detals-title title="关联能力" type="RELEVANCE"></detals-title>
+    <div class="application-associated-ability-main">
+      <div
+        class="associated-ability-card"
+        v-for="(item, index) in dataFrom"
+        :key="item.type"
+      >
+        <div class="associated-ability-card-title">
+          {{ item.type }}
+        </div>
+        <div class="associated-ability-card-content">
+          <div
+            class="associated-ability-card-content-font"
+            v-for="(dataListitem, dataListindex) in item.dataList"
+            :key="dataListitem.id"
+            @click="switchFunction(dataListitem.id)"
+          >
+            <span>{{ dataListindex + 1 }}、</span>
+            {{ dataListitem.name }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { ref, defineProps, watch } from 'vue'
+  import { useRouter } from 'vue-router'
+  const router = useRouter()
+  import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
+  const props = defineProps({
+    associatedComponents: { type: Array, default: null },
+  })
+  const dataFrom = ref([])
+  const flag = ref(true)
+  const oldid = router.currentRoute.value.query.id
+  //点击查看详情
+  const switchFunction = (id) => {
+    router.push({
+      path: '/details',
+      query: {
+        id: id,
+      },
+    })
+  }
+  if (props.associatedComponents) {
+    flag.value = true
+    dataFrom.value = props.associatedComponents
+    console.log('dataFrom.value', dataFrom.value)
+  } else {
+    flag.value = false
+  }
+  watch(
+    () => props.associatedComponents,
+    (val) => {
+      if (val) {
+        flag.value = true
+        dataFrom.value = props.associatedComponents
+        console.log('dataFrom.value', dataFrom.value)
+      } else {
+        flag.value = false
+      }
+    }
+  )
+  watch(
+    () => router.currentRoute.value.query.id,
+    (newValue, oldValue) => {
+      if (oldid != router.currentRoute.value.query.id) {
+        window.location.reload()
+      }
+    },
+    { immediate: true }
+  )
+</script>
+
+<style lang="less" scoped>
+  .application-associated-ability {
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .application-associated-ability-main {
+      margin-top: 0.4rem;
+      width: 13.14rem;
+      display: flex;
+      justify-content: space-between;
+      .associated-ability-card {
+        width: 4.28rem;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        border: 1px solid #e4e6f5;
+        border-radius: 0.1rem;
+        padding-bottom: 0.3rem;
+        cursor: pointer;
+        .associated-ability-card-title {
+          padding-top: 0.3rem;
+          font-size: 0.22rem;
+          text-align: center;
+        }
+        .associated-ability-card-content {
+          width: 100%;
+          margin-top: 0.25rem;
+          padding-left: 0.3rem;
+          .associated-ability-card-content-font {
+            font-size: 0.18rem;
+            color: #999;
+            margin-right: 0.15rem;
+            margin-top: 0.15rem;
+          }
+          .associated-ability-card-content-font:hover {
+            color: #0058e1;
+          }
+        }
+      }
+      .associated-ability-card:hover {
+        border-radius: 0.02rem;
+        border: 0.01rem solid #0058e1;
+        box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
+      }
+    }
+  }
+</style>
--- a/front/src/views/detailsAll/components/Developer/DeveloperNavigation.vue
+++ b/front/src/views/detailsAll/components/Developer/DeveloperNavigation.vue
@ -28,6 +28,10 @@
      name: '组件展示',
      key: 'eveloper-presentation',
    },
+    {
+      name: '关联能力',
+      key: 'developer-associated-ability',
+    },
    {
      name: '功能介绍',
      key: 'function-introduction',
@ -66,7 +70,6 @@
  if (props.dataList.infoList) {
    list.value = []
    props.dataList.infoList.map((item) => {
-      debugger
      if (
        item.attrType === '常见问题' ||
        item.attrType === '应用案例' ||
@ -77,6 +80,7 @@
        list.value.push('组件展示')
      }
    })
+    list.value.push('关联能力')
    navList.value.forEach((item) => {
      console.log(item)
      if (list.value.indexOf(item.name) > -1) {
@ -111,6 +115,7 @@
            list.value.push('组件展示')
          }
        })
+        list.value.push('关联能力')
        list.value.push('组件试用')
        list.value.push('使用方式')
        navList.value.forEach((item) => {
--- a/front/src/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue
+++ b/front/src/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue
@ -0,0 +1,127 @@
+<template>
+  <div class="application-associated-ability" v-if="flag">
+    <detals-title title="关联能力" type="RELEVANCE"></detals-title>
+    <div class="application-associated-ability-main">
+      <div
+        class="associated-ability-card"
+        v-for="(item, index) in dataFrom"
+        :key="item.type"
+      >
+        <div class="associated-ability-card-title">
+          {{ item.type }}
+        </div>
+        <div class="associated-ability-card-content">
+          <div
+            class="associated-ability-card-content-font"
+            v-for="(dataListitem, dataListindex) in item.dataList"
+            :key="dataListitem.id"
+            @click="switchFunction(dataListitem.id)"
+          >
+            <span>{{ dataListindex + 1 }}、</span>
+            {{ dataListitem.name }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { ref, defineProps, watch } from 'vue'
+  import { useRouter } from 'vue-router'
+  const router = useRouter()
+  import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
+  const props = defineProps({
+    associatedComponents: { type: Array, default: null },
+  })
+  const dataFrom = ref([])
+  const flag = ref(true)
+  const oldid = router.currentRoute.value.query.id
+  //点击查看详情
+  const switchFunction = (id) => {
+    router.push({
+      path: '/details',
+      query: {
+        id: id,
+      },
+    })
+  }
+  if (props.associatedComponents) {
+    flag.value = true
+    dataFrom.value = props.associatedComponents
+    console.log('dataFrom.value', dataFrom.value)
+  } else {
+    flag.value = false
+  }
+  watch(
+    () => props.associatedComponents,
+    (val) => {
+      if (val) {
+        flag.value = true
+        dataFrom.value = props.associatedComponents
+        console.log('dataFrom.value', dataFrom.value)
+      } else {
+        flag.value = false
+      }
+    }
+  )
+  watch(
+    () => router.currentRoute.value.query.id,
+    (newValue, oldValue) => {
+      if (oldid != router.currentRoute.value.query.id) {
+        window.location.reload()
+      }
+    },
+    { immediate: true }
+  )
+</script>
+
+<style lang="less" scoped>
+  .application-associated-ability {
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .application-associated-ability-main {
+      margin-top: 0.4rem;
+      width: 13.14rem;
+      display: flex;
+      justify-content: space-between;
+      .associated-ability-card {
+        width: 4.28rem;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        border: 1px solid #e4e6f5;
+        border-radius: 0.1rem;
+        padding-bottom: 0.3rem;
+        cursor: pointer;
+        .associated-ability-card-title {
+          padding-top: 0.3rem;
+          font-size: 0.22rem;
+          text-align: center;
+        }
+        .associated-ability-card-content {
+          width: 100%;
+          margin-top: 0.25rem;
+          padding-left: 0.3rem;
+          .associated-ability-card-content-font {
+            font-size: 0.18rem;
+            color: #999;
+            margin-right: 0.15rem;
+            margin-top: 0.15rem;
+          }
+          .associated-ability-card-content-font:hover {
+            color: #0058e1;
+          }
+        }
+      }
+      .associated-ability-card:hover {
+        border-radius: 0.02rem;
+        border: 0.01rem solid #0058e1;
+        box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
+      }
+    }
+  }
+</style>
--- a/front/src/views/detailsAll/components/LayerService/LayerServiceNavigation.vue
+++ b/front/src/views/detailsAll/components/LayerService/LayerServiceNavigation.vue
@ -32,6 +32,10 @@
      name: '图层信息',
      key: 'service-information',
    },
+    {
+      name: '关联能力',
+      key: 'layer-service-associated-ability',
+    },
    {
      name: '应用场景',
      key: 'service-application-scenarios',
@ -93,10 +97,31 @@
        if (item.attrValue === '是') {
          list.value.push('图层预览')
        }
+      } else if (
+        item.attrType === '服务类型' ||
+        item.attrType === '覆盖区域' ||
+        item.attrType === '切片策略' ||
+        item.attrType === '坐标系' ||
+        item.attrType === '切片尺寸' ||
+        item.attrType === '最小级别' ||
+        item.attrType === '数据范围' ||
+        item.attrType === '图层类型' ||
+        item.attrType === '最大级别'
+      ) {
+        list.value.push('图层信息')
+      } else if (
+        item.attrType === '技术文档' ||
+        item.attrType === '服务商' ||
+        item.attrType === '服务商联系人' ||
+        item.attrType === '使用手册' ||
+        item.attrType === '服务地址' ||
+        item.attrType === '样式服务地址' ||
+        item.attrType === '服务商联系电话'
+      ) {
+        list.value.push('使用方式')
      }
    })
-    list.value.push('图层信息')
-    list.value.push('使用方式')
+    list.value.push('关联能力')
    navList.value.forEach((item) => {
      console.log(item)
      if (list.value.indexOf(item.name) > -1) {
@ -147,8 +172,31 @@
            if (item.attrValue === '是') {
              list.value.push('图层预览')
            }
+          } else if (
+            item.attrType === '服务类型' ||
+            item.attrType === '覆盖区域' ||
+            item.attrType === '切片策略' ||
+            item.attrType === '坐标系' ||
+            item.attrType === '切片尺寸' ||
+            item.attrType === '最小级别' ||
+            item.attrType === '数据范围' ||
+            item.attrType === '图层类型' ||
+            item.attrType === '最大级别'
+          ) {
+            list.value.push('图层信息')
+          } else if (
+            item.attrType === '技术文档' ||
+            item.attrType === '服务商' ||
+            item.attrType === '服务商联系人' ||
+            item.attrType === '使用手册' ||
+            item.attrType === '服务地址' ||
+            item.attrType === '样式服务地址' ||
+            item.attrType === '服务商联系电话'
+          ) {
+            list.value.push('使用方式')
          }
        })
+        list.value.push('关联能力')
        list.value.push('图层信息')
        list.value.push('使用方式')
        navList.value.forEach((item) => {
--- a/front/src/views/detailsAll/components/LayerService/LayerServicePreview.vue
+++ b/front/src/views/detailsAll/components/LayerService/LayerServicePreview.vue
@ -8,7 +8,7 @@
 <template>
  <div class="application-presentation" v-if="flag">
    <detals-title title="图层预览" type="PREVIEW"></detals-title>
-    <div class="main" :style="`${img}background-position:center;`">
+    <div class="main">
      <iframe
        :src="img"
        width="100%"
@ -35,7 +35,11 @@
    if (!imgindex) {
      flag.value = false
    } else {
-      img.value = imgindex.attrValue
+      props.dataList.infoList.map((item) => {
+        if (item.attrType === '预览服务地址') {
+          img.value = imgindex.attrValue || '--'
+        }
+      })
    }
  }
  watch(
@ -48,7 +52,11 @@
        if (!imgindex) {
          flag.value = false
        } else {
-          img.value = imgindex.attrValue
+          val.infoList.map((item) => {
+            if (item.attrType === '预览服务地址') {
+              img.value = imgindex.attrValue || '--'
+            }
+          })
        }
      }
    }
--- a/front/src/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue
+++ b/front/src/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue
@ -88,6 +88,9 @@
        item.attrType === '技术文档' ||
        item.attrType === '服务商' ||
        item.attrType === '服务商联系人' ||
+        item.attrType === '使用手册' ||
+        item.attrType === '服务地址' ||
+        item.attrType === '样式服务地址' ||
        item.attrType === '服务商联系电话'
    )[0]
    if (!obj) {
@ -122,6 +125,9 @@
            item.attrType === '技术文档' ||
            item.attrType === '服务商' ||
            item.attrType === '服务商联系人' ||
+            item.attrType === '使用手册' ||
+            item.attrType === '服务地址' ||
+            item.attrType === '样式服务地址' ||
            item.attrType === '服务商联系电话'
        )[0]
        if (!obj) {
--- a/front/src/views/home/AbilityToApplyFor.vue
+++ b/front/src/views/home/AbilityToApplyFor.vue
@ -10,7 +10,7 @@
        <span></span>
        {{ item.deptName }}
      </div>
-      <template v-for="val in item.children" :key="val.resourceId">
+      <template v-for="val in item.arr" :key="val.resourceId">
        <div class="item">
          <div class="name">
            <span>{{ val.resourceName }}</span>
@ -48,11 +48,9 @@
  //移除方法
  const removeFunction = (data) => {
    dataForm.value.map((val) => {
-      val.children = val.children.filter(
-        (item) => item.resourceId !== data.resourceId
-      )
+      val.arr = val.arr.filter((item) => item.resourceId !== data.resourceId)
    })
-    dataForm.value = dataForm.value.filter((val) => val.children.length !== 0)
+    dataForm.value = dataForm.value.filter((val) => val.arr.length !== 0)
  }
 </script>

--- a/front/src/views/home/DetailsPageconetent.vue
+++ b/front/src/views/home/DetailsPageconetent.vue
@ -1018,7 +1018,6 @@
              })
              console.log('paramsGetResources', paramsGetResources)
            }
-            // debugger
            tecHnosphere = router.currentRoute.value.query.tecHnosphere
            appLiCation = router.currentRoute.value.query.appLiCation
            if (val.typeList && val.typeList.length > 6) {
@ -1038,8 +1037,8 @@
      const resourceList = reactive({ data: [] })
      const videoList = reactive({ data: [] })
      const resourceTotal = ref('')
-      const getAppResources = () => {
-        paramsGetResources.pageNum = 1
+      const getAppResources = (switchIndex) => {
+        //switchIndex这个参数是下面的分页传过来的参数
        paramsGetResources.name = searchValue.value
        paramsGetResources.type = Cardsname.value
        console.log(
@ -1050,7 +1049,10 @@
          !whoShow1.value.itShowBaoTou &&
          paramsGetResources.type === '数据资源'
        ) {
-          getDataResource({
+          if (switchIndex != '分页查询') {
+            paramsGetResources.pageNum = 1
+          }
+          let dataResourceParams = {
            serviceName: paramsGetResources.name, //资源名称
            orderField: whoShow1.value.itShowQingDao
              ? paramsGetResources.orderField == 'applyCount'
@ -1062,7 +1064,8 @@
            orderType: paramsGetResources.orderType.toLowerCase(), //排序方式：desc，asc
            pageNum: paramsGetResources.pageNum, //页码
            pageSize: paramsGetResources.pageSize, //分页大小
-          }).then((res) => {
+          }
+          getDataResource(dataResourceParams).then((res) => {
            console.log('数据资源==================>', res.data.data)
            if (whoShow1.value.itShowQingDao) {
              res.data.data.data.forEach((val) => {
@ -1092,6 +1095,9 @@
            }
          })
        } else if (paramsGetResources.type !== '数据资源') {
+          if (switchIndex != '分页查询') {
+            paramsGetResources.pageNum = 1
+          }
          pageWithAttrs(paramsGetResources).then((res) => {
            console.log('查询列表============>', resourceList, res.data.data)
            resourceList.data = []
@ -1183,7 +1189,8 @@
        loading.value = true
        currentPage.value = val
        paramsGetResources.pageNum = val
-        getAppResources()
+        let params = '分页查询' //判断是否是点击下面的分页的调用模糊查询方法还是点击搜索调用模糊查询方法
+        getAppResources(params)
      }
      // const findZywMessage = () => {
      //   zywMessage().then((res) => {
@ -1236,7 +1243,6 @@
        router.currentRoute.value.query.appLiCation = ''
        tecHnosphere = router.currentRoute.value.query.tecHnosphere
        appLiCation = router.currentRoute.value.query.appLiCation
-        // debugger
        let newQuery = JSON.parse(
          JSON.stringify(router.currentRoute.value.query)
        )
--- a/front/src/views/home/apply.vue
+++ b/front/src/views/home/apply.vue
@ -20,6 +20,18 @@
              labelAlign="left"
              autocomplete="off"
            >
+              <div class="base-info">
+                <a-form-item
+                  label="申请标题"
+                  name="title"
+                  :rules="[{ required: true, message: '请输入申请标题' }]"
+                >
+                  <a-input
+                    placeholder="请输入能力申请标题"
+                    v-model:value="formName.title"
+                  />
+                </a-form-item>
+              </div>
              <div class="base-info">
                <a-form-item
                  label="申请人信息"
@ -59,71 +71,71 @@
                  <a-input
                    placeholder="请输入单位"
                    v-model:value="formName.unit"
+                    disabled
                  />
                </a-form-item>
              </div>
+              <div class="base-info">
                <a-form-item
-                style="margin-bottom: 10px"
-                label="申请应用"
-                name="system"
-                :rules="[{ required: true, message: '请输入申请应用' }]"
+                  label="应用系统"
+                  name="applicationSystem"
+                  :rules="[{ required: true, message: '请选择应用系统' }]"
                >
-                <a-tooltip placement="top">
-                  <template #title>
-                    <span>{{ formName.formNameSystem }}</span>
-                  </template>
-                  <a-input
-                    style="width: 350px; background-color: #f5f5f5"
-                    v-model:value="formName.formNameSystem"
-                    :disabled="disabled"
-                  />
-                  <span style="width: 350px; background-color: #f5f5f5"></span>
-                </a-tooltip>
+                  <a-select
+                    v-model:value="formName.applicationSystem"
+                    show-search
+                    placeholder="请选择应用系统"
+                    style="width: 200px"
+                    :options="systemOptions"
+                    @focus="handleFocus"
+                    @blur="handleBlur"
+                    @change="systemHandleChange"
+                    @search="systemHandleSearch"
+                  ></a-select>
                </a-form-item>
-
                <a-form-item
-                style="margin-bottom: 10px"
+                  class="applicationScene"
                  label="应用场景"
-                name="scene"
-                :rules="[{ required: true, message: '请输入应用场景' }]"
+                  name="applicationScene"
+                  :rules="[{ required: true, message: '请选择应用场景' }]"
+                  style="width: 6.93rem"
                >
-                <a-textarea
-                  style="
-                    width: 500px;
-                    height: 150px;
-                    font-size: 16px;
-                    line-height: 24px;
-                    color: #333;
-                    border: 1px solid #e0e0e0;
-                    resize: none;
-                    border-radius: 6px;
-                    padding: 10px;
-                  "
-                  v-model:value="formName.scene"
-                />
+                  <a-select
+                    v-model:value="formName.applicationScene"
+                    :options="applicationSceneOpthion"
+                    mode="tags"
+                    :size="size"
+                    placeholder="请选择应用场景"
+                    :filterOption="false"
+                    :searchValue="false"
+                    style="width: 5.87rem"
+                  ></a-select>
                </a-form-item>
-
+              </div>
+              <div>
                <a-form-item
-                style="margin-bottom: 10px"
-                label="申请依据"
-                name="basis"
-                :rules="[{ required: true, message: '请输入申请依据' }]"
+                  label="应用背景"
+                  name="applicationBackground"
+                  :rules="[{ required: true, message: '请输入应用背景' }]"
                >
-                <a-textarea
-                  style="
-                    width: 500px;
-                    height: 150px;
-                    font-size: 16px;
-                    line-height: 24px;
-                    color: #333;
-                    border: 1px solid #e0e0e0;
-                    border-radius: 6px;
-                    padding: 10px;
-                    resize: none;
-                  "
-                  v-model:value="formName.basis"
+                  <a-input
+                    placeholder="请输入应用背景"
+                    v-model:value="formName.applicationBackground"
                  />
                </a-form-item>
+              </div>
+              <div>
+                <a-form-item
+                  label="期望效果"
+                  name="effectWish"
+                  :rules="[{ required: true, message: '请输入期望效果' }]"
+                >
+                  <a-input
+                    placeholder="请输入期望效果"
+                    v-model:value="formName.effectWish"
+                  />
+                </a-form-item>
+              </div>

              <a-form-item
                style="color: #666; font-size: 16px"
@ -206,11 +218,7 @@
            <div>
              <img src="../../assets/home/success.png" alt="" />
            </div>
-            <p>
-              您已成功申请{{
-                formName.formNameSystem || ''
-              }},请耐心等待审批结果，结果会第一时间通知您！
-            </p>
+            <p>您已成功申请能力,请耐心等待审批结果，结果会第一时间通知您！</p>
          </div>
        </div>
      </article>
@ -238,8 +246,10 @@
    relaunch,
    selectOne,
  } from '@/api/home'
+  import { getCategoryTreePage } from '@/api/personalCenter'
  import mybus from '@/myplugins/mybus'
  import { sgcDel, getApplyForm } from '@/api/personalCenter'
+  import { pageWithAttrs } from '@/api/home'
  // import { baseURL } from '@/config'
  // import AsideMenu from './components/asideMenu.vue'

@ -257,16 +267,18 @@
      const disabled = ref(false)
      const baseURL = window.SITE_CONFIG.apiURL
      let record = ref('1')
+      const text = ref('')
      const formName = reactive({
+        title: '', // 标题
+        applicationSystem: [], // 应用系统
+        applicationScene: [], // 应用场景
+        applicationBackground: '', // 应用背景
+        effectWish: '', // 期望效果
        user: '',
        userId: '',
        phone: '',
        unit: '',
-        area: '',
        system: [],
-        scene: '',
-        basis: '',
-        formNameSystem: '',
        enclosure: '', //附件
      })
      const dataList = ref([])
@ -294,7 +306,21 @@
          // console.log('回填数据================>', res, formName.phone)
        })
      }
-
+      const applicationSceneOpthion = ref([])
+      getCategoryTreePage({
+        page: 1,
+        limit: 20,
+        dictTypeId: '1513712507692818433',
+        deFlage: 0,
+      }).then((res) => {
+        res.data.data.list.map((val) => {
+          applicationSceneOpthion.value.push({
+            value: val.dictLabel,
+            label: val.dictLabel,
+          })
+        })
+        // console.log('字典值========>', applicationSceneOpthion.value)
+      })
      // console.log(formName.system)
      const formRef = ref()
      const applySuccess = ref(true)
@ -350,6 +376,31 @@
            if (!formName) {
              return message.error('请设置表单名称')
            }
+            let ids = []
+            formName.system = []
+            list.value.map((val) => {
+              val.arr.map((item) => {
+                formName.system.push({
+                  resourceId: item.resourceId,
+                  resourceName: item.resourceName,
+                })
+                console.log(item.id)
+                ids.push(item.id)
+              })
+            })
+            console.log('提交数据==========================>', formName, ids)
+            submitApply(formName).then((res) => {
+              applySuccess.value = false
+              message.success('操作成功！')
+              console.log('能力申请================>', res)
+              if (ids) {
+                sgcDel({ ids: ids }).then((res) => {
+                  if (res.data.msg === 'success') {
+                    mybus.emit('getSgcNum')
+                  }
+                })
+              }
+            })
            // if (arr && arr.length !== 0) {
            //   console.log('提交')
            //   const obj = ref({})
@ -480,6 +531,7 @@
          label: '交通运输局',
        },
      ])
+      const systemOptions = ref([])

      const handleChange = (info) => {
        if (info.file.status !== 'uploading') {
@ -538,6 +590,63 @@
      //     })
      //   })
      // })
+      // 应用系统下拉
+      const flag = ref(true)
+      const systemHandleChange = (value) => {
+        console.log(`selected ${value}`)
+      }
+      const systemHandleSearch = (value) => {
+        console.log(`search ${value}`)
+        text.value = value
+        systemOptions.value = []
+        window.setTimeout(() => {
+          if (flag.value && text.value == value && text.value !== '') {
+            console.log('1秒未输入~~~~~~~~~~~~~~~~~~~~~~~~~~')
+            pageWithAttrs({
+              pageNum: 99999,
+              pageSize: 5,
+              type: '应用资源',
+              name: text.value,
+              infoList: [],
+            }).then((res) => {
+              if (res.data.code == 0) {
+                if (res.data.data.records.length == 0) {
+                  message.warning('该关键词，暂无应用资源！')
+                } else {
+                  res.data.data.records.map((val) => {
+                    systemOptions.value.push({
+                      value: val.name,
+                      label: val.name,
+                    })
+                  })
+                  console.log(
+                    '第一次获取===================>',
+                    systemOptions.value
+                  )
+                }
+              } else {
+                message.error('获取数据失败!')
+              }
+            })
+          }
+        }, 500)
+      }
+
+      const handleBlur = () => {
+        console.log('blur')
+        flag.value = false
+      }
+
+      const handleFocus = () => {
+        console.log('focus')
+        flag.value = true
+        systemOptions.value = []
+      }
+
+      // const filterOption = (input, option) => {
+      //   return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
+      // }
+
      onBeforeUnmount(() => {
        mybus.off('reomveOldData')
      })
@ -561,6 +670,12 @@
        baseURL,
        beforeUpload,
        dataList,
+        systemHandleChange,
+        systemHandleSearch,
+        handleBlur,
+        handleFocus,
+        systemOptions,
+        applicationSceneOpthion,
      }
    },
  }
@ -599,6 +714,7 @@
    }
    .base-info {
      display: flex;
+      justify-content: space-between;
    }
    :deep(.ant-form-item-label) {
      label {
@ -631,4 +747,12 @@
      color: #000;
    }
  }
+  .applicationScene {
+    :deep(.ant-select-selector) {
+      overflow-x: scroll;
+    }
+    :deep(.ant-select-selection-overflow) {
+      flex-wrap: nowrap;
+    }
+  }
 </style>
--- a/front/src/views/personalCenter/components/ApplyDetails.vue
+++ b/front/src/views/personalCenter/components/ApplyDetails.vue
@ -509,6 +509,7 @@
    getTaskHandleDetailInfo,
    getDemandForm,
    nengliziyuanshangjiaapply,
+    getTaskVariables,
  } from '@/api/personalCenter'
  import { selectOneDel } from '@/api/home'
  const downloadFile = (path, name) => {
@ -593,6 +594,12 @@
    resourceId: { type: String, default: null },
  })
  const getInfo = () => {
+    console.log(props.processInstanceId, '============================')
+    if (props.processDefinitionName == '能力申请') {
+      getTaskVariables({ taskId: props.processInstanceId }).then((res) => {
+        console.log('获取数据====================>', res.data.data)
+      })
+    }
    if (props.processDefinitionName == '能力申请流程') {
      getApplyForm(props.businessKey).then((res) => {
        const { data } = res.data
@ -662,6 +669,7 @@
  })

  const getResourceURL = () => {
+    console.log('111111111111111111111111111111', Cookies.get('token'))
    const params = qs.stringify({
      token: Cookies.get('token'),
      // processInstanceId: this.dataForm.processInstanceId
--- a/front/src/views/personalCenter/components/MyApply.vue
+++ b/front/src/views/personalCenter/components/MyApply.vue
@ -60,7 +60,7 @@
          <div class="content-body-content">
            <p class="content-body-content-son">
              审核结果：{{
-                item.ended ? '审核完成' : item.backToFirst ? '被驳回' : '审核中'
+                item.ended ? '审核完成' : item.backToFirst ? '被终止' : '审核中'
              }}
            </p>
          </div>
@ -95,10 +95,16 @@
            <div></div>
          </div>
          <div class="button-box">
-            <div class="button" @click="showDetail(item)">查看流程</div>
-            <div class="button" @click="showAdd(item)" v-if="item.backToFirst">
-              修改
+            <div
+              class="button"
+              @click="showDetail(item)"
+              v-if="!(item.processDefinitionName == '能力申请')"
+            >
+              查看流程
            </div>
+            <!-- <div class="button" @click="showAdd(item)" v-if="item.backToFirst">
+              修改
+            </div> -->
            <div
              v-if="
                !(
@ -107,7 +113,11 @@
                  item.ended == false
                )
              "
-              v-show="item.resourceStatusTip == '正常' && item.ended"
+              v-show="
+                item.resourceStatusTip == '正常' &&
+                item.ended &&
+                item.processDefinitionName !== '能力申请'
+              "
              class="button button-details"
              @click="
                viewDetail(
--- a/front/src/views/personalCenter/components/PurchaseVehicle.vue
+++ b/front/src/views/personalCenter/components/PurchaseVehicle.vue
@ -513,6 +513,8 @@
          }
          val.checked = true
        })
+      } else {
+        getListByDeptId(item)
      }
      item.checkAll = true
      checkedList.value.push(item.deptId)
@ -665,11 +667,18 @@
    //     }
    //   }
    // })
-    if (checkedList.value.length == 0) {
+    if (checkedListAbility.value.length == 0) {
      message.error('请先选择需要申请的数据！')
    } else {
-      // console.log('一键申请===================>', list.value)
-      localStorage.setItem('applyList', JSON.stringify(list.value))
+      let arr = []
+      list.value.map((val) => {
+        val.arr = val.children.filter(
+          (item) => checkedListAbility.value.indexOf(item.resourceId) > -1
+        )
+      })
+      arr = list.value.filter((val) => val.arr.length !== 0)
+      console.log('一键申请===================>', arr)
+      localStorage.setItem('applyList', JSON.stringify(arr))
      router.push({
        path: '/apply',
      })