申请合作技师 添加合作项目类别

pages/my/hehuo.vue

@@ -45,6 +45,15 @@
 				<u-input type="number" v-model="age" maxlength="11" placeholder="请输入年龄" />
 				<view class="xian"></view>
 			</view>
+			<view class="item_view">
+				<view class="item_title">请选合作项目</view>
+				<view class="guke-list">
+					<view class="guke-btn huiBtn" :class="{ lanBtn: selected.includes(item) }"
+						@click="gukeBtn(item)" v-for="(item,index) in typeList" :key="index">
+						{{item.value}}
+					</view>
+				</view>
+			</view>
 			<view class="item_view">
 				<view class="item_title" style="margin-bottom: 10px;">上传身份证正面</view>
 				<view class="flex" style="overflow: hidden;flex-direction: initial;">
@@ -140,6 +149,7 @@
 	export default {
 		data() {
 			return {
+				selected:[],
 				pickVal: [0, 0, 0], // 选择器默认值
 				pickVal2:[],   // 辅助城市名字线索
 				cityArr: [],   // 所有城市
@@ -156,14 +166,41 @@
 				back:'',
 				certification:[],
 				bb:'1',
-				cityData:''
+				cityData:'',
+				typeId: '',
+				typeList:[]
 			}
 		},
 		onLoad() {
 			this.getChannel();
-			this.loadProvinces()
+			this.loadProvinces();
+			this.fuwuType()
 		},
 		methods: {
+			gukeBtn(item) {
+				var index = this.selected.indexOf(item);
+				if (index === -1) {
+					this.selected.push(item);
+				} else {
+					this.selected.splice(index, 1);
+				}
+				var data = [];
+				for (var i = 0; i < this.selected.length; i++) {
+						data.push(this.selected[i].id)
+				}
+				this.typeId = data.join(",")
+			},
+			fuwuType(){
+				this.$Request.get("/app/dict/list", {
+					type: '服务类型'
+				}).then(res => {
+					if (res.code == 0) {
+						if (res.data) {
+							this.typeList = res.data
+						}
+					}
+				});
+			},
 			loadProvinces() { // 加载省份
 				uni.request({
 					url: 'http://test-api.tiananhub.com/api/province/GetListProvince',
@@ -315,6 +352,10 @@
 					this.$queue.showToast('请输入年龄')
 					return;
 				}
+				if (!this.typeId) {
+					this.$queue.showToast('请选合作项目')
+					return;
+				}
 				if (this.front == '') {
 					this.$queue.showToast('请上身份证正面')
 					return;
@@ -323,6 +364,7 @@
 					this.$queue.showToast('请上身份证反面')
 					return;
 				}
+				
 				this.certification = this.certification.toString();
 				let userId = this.$queue.getData('userId');
 				let data = {
@@ -333,7 +375,8 @@
 					city: this.cityData,
 					front: this.front,
 					back:this.back,
-					certification:this.certification
+					certification:this.certification,
+					classifyId: this.typeId,
 				}
 				this.$Request.postJson('/app/artificer/insertAgency', data).then(res => {
 					if (res.code == 0) {
@@ -477,9 +520,39 @@
 	}
 </script>
 
-<style lang="less">
+<style lang="less" scoped>
 	@import '../../static/less/index.less';
 	@import '../../static/css/index.css';
+	.huiBtn {
+		color:#333;
+		background: #f3f3f3;
+		// color: #333333;
+	}
+	.lanBtn {
+		color:#fff;
+		background: #049F89;
+	}
+	.guke-btn {
+		width:30%;
+		line-height:34px;
+		text-align: center;
+		font-weight: bold;
+		font-size:11px;
+		border-radius: 6px;
+		margin-top:5px;
+		margin-right:6px;
+	}
+	.guke-list {
+		width: 100%;
+		margin-top: 10px;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		flex-wrap: wrap;
+		box-sizing: border-box;
+		background-color: #fff;
+		justify-content: flex-start;
+	}
 	/deep/.is-required{
 		display: none;
 	}