<template>
	<view class="shopSettingsStyle" :style="{'height':contentHeight}">
		<view class="shopsetBox">
			<view class="box_item">
				<span style="font-weight: bold;">店铺logo</span>
				<u-upload ref="uUpload" 
					:action="action" 
					:custom-btn="true"
					 @on-success="uploadSuccessHandler" 
					 :show-upload-list="showUploadList"
					 :file-list="fileList"
				 >
					<u-avatar :src="msg.Logo" size="120" slot="addBtn"></u-avatar>
				</u-upload>
			</view>
			<view style="width: 94%;height: 1px;background: #E8E8E8;margin: 5px 0;"></view>
			<view class="box_item">
				<span style="font-weight: bold;">店铺名称</span>
				<input type="text" v-model="msg.Name" style="width: 200px;text-align: right;">
			</view>
		</view>
		<view class="shopsetBox">
			<view class="box_item">
				<span style="font-weight: bold;">店铺公告</span>
			</view>
			
			<textarea
			  placeholder="请输入店铺公告.."
			  style="font-size:14px;color:#111111;width: 94%;margin: 15px 0;"
			  :value="msg.Notice"
			  @input='identifybtn'
		
			/>
		</view>
		<view class="btn" @click="save">
			修改
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageTitle: "店铺信息设置",
				contentHeight:0,
				mainColor:'',
				secondary:'',
				
				msg:{
					Name:'',
					Logo:'',
					Notice:'',
				},
				showUploadList:false,
				fileList:[],
				action:this.host2+'/api/File/UploadTencent',
			}
		},
		onLoad(options){
			
			if(options){
				let data = JSON.parse(decodeURIComponent(options.data))
				this.msg.Name = data.UserName;
				this.msg.Logo = data.Logo;
				this.msg.Notice = data.Notice;
			}
		},
		created(){
			 this.contentHeight = this.$utils.calcContentHeight(-40)+'px';
			 this.mainColor = this.$uiConfig.mainColor;
			 this.secondary = this.$uiConfig.secondary;
			 // this.init()
		},
		mounted() {
			let currentPages = getCurrentPages();
			 let u = "/" + currentPages[currentPages.length-1].route;
			 let pages = wx.getStorageSync("basedata")
			   ? wx.getStorageSync("basedata").bar_title
			   : [];
			 pages.forEach((x) => {
			   if (x.value == u) {
			     this.pageTitle = x.new_name ? x.new_name : x.name;
			   }
			 });
			 uni.setNavigationBarTitle({
			   title: this.pageTitle,
			 });
		},
		methods: {
			save(){
				let pages = getCurrentPages(); // 当前页面
				let beforePage = pages[pages.length - 2]; // 前一个页面
					uni.showLoading({
						title: '加载中'
					});
					this.request2(
					  {
						url: '/api/AppletUser/UpdateShopsInfo',
						data: this.msg
					  },		
					  (res) => {
						uni.hideLoading();
						uni.showToast({
							title: res.data,
							icon: "none",
						});
						setTimeout(()=>{
							 uni.navigateBack({
								 success: function() {
									 beforePage.$vm.getSmallShopsCenter(); // 执行前一个页面的方法
								 }
							 });
						},1000)
						
					  }
				);
			},
			identifybtn(val){
				this.msg.Notice = val.detail.value
			},
			uploadSuccessHandler(data, index, lists) {
			  console.log(JSON.parse(data));
			   let r = JSON.parse(data);
			   this.msg.Logo = r.data;
			   console.log(this.msg.Logo);
			  
			},
			chooseTheImg(){
				let that = this
				uni.chooseImage({
				    count: 1, //默认9
				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				    sourceType: ['album'], //从相册选择
				    success: function (res) {
						let imgUrl = res.tempFilePaths[0]
						console.log(imgUrl)
						that.msg.Logo = imgUrl
				    }
				});
			
			}
		
		}
	}
</script>

<style>
.shopSettingsStyle{
	background: #f3f4f6;
	
}
.shopSettingsStyle .shopsetBox{
	width: 100%;
	background: #FFFFFF;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 20px;
}
.shopSettingsStyle .box_item{
	width: 94%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	font-size: 14px;
	color: #000000;
	padding: 15px 0;
	
}
.shopSettingsStyle .btn{
	width: 94%;
	height: 45px;
	border-radius: 22.5px;
	margin-left: 3%;
	background: #FF4048;
	font-size: 16px;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 70px;
}
.shopSettingsStyle .slot-btn {
  width: 140rpx;
  height: 140rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: rgb(244, 245, 246);
  border-radius: 10rpx;
}
</style>
