From 137f7ff0e203bbfe40e2e71e0d16432cdd4060d9 Mon Sep 17 00:00:00 2001
From: yanran200730 <yanran200830@163.com>
Date: Tue, 7 Dec 2021 15:17:19 +0800
Subject: [PATCH] 25245

---
 src/apps/AppAskForm/AppAskForm.vue         |  13 --
 src/apps/AppAskForm/components/AddList.vue | 211 ++++++++++++---------
 src/apps/AppAskForm/components/List.vue    |  14 +-
 src/apps/AppAskForm/components/Tabbar.vue  |  17 +-
 src/components/AiTopFixed.vue              |   9 +-
 5 files changed, 147 insertions(+), 117 deletions(-)

diff --git a/src/apps/AppAskForm/AppAskForm.vue b/src/apps/AppAskForm/AppAskForm.vue
index e16aaca9..089176ef 100644
--- a/src/apps/AppAskForm/AppAskForm.vue
+++ b/src/apps/AppAskForm/AppAskForm.vue
@@ -31,13 +31,6 @@
     },
 
     onLoad () {
-      uni.$on('reload', () => {
-        if (this.currIndex === 0) {
-          this.$refs.list.reload()
-        } else {
-          this.$refs.addList.getList()
-        }
-      })
     },
 
     methods: {
@@ -45,12 +38,6 @@
         this.params = e.params
         this.component = e.type
       },
-    },
-
-    onReachBottom() {
-      if (this.currIndex === 0) {
-        this.$refs.list.getList()
-      }
     }
   }
 </script>
diff --git a/src/apps/AppAskForm/components/AddList.vue b/src/apps/AppAskForm/components/AddList.vue
index a2f43815..6530b547 100644
--- a/src/apps/AppAskForm/components/AddList.vue
+++ b/src/apps/AppAskForm/components/AddList.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="form">
+  <div class="template-wrapper">
     <div class="form-list">
       <div
         class="form-list__item"
@@ -19,6 +19,41 @@
           <h2>{{ item.title }}</h2>
           <u-icon name="arrow-right" color="#E1E2E3" />
         </div>
+        <div class="template-item" v-for="(item, index) in list" :key="index" hover-class="bg-hover" @click="quote(item.id)">
+          <image :src="`${$cdn}askform/6.png`" />
+          <h2>{{ item.title }}</h2>
+          <u-icon name="arrow-right" color="#E1E2E3" />
+        </div>
+        <div class="template-item" v-for="(item, index) in list" :key="index" hover-class="bg-hover" @click="quote(item.id)">
+          <image :src="`${$cdn}askform/6.png`" />
+          <h2>{{ item.title }}</h2>
+          <u-icon name="arrow-right" color="#E1E2E3" />
+        </div>
+        <div class="template-item" v-for="(item, index) in list" :key="index" hover-class="bg-hover" @click="quote(item.id)">
+          <image :src="`${$cdn}askform/6.png`" />
+          <h2>{{ item.title }}</h2>
+          <u-icon name="arrow-right" color="#E1E2E3" />
+        </div>
+        <div class="template-item" v-for="(item, index) in list" :key="index" hover-class="bg-hover" @click="quote(item.id)">
+          <image :src="`${$cdn}askform/6.png`" />
+          <h2>{{ item.title }}</h2>
+          <u-icon name="arrow-right" color="#E1E2E3" />
+        </div>
+        <div class="template-item" v-for="(item, index) in list" :key="index" hover-class="bg-hover" @click="quote(item.id)">
+          <image :src="`${$cdn}askform/6.png`" />
+          <h2>{{ item.title }}</h2>
+          <u-icon name="arrow-right" color="#E1E2E3" />
+        </div>
+        <div class="template-item" v-for="(item, index) in list" :key="index" hover-class="bg-hover" @click="quote(item.id)">
+          <image :src="`${$cdn}askform/6.png`" />
+          <h2>{{ item.title }}</h2>
+          <u-icon name="arrow-right" color="#E1E2E3" />
+        </div>
+        <div class="template-item" v-for="(item, index) in list" :key="index" hover-class="bg-hover" @click="quote(item.id)">
+          <image :src="`${$cdn}askform/6.png`" />
+          <h2>{{ item.title }}</h2>
+          <u-icon name="arrow-right" color="#E1E2E3" />
+        </div>
       </div>
     </div>
   </div>
@@ -88,101 +123,105 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  .template {
-    margin: 32px 32px 0;
-    background: #fff;
-    border-radius: 8px;
-    overflow: hidden;
+  .template-wrapper {
+    padding-bottom: 120rpx;
 
-    & > h2 {
-      height: 88px;
-      line-height: 88px;
-      padding: 0 24px;
-      color: #333333;
-      font-size: 30px;
-    }
-
-    .template-item {
-      display: flex;
-      align-items: center;
-      height: 104px;
-      padding: 0 24px;
-      border-bottom: 1px solid #D8DDE6;
-
-      &:active {
-        background-color: #eee;
-      }
-
-      &:last-child {
-        border: none;
-      }
-
-      image {
-        width: 36px;
-        height: 42px;
-      }
-
-      i {
-        font-size: 30px;
-        color: #E1E2E3;
-      }
-
-      h2 {
-        flex: 1;
-        padding: 0 18px;
-        color: #333333;
-        font-size: 28px;
-        font-weight: normal;
-        overflow: hidden;
-        text-overflow:ellipsis;
-        white-space: nowrap;
-      }
-    }
-  }
-
-  .form-list {
-    display: flex;
-    flex-wrap: wrap;
-    padding: 0 32px 0;
-
-    div {
-      box-sizing: border-box;
-    }
-
-    .form-list__item {
-      width: calc(50% - 13px);
-      height: 216px;
-      margin: 32px 24px 0 0;
-      padding: 40px 20px 52px;
-      background-color: #FFFFFF;
+    .template {
+      margin: 32px 32px 0;
+      background: #fff;
       border-radius: 8px;
-      background-size: 100% 100%;
+      overflow: hidden;
 
-      &:active {
-        background-color: #eee;
+      & > h2 {
+        height: 88px;
+        line-height: 88px;
+        padding: 0 24px;
+        color: #333333;
+        font-size: 30px;
       }
 
-      &:nth-of-type(2n) {
-        margin-right: 0;
+      .template-item {
+        display: flex;
+        align-items: center;
+        height: 104px;
+        padding: 0 24px;
+        border-bottom: 1px solid #D8DDE6;
+
+        &:active {
+          background-color: #eee;
+        }
+
+        &:last-child {
+          border: none;
+        }
+
+        image {
+          width: 36px;
+          height: 42px;
+        }
+
+        i {
+          font-size: 30px;
+          color: #E1E2E3;
+        }
+
+        h2 {
+          flex: 1;
+          padding: 0 18px;
+          color: #333333;
+          font-size: 28px;
+          font-weight: normal;
+          overflow: hidden;
+          text-overflow:ellipsis;
+          white-space: nowrap;
+        }
       }
+    }
+
+    .form-list {
+      display: flex;
+      flex-wrap: wrap;
+      padding: 0 32px 0;
 
       div {
-        width: 148px;
-        height: 48px;
-        line-height: 48px;
-        text-align: center;
-        color: #fff;
-        font-size: 28px;
-        background: #6BA1F9;
-        border-radius: 24px;
+        box-sizing: border-box;
       }
 
-      h2 {
-        margin-bottom: 32px;
-        padding-left: 10px;
-        color: #333333;
-        font-weight: 700;
-        font-size: 32px;
+      .form-list__item {
+        width: calc(50% - 13px);
+        height: 216px;
+        margin: 32px 24px 0 0;
+        padding: 40px 20px 52px;
+        background-color: #FFFFFF;
+        border-radius: 8px;
+        background-size: 100% 100%;
+
+        &:active {
+          background-color: #eee;
+        }
+
+        &:nth-of-type(2n) {
+          margin-right: 0;
+        }
+
+        div {
+          width: 148px;
+          height: 48px;
+          line-height: 48px;
+          text-align: center;
+          color: #fff;
+          font-size: 28px;
+          background: #6BA1F9;
+          border-radius: 24px;
+        }
+
+        h2 {
+          margin-bottom: 32px;
+          padding-left: 10px;
+          color: #333333;
+          font-weight: 700;
+          font-size: 32px;
+        }
       }
     }
   }
diff --git a/src/apps/AppAskForm/components/List.vue b/src/apps/AppAskForm/components/List.vue
index 54022952..00dbc564 100644
--- a/src/apps/AppAskForm/components/List.vue
+++ b/src/apps/AppAskForm/components/List.vue
@@ -4,7 +4,7 @@
       <u-search placeholder="请输入标题" :show-action="false" search-icon-color="#ccc" v-model="search.title"
                 @search="isMore = false, search.current = 1, getList()"/>
     </ai-top-fixed>
-    <div class="form-list">
+    <scroll-view show-scrollbar scroll-y @scrolltolower="getList" class="form-list">
       <div class="form-item" v-for="(item, index) in list" :key="index"
            @click="showPopup(item)">
         <div class="form-item__top">
@@ -27,8 +27,9 @@
           <span>{{ $dict.getLabel('questionnaireStatus', item.status) }}</span>
         </div>
       </div>
+      <div style="height: 30rpx"></div>
       <ai-empty v-if="!list.length && isMore"></ai-empty>
-    </div>
+    </scroll-view>
     <u-popup v-model="isShow" :closeable="false" mode="bottom" :z-index="11">
       <div class="popup">
         <h2>{{ info.title }}</h2>
@@ -269,7 +270,6 @@ export default {
 
     getList() {
       if (this.isMore) return
-
       this.$http.post(`/app/appquestionnairetemplate/list`, null, {
         params: {
           ...this.search,
@@ -305,6 +305,8 @@ export default {
 
 <style lang="scss" scoped>
 .form {
+  height: 100vh;
+  overflow: hidden;
   ::v-deep .u-search {
     margin-bottom: 0 !important;
 
@@ -313,6 +315,12 @@ export default {
     }
   }
 
+  .form-list {
+    height: calc(100vh - 98rpx - 100rpx);
+    background: #f5f5f5;
+    overflow: hidden;
+  }
+
   .popup {
     background: #F7F7F7;
 
diff --git a/src/apps/AppAskForm/components/Tabbar.vue b/src/apps/AppAskForm/components/Tabbar.vue
index 97a89c50..00298386 100644
--- a/src/apps/AppAskForm/components/Tabbar.vue
+++ b/src/apps/AppAskForm/components/Tabbar.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="form">
+  <div class="form-wrapper">
     <div class="form-content">
       <add-list ref="addList" v-if="currIndex === 1" @change="onChange"></add-list>
       <list ref="list" v-if="currIndex === 0" @change="onChange"></list>
@@ -43,16 +43,6 @@ export default {
     }
   },
 
-  onLoad() {
-    uni.$on('reload', () => {
-      if (this.currIndex === 0) {
-        this.$refs.list.reload()
-      } else {
-        this.$refs.addList.getList()
-      }
-    })
-  },
-
   methods: {
     onChange(e) {
       this.$emit('change', e)
@@ -61,14 +51,13 @@ export default {
 
   onReachBottom() {
     if (this.currIndex === 0) {
-      this.$refs.list.getList()
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.form {
-  padding-bottom: 98px;
+.form-wrapper {
+  // padding-bottom: 98px;
 }
 </style>
diff --git a/src/components/AiTopFixed.vue b/src/components/AiTopFixed.vue
index 8ed77601..5c801794 100644
--- a/src/components/AiTopFixed.vue
+++ b/src/components/AiTopFixed.vue
@@ -39,7 +39,10 @@ export default {
   }
 
   .fixed {
+    display: flex;
+    align-items: center;
     width: 100%;
+    height: 100rpx;
     top: 0;
     position: fixed;
     z-index: 9;
@@ -51,7 +54,11 @@ export default {
   }
 
   .content {
-    padding: 20px 32px;
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 100rpx;
+    padding: 0 32px;
     box-sizing: border-box;
   }