能力申请

front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue

@@ -128,6 +128,7 @@
       width: 7.2rem;
       color: #fff;
       margin-right: 0.8rem;
+      margin-top: -0.3rem;
       .top {
         display: flex;
         align-items: center;
@@ -135,10 +136,11 @@
           font-size: 14px;
         }
         .name {
-          // max-width: 330px;
+          display: inline-block;
+          width: 10.2rem;
           // overflow: hidden;
           // text-overflow: ellipsis;
-          white-space: nowrap;
+          // white-space: nowrap;
           font-size: 40px;
           margin-right: 20px;
         }

front/src/views/home/AbilityToApplyFor.vue

@@ -0,0 +1,125 @@
+<template>
+  <div class="ability-to-apply-for">
+    <div class="title">申请能力</div>
+    <div
+      v-for="(item, index) in dataForm"
+      :key="index"
+      class="ability-to-apply-for-content"
+    >
+      <div class="dep-name">
+        <span></span>
+        {{ item.deptName }}
+      </div>
+      <div class="name">
+        <span>{{ item.name }}</span>
+        <span>{{ item.type }}</span>
+      </div>
+      <div class="description">{{ item.description }}</div>
+      <div class="remove" @click="removeFunction(item)"></div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { useRouter } from 'vue-router'
+  import { ref, defineProps } from 'vue'
+  import mybus from '@/myplugins/mybus'
+  const props = defineProps({
+    dataList: { type: Array, default: null },
+  })
+  let dataForm = ref([])
+  dataForm.value = props.dataList
+  const router = useRouter()
+  const arr =
+    router.currentRoute.value.query.name instanceof Array
+      ? router.currentRoute.value.query.name
+      : [router.currentRoute.value.query.name]
+  const dataResourceId = router.currentRoute.value.query.resourceId
+
+  const depList = ref({
+    Name: [],
+    depID: [],
+  })
+  //移除方法
+  const removeFunction = (data) => {
+    props.dataList.map((item, index) => {
+      if (item.name == data.name) {
+        arr.splice(arr.indexOf(data.name), 1)
+        dataResourceId.splice(dataResourceId.indexOf(data.id), 1)
+        depList.value.depID = dataResourceId
+        depList.value.Name = arr
+        dataForm.value.splice(index, 1)
+        mybus.emit('reomveOldData', depList.value)
+        console.log('depList.value', depList.value)
+      }
+    })
+  }
+</script>
+
+<style scoped lang="less">
+  .ability-to-apply-for {
+    .title {
+      font-size: 0.16rem;
+      color: #212121;
+      border-bottom: 0.01rem #dddee1 solid;
+      padding-bottom: 0.1rem;
+      margin-bottom: 0.2rem;
+    }
+    .ability-to-apply-for-content {
+      margin-bottom: 0.3rem;
+      border-bottom: 0.01rem #dddee1 solid;
+      padding-bottom: 0.3rem;
+      padding-right: 0.5rem;
+      position: relative;
+      .dep-name {
+        color: #0558e1;
+        font-size: 0.18rem;
+        display: flex;
+        align-items: center;
+        line-height: 0.18rem;
+        margin-bottom: 0.2rem;
+        span {
+          display: inline-block;
+          width: 0.05rem;
+          height: 0.05rem;
+          background: #0558e1;
+          border-radius: 0.05rem;
+          margin-right: 0.05rem;
+        }
+      }
+      .name {
+        margin-bottom: 0.2rem;
+        span:first-child {
+          display: inline-block;
+          margin-right: 0.08rem;
+          font-size: 0.2rem;
+          color: #000000;
+        }
+        span:last-child {
+          display: inline-block;
+          padding: 0 0.05rem;
+          background: #00b8e6;
+          color: #fff;
+        }
+      }
+      .description {
+        color: rgba(0, 0, 0, 0.45);
+      }
+      .remove {
+        width: 0.32rem;
+        height: 0.32rem;
+        position: absolute;
+        right: 0;
+        top: 50%;
+        margin-top: -0.16rem;
+        background: url('~@/assets/home/remove.png') no-repeat;
+        background-size: cover;
+        cursor: pointer;
+      }
+      .remove:hover {
+        background: url('~@/assets/home/remove-hover.png') no-repeat;
+        background-size: cover;
+      }
+    }
+  }
+</style>

front/src/views/home/apply.vue

@@ -6,9 +6,11 @@
         <aside-menu></aside-menu>
       </aside> -->
       <article>
+        <div class="from-card" v-if="applySuccess">
+          <AbilityToApplyFor :dataList="dataList"></AbilityToApplyFor>
+        </div>
         <div class="form-container">
           <div v-if="applySuccess">
-            <div class="title">基础信息</div>
             <a-form
               ref="formRef"
               :model="formName"
@@ -20,7 +22,7 @@
             >
               <div class="base-info">
                 <a-form-item
-                  label="申请人"
+                  label="申请人信息"
                   name="user"
                   :rules="[{ required: true, message: '请输入申请人' }]"
                 >
@@ -33,7 +35,7 @@
 
                 <a-form-item
                   style="margin: 0 22px"
-                  label="申请人电话"
+                  label="电话"
                   name="phone"
                   :rules="[
                     {
@@ -50,31 +52,16 @@
                 </a-form-item>
 
                 <a-form-item
-                  label="申请单位"
+                  label="单位"
                   name="unit"
-                  :rules="[{ required: true, message: '请输入申请单位' }]"
+                  :rules="[{ required: true, message: '请输入单位' }]"
                 >
                   <a-input
-                    placeholder="请输入申请单位"
+                    placeholder="请输入单位"
                     v-model:value="formName.unit"
                   />
                 </a-form-item>
               </div>
-
-              <!-- <a-form-item
-                label="所在地区"
-                name="area"
-                :rules="[{ required: true, message: '请输入所在地区' }]"
-              >
-                <a-input
-                  style="width: 230px"
-                  placeholder="请输入所在地区"
-                  v-model:value="formName.area"
-                />
-              </a-form-item> -->
-
-              <div class="title">更多申请信息</div>
-
               <a-form-item
                 style="margin-bottom: 10px"
                 label="申请应用"
@@ -146,7 +133,7 @@
                 <a-upload
                   v-model:file-list="fileList"
                   name="file"
-                  :action="`${window.SITE_CONFIG.apiURL}/upload`"
+                  :action="`${baseURL}/upload`"
                   :headers="headers"
                   @change="handleChange"
                   :before-upload="beforeUpload"
@@ -232,8 +219,9 @@
 </template>
 
 <script>
+  import AbilityToApplyFor from './AbilityToApplyFor.vue'
   import HomeHeader from '@/views/home/components/header'
-  import { reactive, ref } from 'vue'
+  import { reactive, ref, watch, onBeforeUnmount } from 'vue'
   import { useRouter } from 'vue-router'
   import { message } from 'ant-design-vue'
   import qs from 'qs'
@@ -248,6 +236,7 @@
     getUser,
     getUserInfo,
     relaunch,
+    selectOne,
   } from '@/api/home'
   import mybus from '@/myplugins/mybus'
   import { sgcDel, getApplyForm } from '@/api/personalCenter'
@@ -259,12 +248,15 @@
     props: {},
     components: {
       HomeHeader,
+      AbilityToApplyFor,
       // AsideMenu,
       // UploadOutlined,
     },
     setup() {
       const router = useRouter()
       const disabled = ref(false)
+      const baseURL = window.SITE_CONFIG.apiURL
+      let record = ref('1')
       const formName = reactive({
         user: '',
         userId: '',
@@ -277,6 +269,7 @@
         formNameSystem: '',
         enclosure: '', //附件
       })
+      const dataList = ref([])
       getUser().then((res) => {
         formName.user = res.data.data.realName
         formName.userId = res.data.data.id
@@ -291,13 +284,19 @@
         'router传参==================>',
         router.currentRoute.value.query.name
       )
-      const arr =
+      let arr =
         router.currentRoute.value.query.name instanceof Array
           ? router.currentRoute.value.query.name
           : [router.currentRoute.value.query.name]
       console.log(router.currentRoute.value.query.ids)
       const ids = router.currentRoute.value.query.ids
-      const dataResourceId = router.currentRoute.value.query.resourceId
+      let dataResourceId = router.currentRoute.value.query.resourceId
+      dataResourceId.map((item) => {
+        selectOne(item).then((res) => {
+          dataList.value.push(res.data.data)
+          console.log('dataResourceId', dataList.value)
+        })
+      })
       const businessKey = ref(router.currentRoute.value.query.id)
       const taskId = ref(router.currentRoute.value.query.taskId)
       if (businessKey.value) {
@@ -310,25 +309,8 @@
           console.log('回填数据================>', res, formName.phone)
         })
       }
-      if (arr && arr.length !== 0) {
-        disabled.value = true
-        let str = ''
-        arr.forEach((val, index) => {
-          str += val
-          if (index < arr.length - 1) {
-            str += '、'
-          }
-        })
-        formName.formNameSystem = str
-      }
-      arr.forEach((val, index) => {
-        formName.system.push({
-          resourceName: val,
-          resourceId: dataResourceId[index],
-        })
-      })
-      console.log(formName.system)
 
+      console.log(formName.system)
       const formRef = ref()
       const applySuccess = ref(true)
       // const rootObj = null
@@ -545,6 +527,35 @@
         return isPNG || Upload.LIST_IGNORE
       }
       const fileList = ref([])
+      //删除改变arr
+      mybus.on('reomveOldData', (item) => {
+        debugger
+        arr = []
+        formName.system = []
+        record.value = record.value + '1'
+        arr = item.Name
+        dataResourceId = item.depID
+        if (arr && arr.length !== 0) {
+          disabled.value = true
+          let str = ''
+          arr.forEach((val, index) => {
+            str += val
+            if (index < arr.length - 1) {
+              str += '、'
+            }
+          })
+          formName.formNameSystem = str
+        }
+        arr.forEach((val, index) => {
+          formName.system.push({
+            resourceName: val,
+            resourceId: dataResourceId[index],
+          })
+        })
+      })
+      onBeforeUnmount(() => {
+        mybus.off('reomveOldData')
+      })
       return {
         formRef,
         formName,
@@ -561,8 +572,9 @@
         handleChange,
         applySuccess,
         disabled,
-        // baseURL,
+        baseURL,
         beforeUpload,
+        dataList,
       }
     },
   }
@@ -570,7 +582,7 @@
 
 <style scoped lang="less">
   #apply-container {
-    background-color: #f5f8fc;
+    // background-color: #f5f8fc;
     height: 100%;
     width: 100%;
     margin: 130px auto 0;