From 3f747107835f019270a688a15aad4fd843cb8853 Mon Sep 17 00:00:00 2001
From: 明梦爽 <2972214568@qq.com>
Date: 星期五, 19 十一月 2021 16:53:47 +0800
Subject: [PATCH] SSH

---
 src/components/page/introduce.vue |  156 ++++++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 133 insertions(+), 23 deletions(-)

diff --git a/src/components/page/introduce.vue b/src/components/page/introduce.vue
index 29aa131..65b8123 100644
--- a/src/components/page/introduce.vue
+++ b/src/components/page/introduce.vue
@@ -1,29 +1,139 @@
 <template>
-    <div>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-        <span>姒傚喌</span><br>
-    </div>
+  <div>
+    <el-row>
+      <globalTitle />
+    </el-row>
+    <el-row class="mart10">
+      <!-- 灏忔爣棰� -->
+      <el-col :span="4" class="marr10">
+        <ul>
+          <li
+            v-for="(item, index) in menuList"
+            :key="index"
+            class="liStylenone liPointer marb10"
+            @click="changeMenu(item)"
+          >
+            <b :class="cont == item.categoryName ? 'ft-blue' : 'ft-black'">{{
+              item.categoryName
+            }}</b>
+          </li>
+        </ul>
+      </el-col>
+       <!-- 鏂伴椈鍐呭 -->
+      <el-card class="box-card">
+        <el-col :span="18">
+          <div>
+            <el-row
+              class="marb10"
+              :key="index"
+              v-for="(item, index) in newsList"
+            >
+              {{ item.title }}
+            </el-row>
+          </div>
+          <!-- 鍒嗛〉 -->
+          <div>
+            <el-pagination
+              @current-change="handleCurrentChange"
+              :current-page.sync="currentPage"
+              :page-size="20"
+              layout="total, pager, next"
+              :total="total"
+            >
+            </el-pagination>
+          </div>
+        </el-col>
+      </el-card>
+    </el-row>
+  </div>
 </template>
-<script>
-export default {
-    name:'introduce'
-}
 
+<script>
+import globalTitle from '../globalTitle.vue'
+import { getMinTitle, getNewsList } from '../../api/api'
+export default {
+  name: 'introduce',
+  components: {
+    globalTitle
+  },
+  data() {
+    return {
+      cont: '',
+      menuList: [],
+      newsList: [],
+      total: 0,
+      currentPage: 1
+    }
+  },
+  created() {
+    this.getMinTitleList()
+  },
+  mounted() {},
+  watch: {
+    menuList(newval, oldval) {
+      this.getAllNewsList(this.menuList[0])
+      this.cont = this.menuList[0].categoryName
+    }
+  },
+  methods: {
+    handleCurrentChange(val) {
+      console.log(`褰撳墠椤�: ${val}`)
+    },
+    changeMenu(val) {
+      this.getAllNewsList(val)
+      this.cont = val.categoryName
+    },
+    getMinTitleList() {
+      const data = {
+        contypeId: this.$route.query.id,
+        p: 1
+      }
+      getMinTitle(data)
+        .then((res) => {
+          console.log('res', res)
+          if (res.code == 200) {
+            this.menuList = res.data.records
+          }
+        })
+        .catch((err) => {
+          console.log('err', err)
+        })
+    },
+    getAllNewsList(item) {
+      const data = {
+        categoryId: item.id,
+        contypeId: item.contypeId,
+        p: this.currentPage
+      }
+      getNewsList(data)
+        .then((res) => {
+          console.log('res', res)
+          if (res.code == 200) {
+            this.newsList = res.data.records
+            this.total = Number(res.data.total)
+          }
+        })
+        .catch((err) => {
+          console.log('err', err)
+        })
+    }
+  }
+}
 </script>
 <style lang="less" scoped>
-    
+ul {
+  width: 200px;
+  li {
+    background-color: rgb(242, 243, 245);
+    height: 50px;
+    line-height: 50px;
+    text-align: center;
+  }
+}
+.ft-blue {
+  color: rgb(9, 143, 252);
+}
+.ft-black {
+  color: #000;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.8.0