添加帮助中心页岩

src/router/routes-common.ts

@@ -48,6 +48,14 @@ export const router: RouteRecordRaw[] = [
     ]
   },
   {
+    path: '/information-list',
+    name: 'information-list',
+    component: () => import('@/views/information'),
+    meta: {
+      title: '资讯列表'
+    }
+  },
+  {
     path: '/information-detail',
     name: 'information-detail',
     component: () => import('@/views/information/information-detail'),
@@ -70,6 +78,14 @@ export const router: RouteRecordRaw[] = [
     meta: {
       title: '帮助中心'
     }
+  },
+  {
+    path: '/help-detail',
+    name: 'help-detail',
+    component: () => import('@/views/information/help-center/detail'),
+    meta: {
+      title: '帮助中心详情'
+    }
   }
 ]
 

src/views/information/help-center/detail.tsx

@@ -0,0 +1,39 @@
+import request from '@/helpers/request'
+import { state } from '@/state'
+import { defineComponent, onMounted, ref } from 'vue'
+import { useRoute } from 'vue-router'
+import styles from '../information-detail.module.less'
+
+export default defineComponent({
+  name: 'notice-detail',
+  setup() {
+    const route = useRoute()
+    const detail = ref<any>({})
+
+    const getDetails = async () => {
+      try {
+        const { data } = await request.get(
+          state.platformApi + '/helpCenterContent/detail/' + route.query.id
+        )
+        detail.value = data
+      } catch {
+        //
+      }
+    }
+
+    onMounted(() => {
+      getDetails()
+    })
+    return () => (
+      <div class={styles.detail}>
+        <div class={styles.title}>{detail.value.title}</div>
+        <div class={styles.who}>
+          <span>管乐团</span>
+          {detail.value.createTime}
+        </div>
+
+        <div class={styles.content} v-html={detail.value.content}></div>
+      </div>
+    )
+  }
+})

src/views/information/help-center/index.module.less

@@ -1,5 +1,15 @@
-.title {
-  font-size: 16px;
-  color: #333333;
-  line-height: 22px;
+.helpCenter {
+  .title {
+    font-size: 16px;
+    color: #333333;
+    line-height: 22px;
+  }
+  .container {
+    margin-top: 12px;
+    :global {
+      .van-cell {
+        padding: 18px 13px;
+      }
+    }
+  }
 }

src/views/information/help-center/index.tsx

@@ -6,11 +6,13 @@ import { forms } from '@/school/train-planning/create'
 import { state } from '@/state'
 import { Cell, CellGroup, List } from 'vant'
 import { defineComponent, onMounted, reactive } from 'vue'
+import { useRouter } from 'vue-router'
 import styles from './index.module.less'
 
 export default defineComponent({
   name: 'help-center',
   setup() {
+    const router = useRouter()
     const form = reactive({
       isClick: false,
       list: [] as any,
@@ -69,7 +71,7 @@ export default defineComponent({
       getList()
     })
     return () => (
-      <>
+      <div class={styles.helpCenter}>
         <OSticky position="top">
           <OSearch onSearch={onSearch} />
         </OSticky>
@@ -79,18 +81,30 @@ export default defineComponent({
             v-model:loading={form.listState.loading}
             finished={form.listState.finished}
             finishedText=" "
-            class={[styles.liveList]}
+            class={styles.container}
             onLoad={getList}
             immediateCheck={false}
           >
             {form.list.map((item: any) => (
-              <Cell titleClass={[styles.title, 'van-ellipsis']} title={'ijijii'} isLink></Cell>
+              <Cell
+                titleClass={[styles.title, 'van-ellipsis']}
+                title={item.title}
+                isLink
+                onClick={() => {
+                  router.push({
+                    path: 'help-detail',
+                    query: {
+                      id: item.id
+                    }
+                  })
+                }}
+              ></Cell>
             ))}
           </List>
         ) : (
           <OEmpty btnStatus={false} classImgSize="SMALL" tips="暂无数据" />
         )}
-      </>
+      </div>
     )
   }
 })

src/views/information/index.tsx

@@ -0,0 +1,116 @@
+import OEmpty from '@/components/o-empty'
+import OSearch from '@/components/o-search'
+import OSticky from '@/components/o-sticky'
+import request from '@/helpers/request'
+import { forms } from '@/school/train-planning/create'
+import { state } from '@/state'
+import { Cell, CellGroup, List } from 'vant'
+import { defineComponent, onMounted, reactive } from 'vue'
+import { useRouter } from 'vue-router'
+import styles from './help-center/index.module.less'
+
+export default defineComponent({
+  name: 'help-center',
+  setup() {
+    const router = useRouter()
+    const form = reactive({
+      isClick: false,
+      list: [] as any,
+      listState: {
+        dataShow: true, // 判断是否有数据
+        loading: false,
+        finished: false
+      },
+      params: {
+        keyword: null,
+        status: true,
+        page: 1,
+        rows: 20
+      }
+    })
+
+    const getList = async () => {
+      try {
+        if (form.isClick) return
+        form.isClick = true
+        const res = await request.post(state.platformApi + '/sysNewsInformation/page', {
+          data: {
+            ...form.params,
+            catalogType: state.platformType
+          }
+        })
+        form.listState.loading = false
+        const result = res.data || {}
+        // 处理重复请求数据
+        if (form.list.length > 0 && result.current === 1) {
+          return
+        }
+        form.list = form.list.concat(result.rows || [])
+        form.listState.finished = result.current >= result.pages
+        form.params.page = result.current + 1
+        form.listState.dataShow = form.list.length > 0
+        form.isClick = false
+      } catch {
+        form.listState.dataShow = false
+        form.listState.finished = true
+        form.isClick = false
+      }
+    }
+
+    const onSearch = (val: any) => {
+      form.params.keyword = val
+      form.params.page = 1
+      form.list = []
+      form.listState.dataShow = true // 判断是否有数据
+      form.listState.loading = false
+      form.listState.finished = false
+      getList()
+    }
+
+    const onDetail = (item: any) => {
+      if (item.linkType === 'OUT') {
+        window.location.href = item.linkUrl
+      } else {
+        router.push({
+          path: '/information-detail',
+          query: {
+            id: item.id
+          }
+        })
+      }
+    }
+
+    onMounted(() => {
+      getList()
+    })
+    return () => (
+      <div class={styles.helpCenter}>
+        <OSticky position="top">
+          <OSearch onSearch={onSearch} />
+        </OSticky>
+
+        {form.listState.dataShow ? (
+          <List
+            v-model:loading={form.listState.loading}
+            finished={form.listState.finished}
+            finishedText=" "
+            class={styles.container}
+            onLoad={getList}
+            immediateCheck={false}
+          >
+            {form.list.map((item: any) => (
+              <Cell
+                titleClass={[styles.title, 'van-ellipsis']}
+                title={item.title}
+                isLink
+                onClick={() => onDetail(item)}
+              ></Cell>
+            ))}
+          </List>
+        ) : (
+          <OEmpty btnStatus={false} classImgSize="SMALL" tips="暂无数据" />
+        )}
+      </div>
+    )
+  }
+})

src/views/information/information-detail.module.less

@@ -33,5 +33,9 @@
       border-radius: 6px;
       overflow: hidden;
     }
+
+    video {
+      width: 100%;
+    }
   }
 }