<template>
	<!-- 添加规格页面 添加和修改 -->
	<view class="specsadd">
		<view class="shopinfoss">
			<view class="biao">
				<view class="cu-form-group ">
					<view class="title">规格名称：</view>
					<input placeholder="请输入" v-model="spename" name="input" ></input>
				</view>
				
				<picker @change="bindTimeChange" :value="typeindex" :range="joinlist" range-key="name" >
				<view class="biao_05 cu-form-group">
					<view class="title">所属分类：</view>
					<view class="time flex" >
						<view class="biao_05_2"> 
							<view class="uni-list-cell-db flex">
									<view class="uni-input">{{joinlist[typeindex].name?joinlist[typeindex].name:''}}</view>
							</view>
						</view>
					</view>
				</view>
				</picker>

				<view class="cu-form-group ">
					<view class="title">可选值列表：</view>
				</view>
				<view class="cu-form-group">
					<textarea class="textareakeyname"  v-model="keynames"   placeholder="回车区分"></textarea>
				</view>

				<view class="cu-form-group ">
					<view class="title">排序：</view>
					<input placeholder="请输入" type="number" v-model="orderby"  name="input" ></input>
				</view>
				
				<view class="cu-form-group ">
					<view class="title">是否检索关键字：</view>
					<switch @change="switch2Change" :checked="checkedswitch" />
				</view>
				
				
			</view>
			
			<view class="p_btn">
				<view class=" flex flex-direction">
					<button @tap="formsubmit" class="cu-btn bg-red margin-tb-sm lg">提交</button>
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	import wPicker from "@/components/w-picker/w-picker.vue";
	import {specTypeList,addSpec} from "@/utils/api/api.js";//添加修改规格方法
	export default {
		components:{
			wPicker
		},
		data(){
			return {
				arraylist:["分类1","分类2","分类3","分类4"],
				typeindex:0,//选中的
				keynames:"",//关键字内容
				keynamesArr:[],//关键字数据 数组类似
				
				joinlist:[{name:"请选择"}],
				actiontype:"1",//1 添加 2修改
				spename:"",
				orderby:"",
				checkedswitch:false,//是否选中
				spec_id:"",//修改的时候需要的规格主键id
				editspecsItem:{},
			}
		},
		onLoad(opdata) {
			if(opdata.actiontype && opdata.actiontype!='undefined'){
				this.actiontype = opdata.actiontype;
				this.spec_id = opdata.id;
			}else{
				this.actiontype = '1';
			}
			this.specTypeListfun();
		},
		onShow() {
			
			let editspecs = uni.getStorageSync("editspecs");
			this.editspecsItem = editspecs;
			if(editspecs.id){
				this.spename = editspecs.name;//名称
				this.spec_id = editspecs.id;//修改id
				this.orderby = editspecs.order;//排序
				this.checkedswitch = editspecs.search_index==0?false:true;
				
				let keynamesarr = editspecs.spec_item.split(" , ")
				// keynamesarr = keynamesarr.replace(/\s+/g,"");//去除空格
				this.keynames = keynamesarr.join("\n");//处理可选中列表
				//this.keynamesArr = this.keynamesArr.join(";")
				//this.type_id
				
				//还有分类选中的id 和   可选值列表的数据在获取分类列表中处理
				
				uni.setStorageSync("editspecs",{})
				
			}
		},
		methods:{
			//获取分类立碑
			async  specTypeListfun(){
				let res =await specTypeList({
					
				});
				if(res.code==0){
					this.joinlist = res.data;
					
					//如果是修改的时候 应该将之前的默认选中改过来
					if(this.actiontype==2){
						this.joinlist.forEach((item,index)=>{
							if(item.id==this.editspecsItem.type_id){
								this.typeindex = index;
							}
						})
					}
					
				}else{
					this.$api.msg(res.msg);
				}
				
			},
			textareaAInput(e){
				
			},
			TimeChange(e) {
				this.time = e.detail.value
			},
			bindTimeChange(e) {
				this.typeindex = e.detail.value
			},
			//添加修改规格方法
			async formsubmit(){
				// this.$yicode.rmspace()
				if(this.spename==""){
					this.$api.msg("请输入规格名称");
					return false;
				}else if(this.orderby==""){
					this.$api.msg("请输入排序");
					return false;
				}else if(this.keynamesArr==""){
					this.$api.msg("请输入可选值列表");
					return false;
				}

				let keynamesArr =  this.keynamesArr.replace(/\s+/g,"");//去除空格
				// return false;
				
				let parameter = {
					action:this.actiontype==2?'edit':'add',//权限，（add:添加，edit:编辑修改）
					type_id:this.joinlist[this.typeindex].id,//模型类型
					name:this.spename,//规格名称
					order:this.orderby,//排序
					search_index:this.checkedswitch?"1":"0",//是否检索关键字，默认0，是为1
					item:this.keynamesArr,//可选值列表（;分开）
				}
				
				//修改的时候
				if(this.actiontype==2){
					parameter.id = this.spec_id;
				}
				
				let res = await addSpec(parameter);
				if(res.code==0){
					this.$api.msg(res.msg);
					setTimeout(()=>{
						uni.navigateBack({
						})
					},1500)
				}else{
					this.$api.msg(res.msg);
				}
			},
			switch2Change(e){
				this.checkedswitch = e.detail.value;
			}
		},
		watch:{
			// split("\n")
			keynames(e,c){
				//现在的 之前的
				this.keynamesArr = this.keynames.split("\n");
				this.keynamesArr = this.keynamesArr.join(";");
			}
		}
	}
</script>

<style lang="scss">
	@import  "./specsadd.scss";
</style>
