|
@@ -5,18 +5,24 @@
|
|
|
<view class="addClass" @tap="addClass">
|
|
|
<image src="../../static/images/addicon.png" class="addicon"></image>
|
|
|
</view>
|
|
|
- <view style="height:94upx"></view>
|
|
|
+ <view style="height: 94upx;"></view>
|
|
|
<view class="content">
|
|
|
- <view class="item-warp">
|
|
|
+ <view class="item-warp" v-for="item in lineList" :key="item.id">
|
|
|
<view class="warp-top">
|
|
|
- <view class="bar">分组名称:<text class="name">西线推荐</text></view>
|
|
|
- <view class="bar">分组名称:<text class="name">西线推荐</text></view>
|
|
|
- <view class="bar">分组名称:<text class="name">西线推荐</text></view>
|
|
|
- <view class="bar">分组名称:<text class="name">西线推荐</text></view>
|
|
|
+ <view class="bar"
|
|
|
+ >分组名称:<text class="name">{{ item.name }}</text></view
|
|
|
+ >
|
|
|
+ <view class="bar"
|
|
|
+ >分组标识:<text class="name">{{ item.code }}</text></view
|
|
|
+ >
|
|
|
+ <view class="bar"
|
|
|
+ >一级分类:<text class="name">{{ item.typeId | grade }}</text></view
|
|
|
+ >
|
|
|
+ <view class="bar">所属店铺:<text class="name">西线推荐</text></view>
|
|
|
</view>
|
|
|
<view class="warp-bottom">
|
|
|
- <view class="btn edtil">编辑</view>
|
|
|
- <view class="btn delet">删除</view>
|
|
|
+ <view class="btn edtil" @tap="compile(item.id)">编辑</view>
|
|
|
+ <view class="btn delet" @tap="delet(item.id)">删除</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -24,6 +30,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+let gradeList;
|
|
|
import Header from '../components/header';
|
|
|
export default {
|
|
|
name: 'classify',
|
|
@@ -31,77 +38,128 @@ export default {
|
|
|
data() {
|
|
|
//这里存放数据
|
|
|
return {
|
|
|
- title: '管理自定义分类'
|
|
|
+ title: '管理自定义分类',
|
|
|
+ storeId: uni.getStorageSync('shopid'),
|
|
|
+ lineList: [],
|
|
|
};
|
|
|
},
|
|
|
-
|
|
|
+ filters: {
|
|
|
+ grade(val) {
|
|
|
+ console.log(val);
|
|
|
+ if (!val) {
|
|
|
+ return '无';
|
|
|
+ }
|
|
|
+ gradeList.forEach(element => {
|
|
|
+ if (val === element.id) {
|
|
|
+ console.log(val === element.id);
|
|
|
+ console.log(element.name);
|
|
|
+ val = element.name
|
|
|
+ return val
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.getCustomList();
|
|
|
+ this.getOneClassList();
|
|
|
+ },
|
|
|
//方法集合
|
|
|
methods: {
|
|
|
- addClass () {
|
|
|
+ addClass() {
|
|
|
console.log(1);
|
|
|
- }
|
|
|
+ },
|
|
|
+ // 自定义分类列表
|
|
|
+ async getCustomList() {
|
|
|
+ await this.$http
|
|
|
+ .get('/goods/getCustomGroupList', {
|
|
|
+ shopId: this.storeId,
|
|
|
+ })
|
|
|
+ .then(async (res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.lineList = res.data.customGroupList;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 一级分类
|
|
|
+ async getOneClassList() {
|
|
|
+ await this.$http.get('/type/getParentList', {}).then(async (res) => {
|
|
|
+ if (res.code === 200 && res.msg === 'OK') {
|
|
|
+ gradeList = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 处理分类
|
|
|
+
|
|
|
+
|
|
|
+ // 编辑
|
|
|
+ compile(id) {
|
|
|
+ console.log(id);
|
|
|
+ },
|
|
|
+ // 删除
|
|
|
+ delet(id) {
|
|
|
+ console.log(id);
|
|
|
+ },
|
|
|
},
|
|
|
-
|
|
|
};
|
|
|
</script>
|
|
|
<style lang='scss' scoped>
|
|
|
- .classify {
|
|
|
- .addClass{
|
|
|
- position: fixed;
|
|
|
- top: 24.5upx;
|
|
|
- right: 33upx;
|
|
|
+.classify {
|
|
|
+ .addClass {
|
|
|
+ position: fixed;
|
|
|
+ top: 24.5upx;
|
|
|
+ right: 33upx;
|
|
|
+ width: 48upx;
|
|
|
+ height: 48upx;
|
|
|
+ z-index: 100;
|
|
|
+ .addicon {
|
|
|
width: 48upx;
|
|
|
height: 48upx;
|
|
|
- z-index: 100;
|
|
|
- .addicon {
|
|
|
- width: 48upx;
|
|
|
- height: 48upx;
|
|
|
- }
|
|
|
}
|
|
|
- .content {
|
|
|
+ }
|
|
|
+ .content {
|
|
|
+ width: 100%;
|
|
|
+ padding: 24upx 32upx 0;
|
|
|
+ .item-warp {
|
|
|
width: 100%;
|
|
|
- padding: 24upx 32upx 0;
|
|
|
- .item-warp{
|
|
|
- width: 100%;
|
|
|
- padding: 28upx 31upx 0;
|
|
|
- border-radius: 10upx;
|
|
|
- background-color: #ffffff;
|
|
|
- .warp-top{
|
|
|
- padding-bottom: 30upx;
|
|
|
- border-bottom: 1px solid #e7e7e7;
|
|
|
- .bar{
|
|
|
- color: #7a7c7c;
|
|
|
- font-size: 28upx;
|
|
|
- margin-top: 10upx;
|
|
|
- &:first-child{
|
|
|
- margin-top: 0;
|
|
|
- }
|
|
|
- .name{
|
|
|
- color: #202020;
|
|
|
- margin-left: 5upx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .warp-bottom{
|
|
|
- display: flex;
|
|
|
- padding: 17upx 0;
|
|
|
- .btn{
|
|
|
- width: 158upx;
|
|
|
- height: 58upx;
|
|
|
- text-align: center;
|
|
|
- line-height: 58upx;
|
|
|
- border: 1px solid #e2e2e2;
|
|
|
- color: #7a7c7c;
|
|
|
- margin-left: 275upx;
|
|
|
+ padding: 28upx 31upx 0;
|
|
|
+ border-radius: 10upx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .warp-top {
|
|
|
+ padding-bottom: 30upx;
|
|
|
+ border-bottom: 1px solid #e7e7e7;
|
|
|
+ .bar {
|
|
|
+ color: #7a7c7c;
|
|
|
+ font-size: 28upx;
|
|
|
+ margin-top: 10upx;
|
|
|
+ &:first-child {
|
|
|
+ margin-top: 0;
|
|
|
}
|
|
|
- .delet {
|
|
|
- color: #ffffff;
|
|
|
- border: none;
|
|
|
- margin-left: 23upx;
|
|
|
- background-color: #ff6a5e;
|
|
|
+ .name {
|
|
|
+ color: #202020;
|
|
|
+ margin-left: 5upx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .warp-bottom {
|
|
|
+ display: flex;
|
|
|
+ padding: 17upx 0;
|
|
|
+ .btn {
|
|
|
+ width: 158upx;
|
|
|
+ height: 58upx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 58upx;
|
|
|
+ border: 1px solid #e2e2e2;
|
|
|
+ color: #7a7c7c;
|
|
|
+ margin-left: 275upx;
|
|
|
+ }
|
|
|
+ .delet {
|
|
|
+ color: #ffffff;
|
|
|
+ border: none;
|
|
|
+ margin-left: 23upx;
|
|
|
+ background-color: #ff6a5e;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|