From 9203a43facf5fd967aaafcfc41541a9f4565869a Mon Sep 17 00:00:00 2001 From: li-guang <153605324@qq.com> Date: Thu, 07 Jan 2021 11:29:28 +0800 Subject: [PATCH] Merge branch 'master' of https://gitee.com/jyyforjava/hive-app --- hive-app/pages/mine/knowledge.vue | 143 ++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 115 insertions(+), 28 deletions(-) diff --git a/hive-app/pages/mine/knowledge.vue b/hive-app/pages/mine/knowledge.vue index d4bc24a..f06e7a0 100644 --- a/hive-app/pages/mine/knowledge.vue +++ b/hive-app/pages/mine/knowledge.vue @@ -1,48 +1,135 @@ <template> - <!-- 知识库 --> - <view> - <scroll-view class="list-left" scroll-y> - <view v-for="(item,index) in list" @click="show(item)"> - {{item.primaryTitle}} - <view v-for="sub in item.subTitle" v-show="item.isShow"> - {{sub}} + <!-- 当前客户 --> + <view class="container"> + <view class="list"> + <scroll-view class="list-left" scroll-y="true"> + <view class="list-left-row" + v-for="item in typeList" + :class="item.id==typeId?'active':''" + @click="changeType(item.id)"> + <text>{{item.articleTypeName}}</text> </view> - </view> - </scroll-view> - <scroll-view class="list-right"></scroll-view> + </scroll-view> + <scroll-view class="list-right" scroll-y="true"> + <navigator :url="'./knowledgeDetail?id='+item.id" hover-class="none" v-for="item in list"> + <view class="list-right-row"> + <image class="product-img" :src="item.image?item.image:'../../static/images/no-img.png'"></image> + <view class="flex-1"> + <text class="font-13">{{item.title}}</text> + <view class="desc"> + <text>{{item.articleTypeName}}</text> + </view> + </view> + </view> + </navigator> + <no-record :isShow="!list.length"></no-record> + </scroll-view> + </view> </view> </template> <script> - export default{ + export default { data(){ return{ - primaryTitle:['院装产品','美容套餐','美容客装','美容试装'], - subTitle:['院装产品','院装产品','院装产品','院装产品'], - list:[ - { - primaryTitle:'院装产品', - subTitle:['院装产品','院装产品','院装产品','院装产品'], - isShow:false - }, - { - primaryTitle:'美容套餐', - subTitle:['美容套餐','美容套餐','美容套餐','美容套餐'], - isShow:false - } - ], + typeList: [], + list: [], + typeId: '' } }, + onLoad(options) { + this.loadTypeList() + }, methods:{ - show(item){ - item.isShow=!item.isShow + loadTypeList(){ + this.$httpUtils.request('/api/know/findKnowledgeType').then((res) => { + if(res.status == 200){ + let result = res.rows; + this.typeList = result; + if(result.length){ + this.typeId = result[0].id; + this.loadList() + } + } + }) + }, + loadList(){ + this.$httpUtils.request('/api/know/findArticleList', { + pageNum: 1, + pageSize: 100, + typeId: this.typeId + }, 'POST').then((res) => { + if(res.status == 200){ + this.list = res.rows; + } + }) + }, + changeType(id){ + this.typeId = id; + this.loadList() } } } </script> <style> + page{ + height: 100%; + } + .container{ + display: flex; + flex-direction: column; + height: 100%; + padding: 10px 0 0; + box-sizing: border-box; + } + .list{ + flex: 1; + display: flex; + overflow: hidden; + } .list-left{ - width: 100px; + width: 170rpx; + flex: 0 0 170rpx; + background: #F6F6F8; + border-radius: 4px; + } + .list-right{ + flex: 1; + } + .list-left-row{ + padding: 10px; + color: #8c9fad; + font-size: 13px; + } + .list-left-row.active{ + background: #FFFFFF; + color: #000000; + } + .list-right-row{ + display: flex; + padding: 10px; + margin: 0 10px 10px; + border: 1px solid #EDEAF4; + box-shadow:0 6px 6px rgba(237,234,244,0.5); + border-radius: 4px; + font-size: 12px; + } + .list-right-row .product-img{ + width: 62px; + height: 62px; + margin-right: 10px; + } + .desc{ + margin-top: 8px; + color: #a5abaf; + word-break: break-all; + text-overflow: -o-ellipsis-lastline; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; } </style> -- Gitblit v1.9.1