front/src/router/index.js

@@ -453,15 +453,6 @@ export const constantRoutes = [
       icon: 'error-warning-line',
     },
   },
-  {
-    path: '/packagingDetails',
-    name: 'packagingDetails',
-    component: () => import('@/views/home/packagingDetails'),
-    meta: {
-      title: '打包模式详情',
-      icon: 'error-warning-line',
-    },
-  },
   {
     path: '/integrationServices',
     name: 'integrationServices',

front/src/views/home/integrationServices.vue

@@ -5,28 +5,56 @@
     <div class="top">
       <div class="top-title">
         全部：
-        <div v-for="(item, index) in titleName" :key="index" class="tabAll" @click="changeCards(index)"
+        <div 
+          v-for="(item, index) in titleName" 
+          :key="index" 
+          class="tabAll" 
+          @click="changeCards(index)"
           :class="{ sel: index == number }">
-          <span>{{ item.name }}</span>
+            <span>{{ item.name }}</span>
         </div>
       </div>
       <div class="resultListSearchInput-father">
         <div class="resultListSearchInput-son">
           模糊搜索
-          <a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large"
+          <a-input-search
-            @search="getAppResources" @change="onSearch" class="resultListSearchInput" />
+            v-model:value="searchValue"
+            placeholder="请输入关键词"
+            enter-button="搜索"
+            size="large"
+            @search="getAppResources"
+            @change="onSearch"
+            class="resultListSearchInput"
+          />
           <button class="button-reset" @click="chongzhi()">重置</button>
           <div class="hengxian"></div>
         </div>
       </div>
-      <searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2"
+      <searchResultList
-        :resourceList="resourceList" :resourceTotal="resourceTotal" :selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
+        v-show="resourceList.data && resourceList.data.length > 0"
+        :key="listKey2"
+        :resourceList="resourceList"
+        :resourceTotal="resourceTotal"
+        selectCardsname="融合服务"
+      />
       <div class="pagination">
-        <a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
+        <a-pagination
-          v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper :total="resourceTotal"
+          v-if="resourceList.data && resourceList.data.length > 0"
-          :page-size-options="pageSizeOptions" @change="pageChange" @showSizeChange="onShowSizeChange" />
+          v-model:current="currentPage"
+          v-model:pageSize="currentPageSize"
+          show-size-changer
+          show-less-items
+          show-quick-jumper
+          :total="resourceTotal"
+          :page-size-options="pageSizeOptions"
+          @change="pageChange"
+          @showSizeChange="onShowSizeChange"
+        />
       </div>
-      <div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
+      <div
+        v-if="resourceList.data && resourceList.data.length <= 0"
+        style="margin-top: 2rem"
+      >
         <a-empty />
       </div>
     </div>
@@ -34,330 +62,327 @@
   <home-footer></home-footer>
 </template>
 <script>
-import HomeFooter from '@/views/newHome/components/Footer'
+  import HomeFooter from '@/views/newHome/components/Footer'
-import mybus from '@/myplugins/mybus'
+  import mybus from '@/myplugins/mybus'
-import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
+  import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
 
-import { getIntegrationServicesList } from '@/api/home.js'
+  import { getIntegrationServicesList } from '@/api/home.js'
-import { useRouter } from 'vue-router'
+  import { useRouter } from 'vue-router'
-import HomeHeader from '@/views/home/components/header'
+  import HomeHeader from '@/views/home/components/header'
-import searchResultList from '@/views/home/components/searchResultList.vue'
+  import searchResultList from '@/views/home/components/searchResultList.vue'
-import { message } from 'ant-design-vue'
+  import { message } from 'ant-design-vue'
 
-export default defineComponent({
+  export default defineComponent({
-  setup() {
+    setup() {
-    // 分页
-    const loading = ref(true)
-    const currentPage = ref(1)
-    const currentPageSize = ref(5)
-    const pageSizeOptions = ref(['5', '10', '20', '50'])
-    const router = useRouter()
-    const select = router.currentRoute.value.query.select
-    const searchValue = ref('')
-    const Cardsname = ref(select)
-    const resourceList = reactive({ data: [] })
-    const resourceTotal = ref(0)
-    const current = ref(1)
-    // 选项卡
-    const titleName = ref([
-      {
-        name: '打包模式',
-      },
-      {
-        name: '赋能场景',
-      },
-    ])
-
-    const number = ref(0)
-    // 刷新筛选条件组件
-    let listKey = ref(0)
-    // 刷新筛选列表信息组件
-    const listKey2 = ref(0)
-
-    // 查询参数
-    const paramsGetResources = {
-      pageNum: 1,
-      pageSize: currentPageSize.value,
-      type: titleName.value[number.value].name,
-      name: '',
-      orderField: 'create_date', // total 综合 visits 访问量 applyCount 申请量 score 评分  collectCount 收藏量
-      orderType: 'DESC', // ASC 升序  DESC 降序
-    }
-
-    const changeCards = (val) => {
-      console.log(val)
-      number.value = val
-      chongzhi()
-    }
-
-    // 查询
-    const onSearch = () => {
-      loading.value = true
-      currentPage.value = 1
-    }
-    // 重置数据
-    const chongzhi = () => {
-      loading.value = true
-      // 重置模糊查字段
-      searchValue.value = ''
       // 分页
-      currentPage.value = 1
+      const loading = ref(true)
-      currentPageSize.value = 5
+      const currentPage = ref(1)
-      // 重置查询条件
+      const currentPageSize = ref(5)
-      paramsGetResources.pageNum = 1
+      const pageSizeOptions = ref(['5', '10', '20', '50'])
-      paramsGetResources.pageSize = 5
+      const router = useRouter()
-      paramsGetResources.orderField = 'create_date'
+      const select = router.currentRoute.value.query.select
-      paramsGetResources.orderType = 'DESC'
+      const searchValue = ref('')
-      mybus.emit('chongzhi', {
+      const Cardsname = ref(select)
-        type: titleName.value[number.value].name,
+      const resourceList = reactive({ data: [] })
-      })
+      const resourceTotal = ref(0)
-      getAppResources()
+      const current = ref(1)
-    }
+      // 选项卡
-
+      const titleName = ref([
-    const getAppResources = () => {
+        {
-      getIntegrationList()
+          name: '打包模式',
-    }
-
-    // 获取融合服务列表
-    const getIntegrationList = () => {
-      let postData = {
-        limit: currentPageSize.value,
-        page: currentPage.value,
-        orderField: paramsGetResources.orderField,
-        orderType: paramsGetResources.orderType,
-        name: searchValue.value,
-        type: titleName.value[number.value].name,
-      }
-      getIntegrationServicesList(postData).then(
-        (res) => {
-          if (res.data.code !== 0) {
-            return message.error(res.data.msg)
-          }
-          resourceList.data = res.data.data.list || []
-          resourceTotal.value = res.data.data.total || 0
         },
-        (err) => {
+        {
-          message.error(err)
+          name: '赋能场景',
-        }
+        },
-      )
+      ])
-    }
 
-    mybus.on('paramsGetResources', (ids) => {
+      const number = ref(0)
-      if (ids && ids.length > 0) {
+      // 刷新筛选条件组件
-        paramsGetResources.deptIds = ids
+      let listKey = ref(0)
-      } else {
+      // 刷新筛选列表信息组件
-        delete paramsGetResources.deptIds
+      const listKey2 = ref(0)
+
+      // 查询参数
+      const paramsGetResources = {
+        pageNum: 1,
+        pageSize: currentPageSize.value,
+        type: titleName.value[number.value].name,
+        name: '',
+        orderField: 'create_date', // total 综合 visits 访问量 applyCount 申请量 score 评分  collectCount 收藏量
+        orderType: 'DESC', // ASC 升序  DESC 降序
       }
-      getAppResources()
-      console.log('paramsGetResources', paramsGetResources)
-    })
-    mybus.on('changePage', (page) => {
-      paramsGetResources.pageNum = page
-      getAppResources('分页查询')
-    })
-    mybus.on('changeSelcted', () => {
-      getAppResources()
-    })
 
-    mybus.on('refresh', () => {
+      const changeCards = (val) => {
-      paramsGetResources.pageNum = 1
+        console.log(val)
-      currentPage.value = 1
+        number.value = val
-      getAppResources()
+        chongzhi()
-    })
+      }
-    mybus.on('changeCondition', (condition) => {
-      paramsGetResources.orderField = condition.orderField
-      paramsGetResources.orderType = condition.orderType
-      getAppResources()
-    })
 
-    const pageChange = (val) => {
+      // 查询
-      console.log(val)
+      const onSearch = () => {
-      loading.value = true
+        loading.value = true
-      currentPage.value = val
+        currentPage.value = 1
-      paramsGetResources.pageNum = val
+      }
-      let params = '分页查询' //判断是否是点击下面的分页的调用模糊查询方法还是点击搜索调用模糊查询方法
+      // 重置数据
-      getAppResources(params)
+      const chongzhi = () => {
-    }
+        loading.value = true
+        // 重置模糊查字段
+        searchValue.value = ''
+        // 分页
+        currentPage.value = 1
+        currentPageSize.value = 5
+        // 重置查询条件
+        paramsGetResources.pageNum = 1
+        paramsGetResources.pageSize = 5
+        paramsGetResources.orderField = 'create_date'
+        paramsGetResources.orderType = 'DESC'
+        mybus.emit('chongzhi', {
+          type: titleName.value[number.value].name,
+        })
+        getAppResources()
+      }
 
-    onMounted(() => {
+      const getAppResources = () => {
-      listKey2.value++
+        getIntegrationList()
-      getAppResources()
+      }
-    })
 
-    // 分页
+      // 获取融合服务列表
-    const onShowSizeChange = (current, pageSize) => {
+      const getIntegrationList = () => {
-      currentPage.value = current
+        let postData = {
-      currentPageSize.value = pageSize
+          limit: currentPageSize.value,
-      paramsGetResources.pageNum = current
+          page: currentPage.value,
-      paramsGetResources.pageSize = pageSize
+          orderField: paramsGetResources.orderField,
-      getAppResources()
+          orderType: paramsGetResources.orderType,
-    }
+          name: searchValue.value,
-    watch(currentPageSize, () => {
+          type: titleName.value[number.value].name,
-      console.log('pageSize', currentPageSize.value)
+        }
-    })
+        getIntegrationServicesList(postData).then(
+          (res) => {
+            if (res.data.code !== 0) {
+              return message.error(res.data.msg)
+            }
+            resourceList.data = res.data.data.list || []
+            resourceTotal.value = res.data.data.total || 0
+          },
+          (err) => {
+            message.error(err)
+          }
+        )
+      }
 
-    return {
+      mybus.on('paramsGetResources', (ids) => {
-      listKey,
+        if (ids && ids.length > 0) {
-      searchValue,
+          paramsGetResources.deptIds = ids
-      currentPage,
+        } else {
-      resourceList,
+          delete paramsGetResources.deptIds
-      resourceTotal,
+        }
-      pageChange,
+        getAppResources()
-      listKey2,
+        console.log('paramsGetResources', paramsGetResources)
-      Cardsname,
+      })
-      getAppResources,
+      mybus.on('changePage', (page) => {
-      chongzhi,
+        paramsGetResources.pageNum = page
-      onSearch,
+        getAppResources('分页查询')
-      currentPageSize,
+      })
-      pageSizeOptions,
+      mybus.on('changeSelcted', () => {
-      current,
+        getAppResources()
-      loading,
+      })
-      titleName,
+
-      changeCards,
+      mybus.on('refresh', () => {
-      number,
+        paramsGetResources.pageNum = 1
-    }
+        currentPage.value = 1
-  },
+        getAppResources()
-  components: {
+      })
-    HomeHeader,
+      mybus.on('changeCondition', (condition) => {
-    HomeFooter,
+        paramsGetResources.orderField = condition.orderField
-    searchResultList,
+        paramsGetResources.orderType = condition.orderType
-  },
+        getAppResources()
-  beforeUnmount() {
+      })
-    mybus.off('paramsGetResources')
+
-    mybus.off('changeCondition')
+      const pageChange = (val) => {
-    mybus.off('refresh')
+        console.log(val)
-    mybus.off('changePage')
+        loading.value = true
-  },
+        currentPage.value = val
-})
+        paramsGetResources.pageNum = val
+        let params = '分页查询' //判断是否是点击下面的分页的调用模糊查询方法还是点击搜索调用模糊查询方法
+        getAppResources(params)
+      }
+
+      onMounted(() => {
+        listKey2.value++
+        getAppResources()
+      })
+
+      // 分页
+      const onShowSizeChange = (current, pageSize) => {
+        currentPage.value = current
+        currentPageSize.value = pageSize
+        paramsGetResources.pageNum = current
+        paramsGetResources.pageSize = pageSize
+        getAppResources()
+      }
+      watch(currentPageSize, () => {
+        console.log('pageSize', currentPageSize.value)
+      })
+
+      return {
+        listKey,
+        searchValue,
+        currentPage,
+        resourceList,
+        resourceTotal,
+        pageChange,
+        listKey2,
+        Cardsname,
+        getAppResources,
+        chongzhi,
+        onSearch,
+        currentPageSize,
+        pageSizeOptions,
+        current,
+        loading,
+        titleName,
+        changeCards,
+        number,
+      }
+    },
+    components: {
+      HomeHeader,
+      HomeFooter,
+      searchResultList,
+    },
+    beforeUnmount() {
+      mybus.off('paramsGetResources')
+      mybus.off('changeCondition')
+      mybus.off('refresh')
+      mybus.off('changePage')
+    },
+  })
 </script>
 <style lang="less" scoped>
-.resultListSearchInput-father {
+  .resultListSearchInput-father {
-  background: #f3f5f9;
+    background: #f3f5f9;
-  padding: 0.2rem;
+    padding: 0.2rem;
 
-  // padding-left: 0.2rem;
+    // padding-left: 0.2rem;
-  // padding-top: 0.2rem;
+    // padding-top: 0.2rem;
-  .resultListSearchInput-son {
+    .resultListSearchInput-son {
-    background: #fff;
+      background: #fff;
-    padding: 0.2rem 0.2rem 0rem 0.3rem;
+      padding: 0.2rem 0.2rem 0rem 0.3rem;
 
-    .hengxian {
+      .hengxian {
-      width: 100%;
+        width: 100%;
-      height: 0.01rem;
+        height: 0.01rem;
-      background: rgba(150, 144, 144, 0.3);
+        background: rgba(150, 144, 144, 0.3);
-      margin-top: 0.2rem;
+        margin-top: 0.2rem;
+      }
     }
   }
-}
 
-.resultListSearchInput {
+  .resultListSearchInput {
-  margin-left: 0.1rem;
+    margin-left: 0.1rem;
 
-  :deep(.ant-input) {
+    :deep(.ant-input) {
-    width: 4rem;
+      width: 4rem;
-    height: 0.36rem;
+      height: 0.36rem;
-    background: #fff;
+      background: #fff;
-    border-radius: 0.04rem;
+      border-radius: 0.04rem;
+    }
+
+    :deep(.ant-input-search-button) {
+      width: 0.8rem;
+      height: 0.36rem;
+      background: #0087ff;
+      border-radius: 0.04rem !important;
+      font-size: 0.14rem;
+      font-weight: 400;
+      color: #fff;
+      line-height: 0.34rem;
+      margin-left: 0.1rem;
+    }
+
+    :deep(.ant-input-group-addon) {
+      left: 0 !important;
+    }
   }
 
-  :deep(.ant-input-search-button) {
+  .button-reset {
+    border: 0;
+    outline: none;
     width: 0.8rem;
     height: 0.36rem;
-    background: #0087ff;
+    background: #e1edfa;
-    border-radius: 0.04rem !important;
+    border-radius: 0.04rem;
     font-size: 0.14rem;
     font-weight: 400;
-    color: #fff;
+    color: #0087ff;
     line-height: 0.34rem;
-    margin-left: 0.1rem;
+    margin-left: 2.5rem;
+    cursor: pointer;
   }
 
-  :deep(.ant-input-group-addon) {
+  .details-pageconetent {
-    left: 0 !important;
+    height: 100%;
-  }
+    width: 100%;
-}
-
-.button-reset {
-  border: 0;
-  outline: none;
-  width: 0.8rem;
-  height: 0.36rem;
-  background: #e1edfa;
-  border-radius: 0.04rem;
-  font-size: 0.14rem;
-  font-weight: 400;
-  color: #0087ff;
-  line-height: 0.34rem;
-  margin-left: 2.5rem;
-  cursor: pointer;
-}
-
-.details-pageconetent {
-  height: 100%;
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-top: 0.67rem;
-  position: relative;
-  background: rgba(245, 243, 243, 0.3);
-
-  .details-pageconetent-left {
-    max-height: 6.9rem;
-    position: absolute;
-    width: 2.5rem;
-    top: 0.17rem;
-    left: 2.5rem;
-    margin-right: 0.17rem;
-    overflow: auto;
-  }
-
-  .top {
-    min-height: 7.2rem;
-    position: relative;
-    width: 11.5rem;
     display: flex;
-    padding-top: 0.2rem;
+    justify-content: center;
-    flex-direction: column;
+    align-items: center;
-    font-size: 0.16rem;
+    margin-top: 0.67rem;
-    justify-content: left;
+    position: relative;
-    background: #f3f5f9;
+    background: rgba(245, 243, 243, 0.3);
 
-    .pagination {
+    .details-pageconetent-left {
-      background: #f3f5f9;
+      max-height: 6.9rem;
-      padding-bottom: 0.6rem;
+      position: absolute;
+      width: 2.5rem;
+      top: 0.17rem;
+      left: 2.5rem;
+      margin-right: 0.17rem;
+      overflow: auto;
     }
 
-    .top-title {
+    .top {
-      padding: 0.2rem;
+      min-height: 7.2rem;
+      position: relative;
+      width: 11.5rem;
       display: flex;
-      font-size: 18px;
+      padding-top: 0.2rem;
+      flex-direction: column;
+      font-size: 0.16rem;
+      justify-content: left;
+      background: #f3f5f9;
 
-      .tabAll {
+      .pagination {
-        font-size: 18px;
+        background: #f3f5f9;
-        color: #000000;
+        padding-bottom: 0.6rem;
-        margin-right: 35px;
-        cursor: pointer;
       }
 
-      .tabAll:nth-child(1) {
+      .top-title {
-        margin-left: 20px;
+        padding: 0.2rem;
-      }
+        display: flex;
-
+        font-size: 22px;
-      .sel {
+        .tabAll {
-        font-weight: 600;
+          font-size: 22px;
-        color: #0087ff;
+          color: #000000;
-        border-bottom: 0.02rem solid #0087ff;
+          margin-right: 35px;
+          cursor: pointer;
+        }
+        .tabAll:nth-child(1) {
+          margin-left: 20px;
+        }
+        .sel {
+          font-weight: 600;
+          color: #0087ff;
+          border-bottom: 0.02rem solid #0087ff;
+        }
       }
     }
   }
-}
 
-:deep(.ant-card-grid) {
+  :deep(.ant-card-grid) {
-  overflow: hidden;
+    overflow: hidden;
-  white-space: nowrap;
+    white-space: nowrap;
-  text-overflow: ellipsis;
+    text-overflow: ellipsis;
-  -webkit-line-clamp: 1;
+    -webkit-line-clamp: 1;
-  word-break: break-all;
+    word-break: break-all;
-}
+  }
 </style>

front/src/views/home/packagingDetails.vue

@@ -1,153 +0,0 @@
-<template>
-  <!-- 青岛 -->
-  <div class="details-pageconetent">
-    <home-header></home-header>
-    <div></div>
-    <home-footer></home-footer>
-  </div>
-
-</template>
-<script setup>
-import HomeFooter from '@/views/newHome/components/Footer'
-import mybus from '@/myplugins/mybus'
-import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
-
-import { getIntegrationServicesList } from '@/api/home.js'
-import { useRouter } from 'vue-router'
-import HomeHeader from '@/views/home/components/header'
-import searchResultList from '@/views/home/components/searchResultList.vue'
-import { message } from 'ant-design-vue'
-
-
-</script>
-<style lang="less" scoped>
-.resultListSearchInput-father {
-  background: #f3f5f9;
-  padding: 0.2rem;
-
-  // padding-left: 0.2rem;
-  // padding-top: 0.2rem;
-  .resultListSearchInput-son {
-    background: #fff;
-    padding: 0.2rem 0.2rem 0rem 0.3rem;
-
-    .hengxian {
-      width: 100%;
-      height: 0.01rem;
-      background: rgba(150, 144, 144, 0.3);
-      margin-top: 0.2rem;
-    }
-  }
-}
-
-.resultListSearchInput {
-  margin-left: 0.1rem;
-
-  :deep(.ant-input) {
-    width: 4rem;
-    height: 0.36rem;
-    background: #fff;
-    border-radius: 0.04rem;
-  }
-
-  :deep(.ant-input-search-button) {
-    width: 0.8rem;
-    height: 0.36rem;
-    background: #0087ff;
-    border-radius: 0.04rem !important;
-    font-size: 0.14rem;
-    font-weight: 400;
-    color: #fff;
-    line-height: 0.34rem;
-    margin-left: 0.1rem;
-  }
-
-  :deep(.ant-input-group-addon) {
-    left: 0 !important;
-  }
-}
-
-.button-reset {
-  border: 0;
-  outline: none;
-  width: 0.8rem;
-  height: 0.36rem;
-  background: #e1edfa;
-  border-radius: 0.04rem;
-  font-size: 0.14rem;
-  font-weight: 400;
-  color: #0087ff;
-  line-height: 0.34rem;
-  margin-left: 2.5rem;
-  cursor: pointer;
-}
-
-.details-pageconetent {
-  height: 100%;
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-top: 0.67rem;
-  position: relative;
-  background: rgba(245, 243, 243, 0.3);
-
-  .details-pageconetent-left {
-    max-height: 6.9rem;
-    position: absolute;
-    width: 2.5rem;
-    top: 0.17rem;
-    left: 2.5rem;
-    margin-right: 0.17rem;
-    overflow: auto;
-  }
-
-  .top {
-    min-height: 7.2rem;
-    position: relative;
-    width: 11.5rem;
-    display: flex;
-    padding-top: 0.2rem;
-    flex-direction: column;
-    font-size: 0.16rem;
-    justify-content: left;
-    background: #f3f5f9;
-
-    .pagination {
-      background: #f3f5f9;
-      padding-bottom: 0.6rem;
-    }
-
-    .top-title {
-      padding: 0.2rem;
-      display: flex;
-      font-size: 18px;
-
-      .tabAll {
-        font-size: 18px;
-        color: #000000;
-        margin-right: 35px;
-        cursor: pointer;
-      }
-
-      .tabAll:nth-child(1) {
-        margin-left: 20px;
-      }
-
-      .sel {
-        font-weight: 600;
-        color: #0087ff;
-        border-bottom: 0.02rem solid #0087ff;
-      }
-    }
-  }
-}
-
-:deep(.ant-card-grid) {
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  -webkit-line-clamp: 1;
-  word-break: break-all;
-}
-</style>