maishidaSJ/pages/UserCenter/mendian/mendianSPFenlei.vue

<template>
	<view>
		<customNav :shownav="true" :title="$t('index.goodsfenlei')" titledetl="" addBT='1' v-on:Enavbarsel="addmendianfl"></customNav>
		<!-- <view style="margin-top: 20rpx;">
			<uni-list v-for="item in shangpinfenlei">
			    <uni-list-item :show-extra-icon="false" showArrow  :title="item.name" :rightText="$t('mend.dianjibj')" @click="listClick(item.id,item.name)" link/>
			</uni-list>
		</view> -->
		
		<view style="margin-top: 30rpx;">
			<!-- <view class="contentInRowL" style="margin-left: 30rpx;margin-top: 60rpx;">
				<text>{{$t('shangpin.fenleiyuyan')}}: {{langtext}}</text>
				<uni-icons style="margin-left: 16rpx;" custom-prefix="custom-icon" color="#006AFF" type="loop" size="26" @click="changeLang"></uni-icons>
			</view> -->
			<view v-for="item in shangpinfenlei">
				<view class="contentInRowS bottomline">
					<text class="textfontB5" style="padding-left: 30rpx;">{{item.name}}</text>
					<view style="padding-right: 30rpx;">
						<text class="deleBt"  @click="deleClick(item.id)">{{$t('index.sanchu')}}</text>
						<text class="edeatBt"  @click="listClick(item.id,item.name,item.sort)">{{$t('mend.dianjibj')}}</text>
					</view>
				</view>
			</view>
			
		</view>
		
		<view>
		<!-- 输入框示例 -->
			<uni-popup ref="inputDialog" type="dialog">
				<view class="contentColumnC fenleiPop">
					<text class="textfontB1" style="width: 80%;text-align: center;margin-top: 16rpx;">{{$t('mend.tianjiafl')}}</text>
					<view class="contentInRowL" style="width: 80%;">
						<input class="noinputV" type="text" :value="name" :placeholder="$t('mend.qingshurflmc')" @input="inputName">
					</view>
					<view class="contentColumn" style="width: 80%;">
						<input class="noinputV" type="text" :value="sorft" :placeholder="$t('mend.qingshurflpx')" @input="inputSorft">
						<text style="font-size: 24rpx;color: darkgray;margin-top: 8rpx;">{{$t('mend.fenleixhsm')}}</text>
					</view>
					<view class="contentInRowS" style="width: 80%;margin-top: 30rpx;">
						<text class="" @click="dialogInputcancle">{{$t('order.quxiao')}}</text>
						<text class="" @click="dialogInputConfirm">{{$t('comp.queren')}}</text>
					</view>
					<view style="height: 30rpx;"></view>
				</view>
				<!-- <uni-popup-dialog ref="inputClose"  mode="input" :title="$t('mend.tianjiafl')" :value="name"
					:placeholder="$t('mend.qingshurflmc')" :cancelText="$t('order.quxiao')" :confirmText="$t('comp.queren')" @confirm="dialogInputConfirm"></uni-popup-dialog> -->
			</uni-popup>
		</view>
		<uni-popup ref="langPop">
			<view class="contentColumnC" style="width: 100%;background-color: white;">
				<text class="poptextList" style="margin-top: 20rpx;" @click="langSel('0')">Tiếng Việt</text>
				<text class="poptextList" @click="langSel('2')">简体中文</text>
				<text class="poptextList" @click="langSel('3')">繁體中文</text>
			</view>
		</uni-popup>
	</view>
</template>

<script>

	
	import api from "@/pages/api/api.js";
	
	export default {
		data() {
			return {
				shangpinfenlei: [],
				id:-1,
				mendid:0,
				name:'',
				sorft:'',
				lang:'0',
				langtext:'Tiếng Việt'
			}
		},
		onLoad(option) {
			this.mendid=option.mendid;
			var language = uni.getStorageSync('language');
			if(language=='yuenan'){
				this.lang='0';
				this.langtext='Tiếng Việt';
			}
			if(language=='zh-Hans'){
				this.lang='2';
				this.langtext='简体中文';
			}
			if(language=='zh-Hant'){
				this.lang='3';
				this.langtext='繁體中文';
			}
		},
		onShow() {
			this.getmendianshangpinFL(this.mendid);	
		},
		methods: {
			listClick(id,name,sort){
				this.id=id;
				this.name=name;
				this.sorft=sort;
				this.$refs.inputDialog.open();
			},
			changeLang(){
				this.$refs.langPop.open('bottom');
			},
			langSel(index){
				this.lang=index;
				if(this.lang=='0'){
					this.langtext='Tiếng Việt';
				}
				if(this.lang=='2'){
					this.langtext='简体中文';
				}
				if(this.lang=='3'){
					this.langtext='繁體中文';
				}
				this.$refs.langPop.close();
				this.getmendianshangpinFL(this.mendid);	
			},
			addmendianfl(){
				this.id=-1;
				this.name='';
				this.$refs.inputDialog.open();
			},
			inputName(v){
				this.name = v.target.value;
			},
			inputSorft(v){
				this.sorft = v.target.value;
			},
			dialogInputConfirm(){
				console.log('点击确认')
				this.$refs.inputDialog.close();
				this.addfenleiname(this.name);
			},
			dialogInputcancle(){
				console.log('点击取消')
				this.$refs.inputDialog.close();
			},
			getmendianshangpinFL(id){	
				api('getmendianshangpinFL',{
					id:id,
					language:this.lang
				},r=>{
					console.log(r);
					this.shangpinfenlei=r.data.data;
				},failc=>{
					//console.log('getadvertis----',failc)
				})
			},
			addfenleiname(name){
				var data;
				if(this.sorft==''){
					this.sorft=0;
				}
				if(this.id<0){
					data={
						mendid: this.mendid,
						name: name, 
						img: "",
						sort:this.sorft,
						language:this.lang
					}
				}
				else{
					data={
						mendid: this.mendid,
						name: name, 
						img: "",
						sort:this.sorft,
						id:this.id,
						language:this.lang
					}
				}
				console.log('addfenleiname：name',name);
				api('addmendianfenlei',data,
				r=>{
					console.log(r);
					this.getmendianshangpinFL(this.mendid);	
				},failc=>{
					//console.log('getadvertis----',failc)
				})
			},
			deleClick(index){
				var that = this;
				uni.showModal({
					cancelText: that.$t('order.quxiao'), // 取消按钮的文字
					confirmText: that.$t('comp.queren'), // 确认按钮的文字 
				    title: that.$t('api.message'),
				    content: that.$t('index.sanchushpfenl'),
				    success: function (res) {
						if (res.confirm) { //这里是点击了确定以后
							that.delefenlei(index);
						} else { //这里是点击了取消以后
						  console.log('用户点击取消')
						}
						
				    }
				})
			},
			delefenlei(index){
				api('delefenlei',{
					id:index
				},
				r=>{
					console.log(r)
					if(r.data.code==200){
						uni.showToast({
							title:this.$t('index.sanchuchengg'),
							icon:"none",
							duration: 1500
						})
						this.getmendianshangpinFL(this.mendid);	
					}
					else{
						uni.showToast({
							title:r.data.msg,
							icon:"none"
						})
					}
				},failc=>{
					uni.showToast({
						title:failc,
						icon:"none"
					})
				})
			},
		}
	}
</script>

<style>
.bottomline{
	height: 90rpx;
	border: solid lightgray;
	border-width: 0px 0px 2rpx 0px;
}

.deleBt{
	margin-right: 46rpx;
	color: #006AFF;
	text-decoration:underline;
}
.edeatBt{
	color:darkblue;
	text-decoration:underline;
}
.fenleiPop{
	width:660upx;
	background-color:white;
	border-radius: 8rpx;
}
.noinputV{
	margin-top: 30rpx;
	height: 46rpx;
	font-size: 28rpx;
	width: 100%;
	color: black;
	border: 1rpx solid lightgray;
}

.poptextList{
	width: 400rpx;
	height: 80rpx;
	text-align: center;
	line-height: 80rpx;
	border: solid lavender;
	border-width: 0px 0px 1rpx 0px;
}

</style>