From 91b2f229ee75bee2d3479bb47553ce138420c452 Mon Sep 17 00:00:00 2001
From: guoyue <guoyue2@hisense.com>
Date: Wed, 2 Nov 2022 16:52:46 +0800
Subject: [PATCH] =?UTF-8?q?=E6=99=BA=E8=83=BD=E7=AE=97=E6=B3=95=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85=E5=A2=9E=E5=8A=A0=E8=AF=B4=E6=98=8E=E6=96=87=E5=AD=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Algorithm/AlgorithmTopDetails.vue         | 540 ++++++++++--------
 1 file changed, 287 insertions(+), 253 deletions(-)

diff --git a/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue b/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue
index 08f5195f..795b4efe 100644
--- a/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue
+++ b/front/src/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue
@@ -54,284 +54,318 @@
       </div>
       <div class="bottom" v-if="props.dataList.id">
         <a-button type="primary" @click="toView()">
-          <template #icon><form-outlined /></template>
+          <template #icon>
+            <form-outlined />
+          </template>
           申请使用
         </a-button>
         <a-button type="primary" @click="addShoppingCart()">
-          <template #icon><shopping-cart-outlined /></template>
+          <template #icon>
+            <shopping-cart-outlined />
+          </template>
           加入申购车
         </a-button>
         <a-button type="primary" @click="goTOCollection()">
           {{ props.dataList.isCollect == 'true' ? '已' : '' }}收藏
         </a-button>
       </div>
+      <div class="text-tip">
+        使用声明：算法的场景适应性和结果准确性需申请部门根据场景建设要求先行试用，进而判断是否满足应用需求，除特殊声明，算法结果仅为参考。
+      </div>
     </div>
     <div class="right"></div>
+
   </div>
+
 </template>
 <script setup>
-  import { FormOutlined, ShoppingCartOutlined } from '@ant-design/icons-vue'
-  import { defineProps, ref, watch } from 'vue'
-  import { scInsert, scDel } from '@/api/personalCenter'
-  import { sgcInsert } from '@/api/home'
-  import { useRouter } from 'vue-router'
-  import mybus from '@/myplugins/mybus'
-  import { message } from 'ant-design-vue'
-  const props = defineProps({
-    dataList: { type: Object, default: null },
+import { FormOutlined, ShoppingCartOutlined } from '@ant-design/icons-vue'
+import { defineProps, ref, watch } from 'vue'
+import { scInsert, scDel } from '@/api/personalCenter'
+import { sgcInsert } from '@/api/home'
+import { useRouter } from 'vue-router'
+import mybus from '@/myplugins/mybus'
+import { message } from 'ant-design-vue'
+const props = defineProps({
+  dataList: { type: Object, default: null },
+})
+const classOfAlgorithm = ref('')
+// console.log('==================>', props.dataList.isCollect)
+const router = useRouter()
+const applicationArea = ref('')
+const deploymentLocation = ref('') //部署位置
+//加入申购车
+const addShoppingCart = () => {
+  if (props.dataList.isInShoppingCart) {
+    message.error('已经加入申购车了')
+  } else {
+    console.log('加入申购车==================>', props.dataList)
+    sgcInsert({
+      delFlag: '0',
+      resourceId: props.dataList.id,
+      // userId: userId.value,
+    }).then((res) => {
+      console.log(res)
+      message.success('添加申购车成功！')
+      mybus.emit('getSgcNum')
+      props.dataList.isInShoppingCart = true
+      console.log(
+        props.dataList.isInShoppingCart,
+        'props.dataList.isInShoppingCart'
+      )
+    })
+  }
+}
+//立即申请
+function toView() {
+  // window.open(newpage.href, '_blank')
+  console.log('一键申请===================>', props.dataList)
+  localStorage.setItem(
+    'applyList',
+    JSON.stringify([
+      {
+        arr: [
+          {
+            delFlag: props.dataList.delFlag,
+            description: props.dataList.description,
+            resourceId: props.dataList.id,
+            resourceName: props.dataList.name,
+            time: props.dataList.createDate,
+            type: props.dataList.type,
+            componentType: '智能算法',
+          },
+        ],
+        deptId: props.dataList.deptId,
+        deptName: props.dataList.deptName,
+      },
+    ])
+  )
+  router.push({
+    path: '/apply',
   })
-  const classOfAlgorithm = ref('')
-  // console.log('==================>', props.dataList.isCollect)
-  const router = useRouter()
-  const applicationArea = ref('')
-  const deploymentLocation = ref('') //部署位置
-  //加入申购车
-  const addShoppingCart = () => {
-    if (props.dataList.isInShoppingCart) {
-      message.error('已经加入申购车了')
+}
+const componentType = ref('')
+if (props.dataList.infoList) {
+  applicationArea.value = props.dataList.infoList.filter(
+    (val) => val.attrType === '应用领域'
+  )[0].attrValue
+  let obj = props.dataList.infoList.filter(
+    (val) => val.attrType === '组件类型'
+  )[0]
+  if (
+    props.dataList.infoList.filter((val) => val.attrType === '算法类别')[0]
+  ) {
+    classOfAlgorithm.value = props.dataList.infoList.filter(
+      (val) => val.attrType === '算法类别'
+    )[0]
+  }
+  if (
+    props.dataList.infoList.filter((val) => val.attrType === '部署位置')[0]
+  ) {
+    deploymentLocation.value = props.dataList.infoList.filter(
+      (val) => val.attrType === '部署位置'
+    )[0].attrValue
+  }
+  if (obj) {
+    componentType.value = obj.attrValue
+  }
+}
+watch(
+  () => props.dataList,
+  (val) => {
+    if (val) {
+      applicationArea.value = props.dataList.infoList.filter(
+        (val) => val.attrType === '应用领域'
+      )[0].attrValue
+      let obj = props.dataList.infoList.filter(
+        (val) => val.attrType === '组件类型'
+      )[0]
+      if (
+        props.dataList.infoList.filter(
+          (val) => val.attrType === '算法类别'
+        )[0]
+      ) {
+        classOfAlgorithm.value = props.dataList.infoList.filter(
+          (val) => val.attrType === '算法类别'
+        )[0]
+      }
+      if (
+        props.dataList.infoList.filter(
+          (val) => val.attrType === '部署位置'
+        )[0]
+      ) {
+        deploymentLocation.value = props.dataList.infoList.filter(
+          (val) => val.attrType === '部署位置'
+        )[0].attrValue
+      }
+      if (obj) {
+        componentType.value = obj.attrValue
+      }
+    }
+  }
+)
+// 收藏
+const scFlag2 = ref(true)
+const goTOCollection = () => {
+  console.log('收藏===================》', props.dataList)
+  if (scFlag2.value) {
+    scFlag2.value = false
+    if (props.dataList.isCollect == 'true') {
+      scDel([props.dataList.id]).then((res) => {
+        if (res.data.msg === 'success') {
+          message.success('取消成功')
+          // eslint-disable-next-line vue/no-mutating-props
+          props.dataList.isCollect = 'false'
+          scFlag2.value = true
+        }
+      })
     } else {
-      console.log('加入申购车==================>', props.dataList)
-      sgcInsert({
-        delFlag: '0',
-        resourceId: props.dataList.id,
-        // userId: userId.value,
-      }).then((res) => {
-        console.log(res)
-        message.success('添加申购车成功！')
-        mybus.emit('getSgcNum')
-        props.dataList.isInShoppingCart = true
-        console.log(
-          props.dataList.isInShoppingCart,
-          'props.dataList.isInShoppingCart'
-        )
+      scInsert([
+        {
+          resourceId: props.dataList.id,
+        },
+      ]).then((res) => {
+        if (res.data.msg === 'success') {
+          message.success('添加收藏成功！')
+          // eslint-disable-next-line vue/no-mutating-props
+          props.dataList.isCollect = 'true'
+          scFlag2.value = true
+        }
       })
     }
   }
-  //立即申请
-  function toView() {
-    // window.open(newpage.href, '_blank')
-    console.log('一键申请===================>', props.dataList)
-    localStorage.setItem(
-      'applyList',
-      JSON.stringify([
-        {
-          arr: [
-            {
-              delFlag: props.dataList.delFlag,
-              description: props.dataList.description,
-              resourceId: props.dataList.id,
-              resourceName: props.dataList.name,
-              time: props.dataList.createDate,
-              type: props.dataList.type,
-              componentType: '智能算法',
-            },
-          ],
-          deptId: props.dataList.deptId,
-          deptName: props.dataList.deptName,
-        },
-      ])
-    )
-    router.push({
-      path: '/apply',
-    })
-  }
-  const componentType = ref('')
-  if (props.dataList.infoList) {
-    applicationArea.value = props.dataList.infoList.filter(
-      (val) => val.attrType === '应用领域'
-    )[0].attrValue
-    let obj = props.dataList.infoList.filter(
-      (val) => val.attrType === '组件类型'
-    )[0]
-    if (
-      props.dataList.infoList.filter((val) => val.attrType === '算法类别')[0]
-    ) {
-      classOfAlgorithm.value = props.dataList.infoList.filter(
-        (val) => val.attrType === '算法类别'
-      )[0]
-    }
-    if (
-      props.dataList.infoList.filter((val) => val.attrType === '部署位置')[0]
-    ) {
-      deploymentLocation.value = props.dataList.infoList.filter(
-        (val) => val.attrType === '部署位置'
-      )[0].attrValue
-    }
-    if (obj) {
-      componentType.value = obj.attrValue
-    }
-  }
-  watch(
-    () => props.dataList,
-    (val) => {
-      if (val) {
-        applicationArea.value = props.dataList.infoList.filter(
-          (val) => val.attrType === '应用领域'
-        )[0].attrValue
-        let obj = props.dataList.infoList.filter(
-          (val) => val.attrType === '组件类型'
-        )[0]
-        if (
-          props.dataList.infoList.filter(
-            (val) => val.attrType === '算法类别'
-          )[0]
-        ) {
-          classOfAlgorithm.value = props.dataList.infoList.filter(
-            (val) => val.attrType === '算法类别'
-          )[0]
-        }
-        if (
-          props.dataList.infoList.filter(
-            (val) => val.attrType === '部署位置'
-          )[0]
-        ) {
-          deploymentLocation.value = props.dataList.infoList.filter(
-            (val) => val.attrType === '部署位置'
-          )[0].attrValue
-        }
-        if (obj) {
-          componentType.value = obj.attrValue
-        }
-      }
-    }
-  )
-  // 收藏
-  const scFlag2 = ref(true)
-  const goTOCollection = () => {
-    console.log('收藏===================》', props.dataList)
-    if (scFlag2.value) {
-      scFlag2.value = false
-      if (props.dataList.isCollect == 'true') {
-        scDel([props.dataList.id]).then((res) => {
-          if (res.data.msg === 'success') {
-            message.success('取消成功')
-            // eslint-disable-next-line vue/no-mutating-props
-            props.dataList.isCollect = 'false'
-            scFlag2.value = true
-          }
-        })
-      } else {
-        scInsert([
-          {
-            resourceId: props.dataList.id,
-          },
-        ]).then((res) => {
-          if (res.data.msg === 'success') {
-            message.success('添加收藏成功！')
-            // eslint-disable-next-line vue/no-mutating-props
-            props.dataList.isCollect = 'true'
-            scFlag2.value = true
-          }
-        })
-      }
-    }
-    // scInsert([{ resourceId: props.dataList.id }]).then((res) => {
-    //   console.log(res)
-    //   message.success('收藏成功')
-    // })
-  }
+  // scInsert([{ resourceId: props.dataList.id }]).then((res) => {
+  //   console.log(res)
+  //   message.success('收藏成功')
+  // })
+}
 </script>
 <style lang="less" scoped>
-  .algorithm-top-details {
-    height: 600px;
-    padding: 180px 0 0;
-    background: url('~@/assets/detailsAll/sf_top_bg.png') no-repeat;
-    background-size: 100%;
-    display: flex;
-    justify-content: center;
-    .left {
-      width: 7.2rem;
-      color: #fff;
-      margin-right: 0.8rem;
-      margin-top: -0.3rem;
-      .top {
-        display: flex;
-        align-items: center;
-        span {
-          font-size: 14px;
-        }
-        .name {
-          display: inline-block;
-          // width: 10.2rem;
-          // overflow: hidden;
-          // text-overflow: ellipsis;
-          // white-space: nowrap;
-          font-size: 40px;
-          margin-right: 20px;
-          max-width: 6rem;
-          text-overflow: -o-ellipsis-lastline;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          display: -webkit-box;
-          -webkit-line-clamp: 1;
-          -webkit-box-orient: vertical;
-          word-break: break-all;
-        }
-        .label-content {
-          position: relative;
-        }
-        .lable-father {
-          position: absolute;
-          min-width: 5.5rem;
-          right: -5.5rem;
-          top: 0;
-        }
-        .label {
-          padding: 1px 10px;
-          margin-right: 10px;
-          border-radius: 13px;
-          background: rgba(255, 255, 255, 0.4);
-        }
+.algorithm-top-details {
+  height: 600px;
+  padding: 180px 0 0;
+  background: url('~@/assets/detailsAll/sf_top_bg.png') no-repeat;
+  background-size: 100%;
+  display: flex;
+  justify-content: center;
+
+  .left {
+    width: 7.2rem;
+    color: #fff;
+    margin-right: 0.8rem;
+    margin-top: -0.3rem;
+    position: relative;
+
+    .top {
+      display: flex;
+      align-items: center;
+
+      span {
+        font-size: 14px;
       }
-      .main {
-        margin-top: 20px;
-        font-size: 18px;
-        line-height: 34px;
-        & > div:nth-of-type(1) {
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-        }
-        & > div:nth-of-type(2) {
-          max-height: 100px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          display: -webkit-box;
-          -webkit-line-clamp: 3;
-          -webkit-box-orient: vertical;
-          word-break: break-all;
-        }
+
+      .name {
+        display: inline-block;
+        // width: 10.2rem;
+        // overflow: hidden;
+        // text-overflow: ellipsis;
+        // white-space: nowrap;
+        font-size: 40px;
+        margin-right: 20px;
+        max-width: 6rem;
+        text-overflow: -o-ellipsis-lastline;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: -webkit-box;
+        -webkit-line-clamp: 1;
+        -webkit-box-orient: vertical;
+        word-break: break-all;
       }
-      .bottom {
-        margin-top: 40px;
-        display: flex;
-        .ant-btn {
-          height: 50px;
-          margin-right: 20px;
-          background: #ff8b55;
-          border-radius: 6px;
-          font-size: 20px;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-        }
-        .ant-btn:nth-of-type(1) {
-          width: 180px;
-        }
-        .ant-btn:nth-of-type(2) {
-          width: 220px;
-        }
-        .ant-btn:nth-of-type(3) {
-          width: 145px;
-        }
+
+      .label-content {
+        position: relative;
+      }
+
+      .lable-father {
+        position: absolute;
+        min-width: 5.5rem;
+        right: -5.5rem;
+        top: 0;
+      }
+
+      .label {
+        padding: 1px 10px;
+        margin-right: 10px;
+        border-radius: 13px;
+        background: rgba(255, 255, 255, 0.4);
       }
     }
-    .right {
-      width: 580px;
-      height: 400px;
-      background: url('~@/assets/detailsAll/sf_right_bg.png') no-repeat;
-      background-size: 100%;
-      margin-top: -40px;
+
+    .main {
+      margin-top: 20px;
+      font-size: 18px;
+      line-height: 34px;
+
+      &>div:nth-of-type(1) {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      &>div:nth-of-type(2) {
+        max-height: 100px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: -webkit-box;
+        -webkit-line-clamp: 3;
+        -webkit-box-orient: vertical;
+        word-break: break-all;
+      }
+    }
+
+    .bottom {
+      margin-top: 40px;
+      display: flex;
+
+      .ant-btn {
+        height: 50px;
+        margin-right: 20px;
+        background: #ff8b55;
+        border-radius: 6px;
+        font-size: 20px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+
+      .ant-btn:nth-of-type(1) {
+        width: 180px;
+      }
+
+      .ant-btn:nth-of-type(2) {
+        width: 220px;
+      }
+
+      .ant-btn:nth-of-type(3) {
+        width: 145px;
+      }
     }
   }
+
+  .right {
+    width: 580px;
+    height: 400px;
+    background: url('~@/assets/detailsAll/sf_right_bg.png') no-repeat;
+    background-size: 100%;
+    margin-top: -40px;
+  }
+}
+
+.text-tip {
+  font-size: 14px;
+  color: #fff;
+  position: absolute;
+  bottom: 20px;
+  width: 140%;
+}
 </style>