From f64f44172efee217e339cb961bb49f84f568f6f4 Mon Sep 17 00:00:00 2001
From: a0049873 <79py69t9wb@privaterelay.appleid.com>
Date: Tue, 14 Jun 2022 11:32:25 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B7=B3=E8=BD=AC=E6=8C=82=E8=BD=BD=E5=89=8D?=
 =?UTF-8?q?=20=20=20=E6=96=B0=E5=A2=9E=E5=88=86=E6=94=AF=E9=80=89=E6=8B=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Application/ApplicationNavigation.vue     |  18 +-
 .../Application/ApplicationPresentation.vue   |  18 +-
 .../Application/ApplicationTopDetails.vue     |  52 +--
 .../personalCenter/components/MyPublish.vue   | 308 ++++++++++++++----
 .../components/TheNewRelease.vue              |  18 +-
 5 files changed, 305 insertions(+), 109 deletions(-)

diff --git a/front/src/views/detailsAll/components/Application/ApplicationNavigation.vue b/front/src/views/detailsAll/components/Application/ApplicationNavigation.vue
index 5434c8ef..b4846a29 100644
--- a/front/src/views/detailsAll/components/Application/ApplicationNavigation.vue
+++ b/front/src/views/detailsAll/components/Application/ApplicationNavigation.vue
@@ -2,7 +2,7 @@
  * @Author: hisense.liangjunhua
  * @Date: 2022-06-08 14:54:01
  * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-06-14 10:30:32
+ * @LastEditTime: 2022-06-14 11:31:07
  * @Description: 应用详情页导航
 -->
 <template>
@@ -135,16 +135,16 @@
 </script>
 <style lang="less" scoped>
   .application-navigation {
-    width: 1912px;
-    height: 84px;
-    line-height: 80px;
+    width: 19.12rem;
+    height: 0.84rem;
+    line-height: 0.8rem;
     display: flex;
     justify-content: space-around;
-    font-size: 24px;
+    font-size: 0.24rem;
     color: #666;
     background: #fff;
-    padding: 0 300px;
-    box-shadow: 0px 5px 10px #f2f3fb;
+    padding: 0 3rem;
+    box-shadow: 0rem 0.05rem 0.1rem #f2f3fb;
     position: relative;
     .nav {
       cursor: pointer;
@@ -153,8 +153,8 @@
       justify-content: space-between;
       align-items: center;
       .line {
-        width: 40px;
-        height: 4px;
+        width: 0.4rem;
+        height: 0.04rem;
       }
     }
     .select {
diff --git a/front/src/views/detailsAll/components/Application/ApplicationPresentation.vue b/front/src/views/detailsAll/components/Application/ApplicationPresentation.vue
index 90b412a1..9b26d182 100644
--- a/front/src/views/detailsAll/components/Application/ApplicationPresentation.vue
+++ b/front/src/views/detailsAll/components/Application/ApplicationPresentation.vue
@@ -2,7 +2,7 @@
  * @Author: hisense.liangjunhua
  * @Date: 2022-06-08 15:25:33
  * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-06-14 11:13:23
+ * @LastEditTime: 2022-06-14 11:30:52
  * @Description: 应用展示  视频播放
 -->
 <template>
@@ -31,8 +31,8 @@
   import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
   const visible = ref(false)
   const options = reactive({
-    width: '700px', //播放器宽度
-    height: '400px', //播放器高度
+    width: '7.00rem', //播放器宽度
+    height: '4.00rem', //播放器高度
     color: '#409eff', //主题色
     title: '', //视频名称
     src: '', //视频源
@@ -94,19 +94,19 @@
 </script>
 <style lang="less" scoped>
   .application-presentation {
-    padding: 80px 300px 0;
+    padding: 0.8rem 3rem 0;
     .main {
-      height: 340px;
-      border-radius: 10px;
+      height: 3.4rem;
+      border-radius: 0.1rem;
       background: url('~@/assets/detailsAll/sf_video_bg.png') no-repeat;
       background-size: 100%;
-      margin-top: 40px;
+      margin-top: 0.4rem;
       display: flex;
       justify-content: center;
       align-items: center;
       .play {
-        width: 96px;
-        height: 96px;
+        width: 0.96rem;
+        height: 0.96rem;
         background: url('~@/assets/detailsAll/sf_video_play.png') no-repeat;
         background-size: 100%;
         cursor: pointer;
diff --git a/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue b/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue
index 41715002..1e6102d8 100644
--- a/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue
+++ b/front/src/views/detailsAll/components/Application/ApplicationTopDetails.vue
@@ -2,7 +2,7 @@
  * @Author: hisense.liangjunhua
  * @Date: 2022-06-08 11:56:28
  * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-06-13 15:29:27
+ * @LastEditTime: 2022-06-14 11:31:12
  * @Description: 算法详情页头部
 -->
 <template>
@@ -99,47 +99,47 @@
 </script>
 <style lang="less" scoped>
   .algorithm-top-details {
-    height: 600px;
-    padding: 180px 0 0;
+    height: 6rem;
+    padding: 1.8rem 0 0;
     background: url('~@/assets/detailsAll/sf_top_bg.png') no-repeat;
     background-size: 100%;
     display: flex;
     justify-content: center;
     .left {
-      width: 700px;
+      width: 7rem;
       color: #fff;
       .top {
         display: flex;
         align-items: center;
         span {
-          font-size: 14px;
+          font-size: 0.14rem;
         }
         .name {
-          max-width: 330px;
+          max-width: 3.3rem;
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
-          font-size: 40px;
-          margin-right: 20px;
+          font-size: 0.4rem;
+          margin-right: 0.2rem;
         }
         .label {
-          padding: 1px 10px;
-          margin-right: 10px;
-          border-radius: 13px;
+          padding: 0.01rem 0.1rem;
+          margin-right: 0.1rem;
+          border-radius: 0.13rem;
           background: rgba(255, 255, 255, 0.4);
         }
       }
       .main {
-        margin-top: 20px;
-        font-size: 18px;
-        line-height: 34px;
+        margin-top: 0.2rem;
+        font-size: 0.18rem;
+        line-height: 0.34rem;
         & > div:nth-of-type(1) {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
         }
         & > div:nth-of-type(2) {
-          max-height: 100px;
+          max-height: 1rem;
           overflow: hidden;
           text-overflow: ellipsis;
           display: -webkit-box;
@@ -148,37 +148,37 @@
         }
       }
       .bottom {
-        margin-top: 40px;
+        margin-top: 0.4rem;
         display: flex;
         .ant-btn {
-          height: 50px;
-          margin-right: 20px;
+          height: 0.5rem;
+          margin-right: 0.2rem;
           background: #ff8b55;
-          border-radius: 6px;
-          font-size: 20px;
+          border-radius: 0.06rem;
+          font-size: 0.2rem;
           display: flex;
           justify-content: center;
           align-items: center;
         }
         .ant-btn:nth-of-type(1) {
-          width: 180px;
+          width: 1.8rem;
         }
         .ant-btn:nth-of-type(2) {
-          width: 220px;
+          width: 2.2rem;
         }
         .ant-btn:nth-of-type(3) {
-          width: 145px;
+          width: 1.45rem;
           background: #fff;
           color: #526aff;
         }
       }
     }
     .right {
-      width: 580px;
-      height: 400px;
+      width: 5.8rem;
+      height: 4rem;
       background: url('~@/assets/detailsAll/sf_right_bg.png') no-repeat;
       background-size: 100%;
-      margin-top: -40px;
+      margin-top: -0.4rem;
     }
   }
 </style>
diff --git a/front/src/views/personalCenter/components/MyPublish.vue b/front/src/views/personalCenter/components/MyPublish.vue
index 843b5242..408537c4 100644
--- a/front/src/views/personalCenter/components/MyPublish.vue
+++ b/front/src/views/personalCenter/components/MyPublish.vue
@@ -12,14 +12,14 @@
       />
       <a-button
         type="primary"
-        style="width: 90px; height: 36px; margin-left: 10px"
-        @click="nenglishangjia"
+        style="width: 0.9rem; height: 0.36rem; margin-left: 0.1rem"
+        @click="showModal2"
       >
         能力上架
       </a-button>
       <a-button
         type="primary"
-        style="width: 90px; height: 36px; margin-left: 10px"
+        style="width: 0.9rem; height: 0.36rem; margin-left: 0.1rem"
         @click="replacement"
       >
         重置
@@ -36,7 +36,7 @@
         {{ item }}
       </div>
     </div>
-    <div class="tab" style="margin-top: 10px">
+    <div class="tab" style="margin-top: 0.1rem">
       <span>能力状态</span>
       <div
         :class="tabIndex2 == index ? 'tabclass' : ' '"
@@ -96,7 +96,7 @@
               width="80"
               height="80"
               v-if="item.delFlag == 4 || item.delFlag == 5"
-              style="position: absolute; top: 20px; left: 10px"
+              style="position: absolute; top: 0.2rem; left: 0.1rem"
             >
               <path
                 d="M955.22053 256C813.82053 11.2 500.72053-72.6 255.92053 68.8S-72.67947 523.2 68.72053 768 523.22053 1096.6 768.02053 955.2c244.7-141.2 328.6-454.1 187.4-698.8 0-0.1-0.1-0.3-0.2-0.4zM762.02053 944.7c-239 138.1-544.8 56.2-682.9-182.8S22.92053 217.1 261.92053 79.1s544.8-56.2 682.9 182.8c137.9 239 56.1 544.6-182.8 682.8z"
@@ -146,7 +146,7 @@
     <a-modal
       v-model:visible="detailsVisible"
       :title="tabname"
-      style="width: 900px"
+      style="width: 9rem"
       :footer="null"
       destroyOnClose="true"
       :maskClosable="false"
@@ -159,7 +159,7 @@
     <a-modal
       v-model:visible="increasedVisible"
       :title="tabname"
-      style="width: 900px"
+      style="width: 9rem"
       :footer="null"
       destroyOnClose="true"
       :maskClosable="false"
@@ -174,6 +174,55 @@
     >
       <a-input v-model:value="reason" placeholder="请输入下架原因" />
     </a-modal>
+    <a-modal
+      v-model:visible="visible2"
+      @ok="handleOk"
+      class="shangjia-class"
+      @cancel="handlecancel"
+    >
+      <div class="ant-modal-title" id="vcDialogTitle1">
+        <div class="showBg"></div>
+        能力上架申请
+      </div>
+      <div class="ability-to-type">
+        <div class="title">能力类型选择</div>
+        <div class="content">
+          <div
+            v-for="item in abilityToType"
+            :key="item"
+            @click="abilityToTypeFunction(item)"
+            :class="
+              abilityToTypeFunctionData == item ? 'ability-to-type-down' : ''
+            "
+          >
+            {{ item }}
+          </div>
+        </div>
+      </div>
+      <div
+        class="component-type"
+        v-if="abilityToTypeFunctionData == '组件服务'"
+      >
+        <div class="title">组件类型选择</div>
+        <div class="content">
+          <!-- <a-checkbox-group
+                v-model:value="value1"
+                name="checkboxgroup"
+                :options="componentType"
+              /> -->
+          <a-radio-group v-model:value="componentTypeValue">
+            <a-radio
+              @click="componentTypeValueFunction(item)"
+              v-for="item in componentType"
+              :key="item"
+              :value="item"
+            >
+              {{ item }}
+            </a-radio>
+          </a-radio-group>
+        </div>
+      </div>
+    </a-modal>
   </div>
 </template>
 
@@ -215,6 +264,50 @@
   let name = ref('')
   let tabIndex = ref(0)
   let tabIndex2 = ref(-1)
+  const visible2 = ref(false)
+  const showModal2 = () => {
+    visible2.value = true
+  }
+  let componentTypeValue = ref('')
+  let abilityToTypeFunctionData = ref('组件服务')
+  function handlecancel() {
+    abilityToTypeFunctionData.value = '组件服务'
+    componentTypeValue.value = ''
+  }
+  function abilityToTypeFunction(item) {
+    abilityToTypeFunctionData.value = item
+  }
+  const handleOk = (e) => {
+    let snum = ref({})
+    if (abilityToTypeFunctionData.value == '组件服务') {
+      snum.value = {
+        abilityToType: abilityToTypeFunctionData.value,
+        componentTypeValue: componentTypeValue.value,
+      }
+    } else {
+      snum.value = {
+        abilityToType: abilityToTypeFunctionData.value,
+      }
+    }
+    const applypage = router.resolve({
+      path: '/nenglishangjia', // 跳转的页面路由
+      query: snum.value,
+    })
+    window.open(applypage.href, '_blank')
+    visible.value = false
+    abilityToTypeFunctionData.value = '组件服务'
+    componentTypeValue.value = ''
+    console.log(e)
+  }
+  let abilityToType = ref(['组件服务', '应用资源'])
+  let componentType = ref([
+    '智能算法',
+    'GIS图层',
+    '开发组件',
+    '办公组件',
+    '业务组件',
+    '其他',
+  ])
   let tabname = ref('组件服务')
   function tabqiehuan(item, index) {
     // debugger
@@ -333,11 +426,11 @@
   const newpage = router.resolve({
     path: '/nenglishangjia', // 跳转的页面路由
   })
-  const nenglishangjia = () => {
-    // debugger
-    window.open(newpage.href, '_blank')
-    // router.resolve('/nenglishangjia')
-  }
+  // const nenglishangjia = () => {
+  //   // debugger
+  //   window.open(newpage.href, '_blank')
+  //   // router.resolve('/nenglishangjia')
+  // }
   const handlePageSizeChange = (current, size) => {
     page.value = current
     limt.value = size
@@ -377,88 +470,88 @@
 <style scoped lang="less">
   .on-the-right-side-of-the-list {
     background: #ffffff;
-    padding: 20px 0px 30px 20px;
+    padding: 0.2rem 0rem 0.3rem 0.2rem;
     position: absolute;
-    width: 1087px;
-    height: 810px;
-    top: 0px;
+    width: 10.87rem;
+    height: 8.1rem;
+    top: 0rem;
     display: flex;
-    margin-top: 20px;
+    margin-top: 0.2rem;
     flex-direction: column;
-    font-size: 16px;
+    font-size: 0.16rem;
     justify-content: left;
     .title {
-      font-size: 20px;
+      font-size: 0.2rem;
       color: #000000;
       font-family: 'Alibaba PuHuiTi';
       font-weight: 500;
     }
     .sousuokuang {
-      margin: 20px 0px 21px 0px;
+      margin: 0.2rem 0rem 0.21rem 0rem;
       .ant-input-search {
-        max-width: 490px;
+        max-width: 4.9rem;
       }
       :deep(.ant-input) {
-        width: 400px;
-        height: 36px;
-        font-size: 14px;
+        width: 4rem;
+        height: 0.36rem;
+        font-size: 0.14rem;
         color: #b2b2b2;
         background: #f5f5f5;
       }
       :deep(.ant-input-group-addon) {
         display: inline-block;
-        margin-left: 10px;
+        margin-left: 0.1rem;
         .ant-input-search-button {
-          width: 80px;
-          height: 36px;
-          border-radius: 4px;
-          font-size: 14px;
+          width: 0.8rem;
+          height: 0.36rem;
+          border-radius: 0.04rem;
+          font-size: 0.14rem;
         }
       }
     }
     .tab {
       display: flex;
-      font-size: 14px;
+      font-size: 0.14rem;
       color: #999999;
       div {
-        width: 70px;
-        height: 24px;
-        border: 1px solid #cccccc;
-        border-radius: 12px;
-        margin-left: 10px;
+        width: 0.7rem;
+        height: 0.24rem;
+        border: 0.01rem solid #cccccc;
+        border-radius: 0.12rem;
+        margin-left: 0.1rem;
         text-align: center;
         color: #666666;
         cursor: pointer;
       }
       .tabclass {
-        border: 1px solid #0087ff;
+        border: 0.01rem solid #0087ff;
         color: #0087ff;
       }
     }
     .content {
-      padding-right: 10px;
-      height: 510px;
+      padding-right: 0.1rem;
+      height: 5.1rem;
       overflow: auto;
       .content-body {
-        padding-bottom: 20px;
-        padding-top: 20px;
-        margin-right: 10px;
-        // height: 120px;
-        border-bottom: #cccccc 1px solid;
+        padding-bottom: 0.2rem;
+        padding-top: 0.2rem;
+        margin-right: 0.1rem;
+        // height: 1.20rem;
+        border-bottom: #cccccc 0.01rem solid;
         position: relative;
         .content-body-title {
-          font-size: 14px;
+          font-size: 0.14rem;
           color: #333333;
           font-family: 'Alibaba PuHuiTi';
           font-weight: 500;
         }
         .content-body-content {
-          margin-top: 10px;
-          margin-bottom: 10px;
-          width: 720px;
+          margin-top: 0.1rem;
+          margin-bottom: 0.1rem;
+          width: 7.2rem;
           .content-body-content-son {
-            line-height: 16px;
-            font-size: 12px;
+            line-height: 0.16rem;
+            font-size: 0.12rem;
             width: 100%;
             text-overflow: -o-ellipsis-lastline;
             overflow: hidden;
@@ -472,35 +565,35 @@
         .content-body-bottom {
           display: flex;
           color: #cccccc;
-          font-size: 12px;
+          font-size: 0.12rem;
           div:first-child {
-            margin-right: 30px;
+            margin-right: 0.3rem;
           }
         }
       }
     }
     .bottom {
       position: absolute;
-      bottom: 30px;
-      right: 20px;
+      bottom: 0.3rem;
+      right: 0.2rem;
     }
 
     .button {
       position: absolute;
-      right: 20px;
-      top: 0px;
-      width: 96px;
+      right: 0.2rem;
+      top: 0rem;
+      width: 0.96rem;
       // background: #0087ff;
       cursor: pointer;
       div {
-        margin-top: 20px;
-        height: 30px;
+        margin-top: 0.2rem;
+        height: 0.3rem;
         background: #0087ff;
-        font-size: 14px;
+        font-size: 0.14rem;
         color: #fff;
-        border-radius: 4px;
+        border-radius: 0.04rem;
         text-align: center;
-        line-height: 30px;
+        line-height: 0.3rem;
       }
       .del {
         background: #ccc;
@@ -510,10 +603,101 @@
       }
     }
     .button-state {
-      top: 60px;
+      top: 0.6rem;
     }
     .buttonAgree {
       background-color: #49c988;
     }
   }
 </style>
+
+<style lang="less">
+  .shangjia-class {
+    position: fixed;
+    left: 50%;
+    top: 50%;
+    margin-left: -2.6rem;
+    margin-top: -1.44rem;
+    font-size: 0.14rem;
+    font-weight: 500;
+    .ant-radio-inner {
+      height: 0.16rem;
+      width: 0.16rem;
+    }
+    .ant-radio-inner::after {
+      background-color: unset;
+      background: url('~@/assets/personalCenter/xuanzhong.png') no-repeat;
+      background-size: cover;
+      background-position: center;
+    }
+    .ant-modal-content {
+      border-radius: 0.1rem;
+      .ability-to-type,
+      .component-type {
+        display: flex;
+        margin-top: 0.2rem;
+        .title {
+          white-space: nowrap;
+          margin-right: 0.2rem;
+          display: flex;
+          align-items: center;
+          height: 0.26rem;
+        }
+        .content {
+          width: 100%;
+          .ant-radio-group {
+            display: grid;
+            grid-template-columns: 1fr 1fr 1fr;
+            grid-gap: 0.15rem;
+          }
+        }
+      }
+      .ability-to-type {
+        .content {
+          display: grid;
+          grid-template-columns: 1fr 1fr 1fr;
+          div {
+            margin-right: 0.15rem;
+            cursor: pointer;
+            font-size: 0.14rem;
+            width: 0.9rem;
+            height: 0.26rem;
+            border-radius: 0.13rem;
+            color: #333333;
+            background: #f5f5f5;
+            border: 0.01rem #cccccc solid;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-weight: 500;
+          }
+          .ability-to-type-down {
+            background: #0087ff;
+            color: #fff;
+          }
+        }
+      }
+    }
+    .ant-modal-title {
+      display: flex;
+      align-items: center;
+    }
+    .ant-modal-footer {
+      border: 0;
+      text-align: center;
+      padding-bottom: 0.2rem;
+      button {
+        margin-right: 0.2rem;
+        border-radius: 0.08rem;
+      }
+    }
+    .showBg {
+      height: 0.24rem;
+      width: 0.24rem;
+      background: url('~@/assets/home/shenqing.png') no-repeat;
+      background-size: cover;
+      background-position: center;
+      margin-right: 0.1rem;
+    }
+  }
+</style>
diff --git a/front/src/views/personalCenter/components/TheNewRelease.vue b/front/src/views/personalCenter/components/TheNewRelease.vue
index 0bd3d14b..b51d7160 100644
--- a/front/src/views/personalCenter/components/TheNewRelease.vue
+++ b/front/src/views/personalCenter/components/TheNewRelease.vue
@@ -2,7 +2,7 @@
  * @Author: hisense.liangjunhua
  * @Date: 2022-06-01 17:49:38
  * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-06-14 10:48:43
+ * @LastEditTime: 2022-06-14 11:30:30
  * @Description: 能力上架
 -->
 <template>
@@ -16,13 +16,25 @@
   import HomeHeader from '@/views/home/components/header'
   import Algorithm from '@/views/capacityOnTheShelf/Algorithm'
   import Application from '@/views/capacityOnTheShelf/Application'
+  import { useRouter } from 'vue-router'
   import { ref } from 'vue'
-  const type = ref('application')
+  const router = useRouter()
+  const type = ref('')
+  const abilityToType = router.currentRoute.value.query.abilityToType
+  if (abilityToType === '应用资源') {
+    type.value = 'application'
+  } else {
+    const componentTypeValue =
+      router.currentRoute.value.query.componentTypeValue
+    if (componentTypeValue === '智能算法') {
+      type.value = 'algorithm'
+    }
+  }
   window.sessionStorage.setItem('preview', JSON.stringify({}))
 </script>
 <style scoped lang="less">
   .the-new-release {
     background: #f5f7fa;
-    height: 1080px;
+    height: 10.8rem;
   }
 </style>