131 lines
2.6 KiB
Vue
131 lines
2.6 KiB
Vue
<template>
|
|
<view>
|
|
<view class='bk_box'>
|
|
<view class='bkspan'>
|
|
<block v-for="(item, index) in CategoryList" :key="index">
|
|
<view @click="ChoosePlate(item)" :id="item.story_category_id" :name="item.story_category_name">
|
|
<view :class="'bkspan_span ' + (item.story_category_id==storyCategoryId?'borred':'')">
|
|
{{item.story_category_name}}
|
|
</view>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
<view @click="AddPlate" class="zhuige-base-button">
|
|
<view>{{__('确定')}}</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
mapMutations,
|
|
mapState
|
|
} from 'vuex'
|
|
export default {
|
|
data: function() {
|
|
return {
|
|
CategoryList: [],
|
|
storyCategoryId: 0,
|
|
storyCategory: {},
|
|
}
|
|
},
|
|
computed: mapState(['Config', 'StateCode', 'notice', 'plantformInfo', 'shopInfo', 'userInfo', 'hasLogin']),
|
|
onLoad: function(options) {
|
|
var that = this;
|
|
|
|
uni.setNavigationBarTitle({
|
|
title: this.__('板块')
|
|
});
|
|
if (options.storyCategoryId) {
|
|
this.setData({
|
|
storyCategoryId: options.storyCategoryId
|
|
})
|
|
}
|
|
that.GetCategoryList()
|
|
},
|
|
methods: {
|
|
/* 版块 */
|
|
GetCategoryList: function() {
|
|
var that = this,
|
|
params = {};
|
|
|
|
that.$.request({
|
|
url: that.Config.URL.sns.category_lists,
|
|
data: params,
|
|
success: function(data, status, msg, code) {
|
|
if (200 == status && data.items.length > 0) {
|
|
that.CategoryList = data.items
|
|
} else {}
|
|
}
|
|
});
|
|
},
|
|
ChoosePlate: function(item) {
|
|
console.log(item)
|
|
this.setData({
|
|
storyCategory: item,
|
|
storyCategoryId: item.story_category_id
|
|
})
|
|
console.log(this.storyCategoryId)
|
|
},
|
|
AddPlate: function() {
|
|
var that = this;
|
|
that.$.backpage(1, function() {
|
|
var data = {
|
|
storyCategory: that.storyCategory
|
|
};
|
|
that.notice.postNotificationName("RefreshPlate", data)
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.bk_box {
|
|
background-color: #fff;
|
|
padding: 30rpx;
|
|
}
|
|
|
|
.bkspan_span {
|
|
border: 1rpx solid #b6b6b6;
|
|
color: #878787;
|
|
font-size: 28rpx;
|
|
margin: 8rpx 7rpx;
|
|
border-radius: 35rpx;
|
|
text-align: center;
|
|
padding: 5rpx 20rpx;
|
|
display: inline-block;
|
|
}
|
|
|
|
.bkspan {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.zhuige-base-button {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
padding: 40rpx 0;
|
|
z-index: 3;
|
|
}
|
|
|
|
.zhuige-base-button view {
|
|
width: 360rpx;
|
|
text-align: center;
|
|
height: 96rpx;
|
|
line-height: 96rpx;
|
|
border-radius: 96rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
background: #db384c;
|
|
}
|
|
|
|
.borred {
|
|
border: 1rpx solid #db384c;
|
|
color: #db384c;
|
|
}
|
|
</style> |