浏览代码

feat: chain set

王亚超 1 年之前
父节点
当前提交
8ded3d46b0

+ 4 - 2
server/api/common/models/User.php

@@ -9,6 +9,7 @@
 namespace api\common\models;
 
 
+use api\modules\v1\models\Category;
 use api\modules\v1\models\Circle;
 use api\modules\v1\models\Clock;
 use api\modules\v1\models\ClockLike;
@@ -39,7 +40,9 @@ class User extends \common\modules\user\models\User
             'profile',
             'count',
             'type',
-            'chain',
+            'chain'=> function ($model) {
+                return Category::find()->where(['id' => $model->chain])->one();
+            },
         ];
     }
 
@@ -112,5 +115,4 @@ class User extends \common\modules\user\models\User
     {
         return $this->hasOne(Profile::className(), ['user_id' => 'id']);
     }
-
 }

+ 1 - 0
server/api/config/main.php

@@ -57,6 +57,7 @@ return [
                     'controller' => 'v1/user',
                     'extraPatterns' => [
                         'GET refresh' => 'refresh',
+                        'POST set-chain' => 'set-chain',
                     ],
                 ],
                 [

+ 4 - 0
uniapp/api/app.js

@@ -106,3 +106,7 @@ export function policyCategory (params) {
 export function policyList (params) {
 	return request.get('policy', {params})
 }
+
+export function setChain(data) {
+	return request.post('/user/set-chain', data)
+}

+ 21 - 1
uniapp/components/cate-two/cate-two.vue

@@ -146,17 +146,37 @@
 				} = await getCategoryTree({})
 				if (code == 1) {
 					this.cateList = data
+					this.cateList.forEach((item, index) => {
+						if (item.id == this.userInfo.chain.pid) {
+							this.selectIndex = index;
+						}
+					});
 					this.cateTwoList = data[this.selectIndex].children
+					this.cateTwoList.forEach((item, index) => {
+						if (item.id == this.userInfo.chain.id) {
+							this.selectTowIndex = index;
+						}
+					});
 					this.cateThreeSet()
 				}
 			},
 			changeActive(index) {
+				this.$toast({
+					title: '您无法查看企业所属产业分类之外的图谱信息',
+					duration: 3000
+				})
+				return false;
 				this.selectIndex = index
 				this.selectTowIndex = 0 //二级分类索引重置0
 				this.cateTwoList = this.cateList[this.selectIndex].children
 				this.cateThreeSet()
 			},
 			changeTwoActive(index) {
+				this.$toast({
+					title: '您无法查看企业所属产业分类之外的图谱信息',
+					duration: 3000
+				})
+				return false;
 				this.selectTowIndex = index
 				this.cateThreeSet()
 			},
@@ -223,7 +243,7 @@
 			}
 		},
 		computed: {
-			...mapGetters(['appConfig', 'sysInfo']),
+			...mapGetters(['appConfig', 'sysInfo', 'userInfo']),
 		}
 	}
 </script>

+ 374 - 0
uniapp/pages/index/components/chain.vue

@@ -0,0 +1,374 @@
+<template>
+	<u-popup v-model="show" mode="bottom" :mask-close-able="false" border-radius="14" safe-area-inset-bottom
+		:duration="100">
+		<view class="content-wrapper">
+			<!-- 头部 -->
+			<u-sticky>
+				<view class="sticky">
+					<view class="sticky-title xl normal bold">请设置企业产业分类</view>
+				</view>
+
+			</u-sticky>
+
+			<!-- 内容 -->
+			<view class="cate-two flex col-top">
+
+				<!-- 左侧 -->
+				<view class="aside bg-white">
+					<scroll-view style="height: 100%" scroll-y="true" scroll-with-animation="true">
+						<block v-for="(item, index) in cateList" :key="index">
+							<view class="first-cate"></view>
+							<view :class="'one-item xs ' + (index == selectIndex ? 'active' : 'muted')"
+								@click="changeActive(index)">
+								<view v-if="index == selectIndex" class="active-line bg-primary "></view>
+								<text class="name xs flex-1">{{ item.title }}</text>
+								<u-icon :name="(index == selectIndex ? 'arrow-right' : 'arrow-right')"
+									size="28"></u-icon>
+							</view>
+							<!-- 二级分类 -->
+							<!-- <view class="muted xs" v-for="(twoItem, twoIndex) in cateTwoList" :key="twoIndex"
+								v-if="index == selectIndex">
+								<view :class="'one-item xs ' + (twoIndex == selectTowIndex ? 'active' : '')"
+									@click.stop="changeTwoActive(twoIndex)">
+									<text class="name xs flex-1">{{ twoItem.title }}</text>
+								</view>
+							</view> -->
+						</block>
+					</scroll-view>
+				</view>
+				<!-- 右侧 -->
+				<view class="main">
+					<view class="main-wrap">
+						<view class="cate-two">
+							<view class="two-item bg-white m-b-20">
+								<view class="three-list flex flex-wrap" style="padding: 20rpx;">
+									<view class="text-center w-full p-6" v-for="(sitem, sindex) in cateTwoList"
+										:key="sindex" @tap="changeThreeActive(sitem)">
+										<view class="three-item flex row-between"
+											:class="{ 'three-active': cateThreeId == sitem.id }">
+											<view></view>
+											<view class="flex-1 xs">{{ sitem.title }}</view>
+											<view>
+												<u-icon name="checkmark" size="28" color="#F37171"
+													v-if="cateThreeId == sitem.id"></u-icon>
+											</view>
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+
+				</view>
+			</view>
+
+			<!-- <view class="confrim-btn">
+				<u-button @click="show = false;">确定</u-button>
+			</view> -->
+			<u-top-tips ref="uTips"></u-top-tips>
+			<view class="footer">
+				<button class="white btn lg" @click="handleConsult">确定</button>
+				<u-alert-tips class="m-t-30" type="error" title="产业分类一经确认,不可更改,并且只展示企业所属分类的图谱信息,请仔细确认" :description="description"></u-alert-tips>
+			</view>
+		</view>
+	</u-popup>
+</template>
+
+<script>
+	import {
+		getCategoryTree,
+		setChain,
+	} from '@/api/app';
+	export default {
+		name: "chain",
+		props: {
+			value: {
+				type: Boolean
+			},
+		},
+		data() {
+			return {
+				keyword: '',
+				hideRight: true,
+				menuCurrentIndex: 0,
+				topicData: [],
+
+				cateList: [],
+				selectIndex: 0, //一级分类索引
+				selectTowIndex: 0, //二级分类索引
+				selectThreeIndex: null, //二级分类索引
+				cateTwoList: [], //二级分类列表
+				cateThreeList: [], //三级分类列表
+				cateThreeId: 0,
+				chain: null
+			}
+		},
+		created() {
+			this.getListFun()
+		},
+		computed: {
+			// 弹窗Popup显示状态
+			show: {
+				get: function() {
+					return this.value
+				},
+				set: function(value) {
+					this.$emit('input', value)
+				}
+			}
+		},
+		methods: {
+			// 获取
+			async getListFun() {
+				const {
+					code,
+					data
+				} = await getCategoryTree({})
+				if (code == 1) {
+					this.cateList = data
+					this.cateTwoList = data[this.selectIndex].children
+					this.cateThreeSet()
+				}
+			},
+			changeActive(index) {
+				this.selectIndex = index
+				this.selectTowIndex = 0 //二级分类索引重置0
+				this.cateTwoList = this.cateList[this.selectIndex].children
+				this.cateThreeSet()
+			},
+			changeTwoActive(index) {
+				this.selectTowIndex = index
+				this.cateThreeSet()
+			},
+			changeThreeActive(item) {
+				this.cateThreeId = item.id
+				this.chain = item;
+			},
+			handleConsult() {
+				if (this.cateThreeId == 0) {
+					// this.$toast({
+					// 	title: '请选择产业分类',
+					// 	type: 'error',
+					// })
+					this.$refs.uTips.show({
+						title: '请选择产业分类',
+						type: 'error',
+					})
+				} else {
+					setChain({chain: this.cateThreeId}).then(res => {
+						this.$emit('change', this.chain)
+						this.$emit('input', false)
+					})
+				}
+			},
+			cateThreeSet() {
+				let children = this.cateTwoList[this.selectTowIndex].children
+				this.cateThreeList = children.filter((item, index) => item.type == 1)
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.bb {
+		border-bottom: 1px solid $-color-body;
+	}
+
+	.content-wrapper {
+		height: 900rpx;
+
+		.sticky {
+			width: 100vw;
+		}
+
+		.sticky-title {
+			padding: 24rpx 0;
+			text-align: center;
+		}
+
+		.container {
+			height: 712rpx;
+			display: flex;
+
+			// 左侧菜单
+			.left-menu {
+				width: 250rpx;
+
+				.submenu {
+					height: 90rpx;
+					line-height: 90rpx;
+					text-align: center;
+					font-size: 26rpx;
+				}
+
+				// 菜单选中
+				.active {
+					font-weight: 500;
+					color: $-color-primary;
+					position: relative;
+					background-color: rgba($-color-primary, 0.1);
+				}
+
+				.active::before {
+					content: '';
+					width: 6rpx;
+					height: 30rpx;
+					position: absolute;
+					left: 10rpx;
+					top: 50%;
+					transform: translateY(-50%);
+					background-color: $-color-primary;
+				}
+			}
+
+			// 右侧内容
+			.right-content {
+				width: 100%;
+
+				.tags {
+					padding: 20rpx;
+
+					.tags-item {
+						margin-bottom: 30rpx;
+					}
+
+					image {
+						width: 120rpx;
+						height: 120rpx;
+						border-radius: 50%;
+						position: relative;
+					}
+
+					image::after {
+						content: '';
+						color: #FFFFFF;
+						font-size: 50rpx;
+						font-weight: 500;
+						text-align: center;
+						line-height: 120rpx;
+						width: 120rpx;
+						height: 120rpx;
+						position: absolute;
+						border-radius: 50%;
+						left: 0;
+						top: 0;
+						background: rgba(0, 0, 0, 0.1) url('/bundle_b/static/icon_tags.png') no-repeat center center;
+						background-size: 40rpx;
+					}
+				}
+			}
+		}
+	}
+
+	.cate-two {
+		.aside {
+			width: 250rpx;
+			flex: none;
+			height: 100%;
+
+			.first-cate {
+				margin: 0 20rpx 0rpx 40rpx;
+				border-top: $-solid-border;
+			}
+
+			.first-cate:first-child {
+				border: none;
+			}
+
+			.one-item {
+				position: relative;
+				text-align: center;
+				padding: 26rpx 10rpx;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+
+				&.active {
+					color: $-color-primary;
+					font-size: 26rpx;
+					font-weight: bold;
+				}
+
+				.active-line {
+					position: absolute;
+					width: 6rpx;
+					height: 30rpx;
+					left: 4rpx;
+					top: 50%;
+					transform: translateY(-50%);
+				}
+			}
+		}
+
+		.main {
+			height: 100%;
+			flex: 1;
+			width: 500rpx;
+			padding-left: 16rpx;
+
+			/deep/ .u-tabs {
+				border-radius: 0 0 12rpx 12rpx;
+				box-shadow: 0px 4px 8px 1px rgba(0, 0, 0, 0.03)
+			}
+
+			.main-wrap {
+				position: relative;
+
+				.two-item {
+					border-radius: 10rpx;
+
+					.title {
+						height: 90rpx;
+						padding: 0 20rpx;
+
+						.line {
+							width: 40rpx;
+							height: 1px;
+							background-color: #BBBBBB;
+						}
+					}
+				}
+
+				.three-list {
+					align-items: flex-start;
+					padding: 0 10rpx;
+
+					.three-item {
+						background: #F7F8FA;
+						padding: 16rpx 50rpx;
+						text-align: center;
+						border-radius: 12rpx;
+					}
+
+					.three-item.three-active {
+						border: 2rpx solid #F37171;
+						font-weight: bold;
+						color: #F37171;
+					}
+
+				}
+			}
+
+			.goods .item {
+				border-radius: 14rpx;
+			}
+		}
+	}
+
+	.footer {
+		left: 0%;
+		bottom: 50rpx;
+		width: 100%;
+		padding: 0 24rpx;
+		position: fixed;
+		z-index: 99;
+
+		.btn {
+			height: 84rpx;
+			line-height: 84rpx;
+			background-color: $-color-primary;
+			box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(243, 113, 113, 0.39);
+			border-radius: 18rpx 18rpx 18rpx 18rpx;
+		}
+	}
+</style>

+ 20 - 4
uniapp/pages/index/index.vue

@@ -13,7 +13,7 @@
                 :show-action="false"></u-search>
         </router-link>
         <!-- 分类树 -->
-        <view class="content bg-body" v-if="userInfo.nickname">
+        <view class="content bg-body" v-if="userInfo.nickname && userInfo.chain">
             <cate-two></cate-two>
         </view>
         <view v-else>
@@ -32,6 +32,8 @@
             <image src="/static/images/icon_feedback.png" style="width: 100%; height: 100%;"></image>
         </router-link>
 
+		<!-- 组件 产业链 -->
+		<chain v-model="showChainPopup" @change="handleChain"></chain>
 
         <u-tabbar :list="tabarList"></u-tabbar>
 
@@ -48,15 +50,20 @@
     import {
         pxToRpx
     } from '@/utils/tools'
+	import Chain from "./components/chain.vue"
     const app = getApp()
     const homeItem = {
         name: '首页'
     }
     export default {
+		components: {
+			Chain
+		},
         data() {
             return {
                 keyword: '',
-                top: 172
+                top: 172,
+				showChainPopup: false
             }
         },
         onLoad() {
@@ -67,7 +74,11 @@
         },
         onShow() {
             // this.getHomeFun();
-            this.getUser();
+           this.getUser().then(() => {
+			   if (this.userInfo.nickname && !this.userInfo.chain) {
+				   this.showChainPopup = true
+			   }
+           })
         },
         onHide() {},
         onPullDownRefresh() {
@@ -99,7 +110,12 @@
                 uni.navigateTo({
                     url: '/pages/talents/talents?keyword=' + this.keyword
                 })
-            }
+            },
+			handleChain(chain) {
+				this.getUser().then(() => {
+				    uni.stopPullDownRefresh();
+				})
+			},
         },
         computed: {
             ...mapGetters(['userInfo', 'appConfig', 'tabarList']),