广场新增删选条件

2022-09-19 10:19:31 +08:00 · 2022-09-19 10:19:31 +08:00 · 6ef87c3c79
parent de605dd446
commit 6ef87c3c79
4 changed files with 271 additions and 21 deletions
--- a/front/public/static/config/basicConfig.js
+++ b/front/public/static/config/basicConfig.js
@ -1,8 +1,8 @@
 /*
 * @Author: hisense.wuhongjian
 * @Date: 2020-07-07 16:03:23
- * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-08-27 14:25:54
+ * @LastEditors: hisense.liangjunhua
+ * @LastEditTime: 2022-09-19 09:36:49
 * @Description: 系统静态参数配置
 */
 var _global = {}
@ -59,8 +59,8 @@ var CONFIGITEM = {
      },
      backUrl: 'http://localhost:8001',
      previewUrl: 'http://192.168.124.236:9796/',
-      // websocketURL: '192.168.124.236:8888/renren-admin',
-      websocketURL: '10.18.1.99:8889/renren-admin',
+      websocketURL: '192.168.124.236:8888/renren-admin',
+      // websocketURL: '10.18.1.99:8889/renren-admin',
      POI_URL:
        'http://15.72.178.129:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address',
    },
--- a/front/src/views/capacitySquare/components/algorithm.vue
+++ b/front/src/views/capacitySquare/components/algorithm.vue
@ -1,6 +1,18 @@
 <!-- 智能算法 -->
 <template>
  <div class="algorithm">
+    <div class="select">
+      <div class="top" @click="selectFlag2 = true">
+        {{ typeName2 }}
+        <div class="light"></div>
+      </div>
+      <div class="bottom" v-show="selectFlag2">
+        <span class="light"></span>
+        <div v-for="val in dictList" :key="val" @click="getList2(val)">
+          {{ val }}
+        </div>
+      </div>
+    </div>
    <div class="algorithm-class">
      <div
        v-for="(item, index) in dataList"
@ -27,9 +39,25 @@
  </div>
 </template>
 <script setup>
+  import { getCategoryTreePage } from '@/api/personalCenter'
  import { pageWithAttrs } from '@/api/abilityStatistics'
  import { ref, onMounted, onBeforeUnmount } from 'vue'
+  const typeName2 = ref('全部')
+  const dictList = ref([])
  const dataList = ref([])
+  const selectFlag2 = ref(false)
+  getCategoryTreePage({
+    page: 1,
+    limit: 99,
+    dictTypeId: '1513712507692818433',
+  }).then((res) => {
+    dictList.value = ['全部']
+    res.data.data.list.map((val) => {
+      if (val.dictLabel !== '其他') {
+        dictList.value.push(val.dictLabel)
+      }
+    })
+  })
  const params = {
    deptIds: [],
    districtId: '',
@ -40,6 +68,19 @@
    pageSize: 9,
    type: '组件服务',
  }
+  const getList2 = (val) => {
+    typeName2.value = val
+    if (val == '全部') {
+      params.infoList = [{ attrType: '组件类型', attrValue: '智能算法' }]
+    } else {
+      params.infoList = [
+        { attrType: '组件类型', attrValue: '智能算法' },
+        { attrType: '应用领域', attrValue: val },
+      ]
+    }
+    selectFlag2.value = false
+    pageWithAttrsFunction()
+  }
  let algorithmclass = null
  const imgSrc = ref(require('@/assets/capacitySquare/algorithm-photo.jpg'))
  const dataLength = ref(true)
@ -109,9 +150,67 @@

 <style lang="less" scoped>
  .algorithm {
+    .select {
+      margin: 0.1rem 0 0.1rem 0.2rem;
+      color: #fff;
+      font-size: 0.2rem;
+      font-family: webfont;
+      position: relative;
+      .top {
+        cursor: pointer;
+        width: 3.61rem;
+        height: 0.85rem;
+        font-weight: 600;
+        text-align: center;
+        padding-top: 0.1rem;
+        background: url('~@/assets/capacitySquare/select-bg.png') no-repeat;
+        background-size: 100%;
+        position: relative;
+        .light {
+          width: 0.56rem;
+          height: 3px;
+          position: absolute;
+          top: 0.4rem;
+          left: 1.52rem;
+          background: url('~@/assets/capacitySquare/select-light1.png')
+            no-repeat;
+          background-size: 100%;
+        }
+      }
+      .bottom {
+        cursor: pointer;
+        position: absolute;
+        top: 0.5rem;
+        left: 0.9rem;
+        z-index: 1000;
+        background: rgba(57, 134, 239, 0.68);
+        border: 1px solid #aed5ff;
+        .light {
+          display: inline-block;
+          width: 2.39rem;
+          height: 5px;
+          position: absolute;
+          top: -0.08rem;
+          left: -0.3rem;
+          background: url('~@/assets/capacitySquare/select-light2.png')
+            no-repeat;
+          background-size: 100%;
+        }
+        & > div {
+          width: 1.8rem;
+          height: 0.4rem;
+          line-height: 0.4rem;
+          text-align: center;
+          border-top: 1px solid #aed5ff;
+        }
+        & > div:nth-of-type(1) {
+          border: none;
+        }
+      }
+    }
    .algorithm-class {
-      margin-top: 0.6rem;
-      margin-bottom: 0.59rem;
+      // margin-top: 0.6rem;
+      margin-bottom: 0.18rem;
      display: grid;
      grid-template-columns: repeat(3, 33%);
      height: 8.8rem;
--- a/front/src/views/capacitySquare/components/application.vue
+++ b/front/src/views/capacitySquare/components/application.vue
@ -2,22 +2,36 @@
 * @Author: hisense.liangjunhua
 * @Date: 2022-08-09 09:31:25
 * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-08-10 14:29:05
+ * @LastEditTime: 2022-09-19 10:19:02
 * @Description: 应用资源
 -->
 <template>
  <div class="application">
-    <div class="select">
-      <div class="top" @click="selectFlag = true">
-        {{ typeName }}
-        <div class="light"></div>
+    <div style="display: flex">
+      <div class="select">
+        <div class="top" @click="selectFlag = true">
+          {{ typeName }}
+          <div class="light"></div>
+        </div>
+        <div class="bottom" v-show="selectFlag">
+          <span class="light"></span>
+          <div @click="getList('全市')">全市</div>
+          <div @click="getList('市级')">市级</div>
+          <div @click="getList('区级')">区级</div>
+          <div @click="getList('企业')">企业</div>
+        </div>
      </div>
-      <div class="bottom" v-show="selectFlag">
-        <span class="light"></span>
-        <div @click="getList('全市')">全市</div>
-        <div @click="getList('市级')">市级</div>
-        <div @click="getList('区级')">区级</div>
-        <div @click="getList('企业')">企业</div>
+      <div class="select">
+        <div class="top" @click="selectFlag2 = true">
+          {{ typeName2 }}
+          <div class="light"></div>
+        </div>
+        <div class="bottom" v-show="selectFlag2">
+          <span class="light"></span>
+          <div v-for="val in dictList" :key="val" @click="getList2(val)">
+            {{ val }}
+          </div>
+        </div>
      </div>
    </div>
    <div class="item-box">
@ -38,6 +52,7 @@
  </div>
 </template>
 <script setup>
+  import { getCategoryTreePage } from '@/api/personalCenter'
  import { onMounted, reactive, onBeforeUnmount, ref, nextTick } from 'vue'
  import { selectAppList } from '@/api/home'
  import { useRouter } from 'vue-router'
@ -45,9 +60,25 @@
  const pageNum = ref(1)
  const flag = ref(true)
  const type = ref(null)
+  const area = ref(null)
  const typeName = ref('全市')
+  const typeName2 = ref('全部')
+  const dictList = ref([])
  const data = reactive({ list: [] })
  const selectFlag = ref(false)
+  const selectFlag2 = ref(false)
+  getCategoryTreePage({
+    page: 1,
+    limit: 99,
+    dictTypeId: '1513712507692818433',
+  }).then((res) => {
+    dictList.value = ['全部']
+    res.data.data.list.map((val) => {
+      if (val.dictLabel !== '其他') {
+        dictList.value.push(val.dictLabel)
+      }
+    })
+  })
  let dom = null
  const goToView = (id) => {
    const newpage = router.resolve({
@ -82,7 +113,14 @@
      pageNum.value = 1
      data.list = []
    }
-    selectAppList({ pageNum: pageNum.value, type: type.value }).then((res) => {
+    getData(str)
+  }
+  const getData = (str) => {
+    selectAppList({
+      pageNum: pageNum.value,
+      type: type.value,
+      area: area.value,
+    }).then((res) => {
      if (res.data.data.length < 9) {
        dom.removeEventListener('scroll', viewMonitor, true)
      }
@ -122,6 +160,20 @@
      }
    }
  }
+  const getList2 = (val) => {
+    dom.scrollTop = 0
+    typeName2.value = val
+    pageNum.value = 1
+    data.list = []
+    if (val == '全部') {
+      area.value = null
+      getData()
+    } else {
+      area.value = val
+      getData()
+    }
+    selectFlag2.value = false
+  }
  onMounted(() => {
    dom = document.querySelector('.item-box')
    console.log('box============', dom)
--- a/front/src/views/capacitySquare/components/layer.vue
+++ b/front/src/views/capacitySquare/components/layer.vue
@ -1,6 +1,18 @@
 <!-- 图层服务 -->
 <template>
  <div class="algorithm">
+    <div class="select">
+      <div class="top" @click="selectFlag2 = true">
+        {{ typeName2 }}
+        <div class="light"></div>
+      </div>
+      <div class="bottom" v-show="selectFlag2">
+        <span class="light"></span>
+        <div v-for="val in dictList" :key="val" @click="getList2(val)">
+          {{ val }}
+        </div>
+      </div>
+    </div>
    <div class="algorithm-class">
      <div
        v-for="(item, index) in dataList"
@ -27,10 +39,25 @@
  </div>
 </template>
 <script setup>
+  import { getCategoryTreePage } from '@/api/personalCenter'
  import { pageWithAttrs } from '@/api/abilityStatistics'
  import { ref, onMounted, onBeforeUnmount } from 'vue'
+  const typeName2 = ref('全部')
+  const dictList = ref([])
  const dataList = ref([])
-  let algorithmclass = null
+  const selectFlag2 = ref(false)
+  getCategoryTreePage({
+    page: 1,
+    limit: 99,
+    dictTypeId: '1513712507692818433',
+  }).then((res) => {
+    dictList.value = ['全部']
+    res.data.data.list.map((val) => {
+      if (val.dictLabel !== '其他') {
+        dictList.value.push(val.dictLabel)
+      }
+    })
+  })
  const params = {
    deptIds: [],
    districtId: '',
@ -41,6 +68,20 @@
    pageSize: 9,
    type: '组件服务',
  }
+  const getList2 = (val) => {
+    typeName2.value = val
+    if (val == '全部') {
+      params.infoList = [{ attrType: '组件类型', attrValue: '图层服务' }]
+    } else {
+      params.infoList = [
+        { attrType: '组件类型', attrValue: '图层服务' },
+        { attrType: '应用领域', attrValue: val },
+      ]
+    }
+    selectFlag2.value = false
+    pageWithAttrsFunction()
+  }
+  let algorithmclass = null
  const imgSrc = ref(require('@/assets/capacitySquare/algorithm-photo2.jpg'))
  const dataLength = ref(true)
  const isNoMore = ref(false)
@ -103,9 +144,67 @@

 <style lang="less" scoped>
  .algorithm {
+    .select {
+      margin: 0.1rem 0 0.1rem 0.2rem;
+      color: #fff;
+      font-size: 0.2rem;
+      font-family: webfont;
+      position: relative;
+      .top {
+        cursor: pointer;
+        width: 3.61rem;
+        height: 0.85rem;
+        font-weight: 600;
+        text-align: center;
+        padding-top: 0.1rem;
+        background: url('~@/assets/capacitySquare/select-bg.png') no-repeat;
+        background-size: 100%;
+        position: relative;
+        .light {
+          width: 0.56rem;
+          height: 3px;
+          position: absolute;
+          top: 0.4rem;
+          left: 1.52rem;
+          background: url('~@/assets/capacitySquare/select-light1.png')
+            no-repeat;
+          background-size: 100%;
+        }
+      }
+      .bottom {
+        cursor: pointer;
+        position: absolute;
+        top: 0.5rem;
+        left: 0.9rem;
+        z-index: 1000;
+        background: rgba(57, 134, 239, 0.68);
+        border: 1px solid #aed5ff;
+        .light {
+          display: inline-block;
+          width: 2.39rem;
+          height: 5px;
+          position: absolute;
+          top: -0.08rem;
+          left: -0.3rem;
+          background: url('~@/assets/capacitySquare/select-light2.png')
+            no-repeat;
+          background-size: 100%;
+        }
+        & > div {
+          width: 1.8rem;
+          height: 0.4rem;
+          line-height: 0.4rem;
+          text-align: center;
+          border-top: 1px solid #aed5ff;
+        }
+        & > div:nth-of-type(1) {
+          border: none;
+        }
+      }
+    }
    .algorithm-class {
-      margin-top: 0.6rem;
-      margin-bottom: 0.59rem;
+      // margin-top: 0.6rem;
+      margin-bottom: 0.18rem;
      display: grid;
      grid-template-columns: repeat(3, 33%);
      height: 8.8rem;