From 0ac365b5c0d329e185ad8064237992a08269570a Mon Sep 17 00:00:00 2001
From: tianyi <13521030702@163.com>
Date: Fri, 15 May 2026 11:56:01 +0800
Subject: [PATCH] 1

---
 pages/shop/attributeList.vue | 990 +++++++++++++++++++++++++++++++++++
 1 file changed, 990 insertions(+)
 create mode 100644 pages/shop/attributeList.vue

diff --git a/pages/shop/attributeList.vue b/pages/shop/attributeList.vue
new file mode 100644
index 0000000..b60c765
--- /dev/null
+++ b/pages/shop/attributeList.vue
@@ -0,0 +1,990 @@
+<template>
+	<view class="u-wrap">
+		<view class="title">
+			<view class="title-sreach">
+				<view class="back-btn" @tap="back">
+					<uni-icons type="left" size="28"></uni-icons>
+				</view>
+				<view class="title-name">
+					属性管理
+				</view>
+			</view>
+		</view>
+		<view style="width: 100%;position: fixed;bottom: 10px;background: #fff;z-index: 99;">
+			<button size="default" type="default" @tap="inputDialogToggle('add')" hover-class="is-hover">添加属性</button>
+		</view>
+		<view class="card-list">
+			<ul>
+				<li v-for="(item, index) in indexList" :key="index" @tap="clickList(item)">
+					<view class="name">
+						<text>{{item.attributeName}}</text>
+						<u-icon name="edit-pen-fill" size="22" v-if="item.attributeName != '默认属性'" @tap.stop="inputDialogToggle('edit', item)"></u-icon>
+					</view>
+					<button class="bj-btn" @tap.stop="goGategoryLow(item)">管理属性</button>
+				</li>
+			</ul>
+		</view>
+		<u-modal :show="show" :title="'删除'" :content="'是否确认删除此属性？'" showCancelButton="true" @cancel="show = false"
+			@confirm="delItemModal"></u-modal>
+		<uni-popup ref="inputDialog" type="dialog">
+			<uni-popup-dialog ref="inputClose" mode="input" :title="dialogTit" :value="inputVal" placeholder="请输入名称"
+				@confirm="dialogInputConfirm" @close="dialogClose">
+			</uni-popup-dialog>
+		</uni-popup>
+		
+		<uni-popup ref="delDialog" background-color="#fff">
+			<view class="add-popup-content">
+				<view class="add-popup-title">
+					<text>编辑属性</text>
+					<uni-icons @tap='close' type="closeempty" color='red' size="16"
+						style="height:40rpx;line-height: 40rpx;position: absolute !important;bottom:0;right: 30rpx;"></uni-icons>
+				</view>
+				<view class="add-popup-container">
+					<view style="width: 90%;margin: 40rpx auto 0;">
+						属性名称：
+						<uni-easyinput type="text" v-model="inputVal" @blur="handleBlur" placeholder="请输入属性值" />
+					</view>
+					<view style="width: 100%;height: 90rpx;line-height: 90rpx;text-align: center;border-radius: 0;color: #fff;display: flex;position: absolute;bottom: 0;">
+						<view style="flex: 1;background: linear-gradient(90deg, #60F3FF, #088FEB);" v-if="inputVal != '默认属性'" @tap="dialogDel">删除</view>
+						<view style="flex: 1;background: linear-gradient(90deg, #FF9797, #FFC1E0);" @tap="dialogInputConfirm">确认</view>
+					</view>
+					<!-- <ul>
+						<li v-for="(item,index) in defaultList" :key="index">
+							<view class="title-fur">
+								<view class="name">{{item.name}}</view>
+								<u-icon size="20" name="plus" color="#5fd9ee"
+									@tap="toggle(index) "></u-icon>
+							</view>
+							<view class="content-fur">
+								<view class="content-low" :class="item1.checked?'checked':''" v-for="(item1,index1) in item.list" :key="index1"
+									@tap.stop="addMultipleType(item,item1.value,index1)">{{item1.value}}</view>
+							</view>
+						</li>
+					</ul> -->
+				</view>
+			</view>
+		</uni-popup>
+		<!-- 添加属性弹出层 -->
+		<uni-popup ref="addTypeDialog" background-color="#fff">
+			<view class="add-popup-content">
+				<view class="add-popup-title">
+					<text>新增属性</text>
+					<uni-icons @tap='close' type="closeempty" color='red' size="16"
+						style="height:40rpx;line-height: 40rpx;position: absolute !important;bottom:0;right: 30rpx;"></uni-icons>
+				</view>
+				<view class="add-popup-container">
+					
+					<input type="text" v-model="typeText" style="width: 100%;border: 1px solid #eee;height: 80rpx;padding-left: 20rpx;margin:20rpx 0;font-size: 25rpx;line-height: 80rpx;" 
+						placeholder="请输入属性名称">
+					<!-- <ul>
+						<li v-for="(item,index) in defaultList" :key="index">
+							<view class="title-fur">
+								<view class="name">{{item.name}}</view>
+								<u-icon size="20" name="plus" color="#5fd9ee"
+									@tap="toggle(index) "></u-icon>
+							</view>
+							<view class="content-fur">
+								<view class="content-low" :class="item1.checked?'checked':''" v-for="(item1,index1) in item.list" :key="index1"
+									@tap.stop="addMultipleType(item,item1.value,index1)">{{item1.value}}</view>
+							</view>
+						</li>
+					</ul> -->
+					<view class="add-popup-bottom">
+						<view class="add-popup-btn" @tap="dialogInputConfirm(typeText)">确认</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
+		
+		<uni-popup ref="attrValueDialog" background-color="#fff">
+			<view class="add-popup-content" style="width: 640rpx;max-height: 600px;overflow: scroll;">
+				<view class="add-popup-title">
+					<text>管理属性</text>
+					<uni-icons @tap='close' type="closeempty" color='red' size="16"
+						style="height:40rpx;line-height: 40rpx;position: absolute !important;bottom:0;right: 30rpx;"></uni-icons>
+				</view>
+				<view class="add-popup-container">
+					<view>
+						<text style="color:red;font-size:22rpx;">*点击“+”号可新增专属自己店铺的属性值</text>
+					</view>
+					<view style="display: flex;font-weight: 700;font-size: 16px;height: 50px;line-height: 50px;padding-right: 10px;">
+						<view style="flex: 1;">
+							属性列表
+						</view>
+						<uni-icons type="plusempty" @tap="toggle()" color="#5fd9ee" size="20"></uni-icons>
+					</view>
+					<ul>
+						<li v-for="(item,index) in defaultList" :key="index">
+							<view class="title-fur">
+								<view class="name">{{item.value}}</view>
+								<view class="btn" v-if="inputVal != '默认属性'" @tap="editValue(item)">修改</view>
+								<view class="btn" v-if="inputVal != '默认属性'" @tap="delValue(item)">删除</view>
+							</view>
+						</li>
+					</ul> 
+				</view>
+			</view>
+		</uni-popup>
+		
+		<!-- 查看商品库存弹出层 -->
+		<uni-popup ref="carPopup" background-color="#fff">
+			<view class="popup-content" style="height:auto !important;">
+				<view style="font-size: 36rpx;font-weight: bold;text-align: center;">提示</view>
+				<view v-if="goodsList !=''"
+					style="width:100%;font-weight:bold;text-align: center;font-size: 28rpx;margin: 20rpx 0;">
+					“{{goodsList[0].productName}}”属性下有以下库存，确认继续删除吗？
+				</view>
+				<view class="tui-order-item boxbg">
+					<view style="display: flex;border-bottom: 1px solid #eee;height: 50rpx;line-height: 50rpx;">
+						<view style="width: 70%;text-align: center;border-right: 1px solid #eee;">商品属性</view>
+						<view style="width: 29%;text-align: center;">数量</view>
+					</view>
+					<view class="shop-box" v-for="(item,index) in goodsList" :key="index" style="position: relative;">
+						<view style='height: 50rpx;line-height: 50rpx;'>
+							<view style="width: 70%;text-align: center;border-right: 1px solid #eee;float: left;height: 50rpx;overflow: hidden;">
+								{{item.attributeList | sliceMsg}}
+							</view>
+							<view style="width: 29%;text-align: center;float: left;">
+								{{item.stockCount}}
+							</view>
+						</view>
+					</view>
+				</view>
+				<!-- <u-loadmore :status="status" /> -->
+				<view class="popup-bottom">
+					<view class="popup-bottom-left">
+						<view class="bottom-btn" @tap="this.$refs.carPopup.close()"
+							style="background: linear-gradient(90deg, #FF9797, #FFC1E0);">再想想</view>
+					</view>
+					<view class="popup-bottom-right">
+						<view class="bottom-btn" @tap="this.show = true">确认删除</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
+		<uni-popup ref="addDialog" type="dialog">
+			<uni-popup-dialog 
+			  ref="addClose" 
+			  mode="input" 
+			  :title="'请输入属性名'" 
+			  v-model="specVal" 
+			  placeholder="请输入属性名称"
+			  @confirm="addSpec" 
+			  @close="dialogClose">
+			</uni-popup-dialog>
+		</uni-popup>
+	</view>
+
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				indexList: [],
+				show: false,
+				inputVal: '',
+				specVal:'',
+				addIndex:0,
+				typeModel: '',
+				editItem: {},
+				delItems: {},
+				isOpenId: '',
+				delType: '',
+				goodsList: [],
+				dialogTit: '输入属性名',
+				typeText:'',
+				sortText:'',
+				sortTextEdit:'',
+				defaultList:[{
+					name:'颜色',
+					list:[{
+						value:'均色',
+						checked:false,
+					},{
+						value:'白色',
+						checked:false,
+					},{
+						value:'黑色',
+						checked:false,
+					},{
+						value:'浅蓝',
+						checked:false,
+					},{
+						value:'蓝色',
+						checked:false,
+					},{
+						value:'灰色',
+						checked:false,
+					},{
+						value:'咖色',
+						checked:false,
+					},{
+						value:'紫色',
+						checked:false,
+					},{
+						value:'红色',
+						checked:false,
+					},{
+						value:'米色',
+						checked:false,
+					}]
+				},{
+					name:'尺码',
+					list:[{
+						value:'均码',
+						checked:false,
+					},{
+						value:'XS码',
+						checked:false
+					},{
+						value:'S码',
+						checked:false,
+					},{
+						value:'M码',
+						checked:false,
+					},{
+						value:'L码',
+						checked:false,
+					},{
+						value:'XL码',
+						checked:false,
+					},{
+						value:'XXL码',
+						checked:false,
+					},{
+						value:'XXXL码',
+						checked:false,
+					},{
+						value:'XXXXL码',
+						checked:false,
+					},{
+						value:'25码',
+						checked:false
+					},{
+						value:'26码',
+						checked:false
+					},{
+						value:'27码',
+						checked:false
+					},{
+						value:'28码',
+						checked:false
+					},{
+						value:'29码',
+						checked:false
+					},{
+						value:'30码',
+						checked:false
+					},{
+						value:'31码',
+						checked:false
+					},{
+						value:'32码',
+						checked:false
+					},{
+						value:'33码',
+						checked:false
+					},{
+						value:'34码',
+						checked:false
+					},{
+						value:'35码',
+						checked:false
+					},{
+						value:'36码',
+						checked:false
+					},{
+						value:'37码',
+						checked:false
+					},{
+						value:'38码',
+						checked:false
+					},{
+						value:'39码',
+						checked:false
+					},{
+						value:'40码',
+						checked:false
+					},{
+						value:'41码',
+						checked:false
+					},{
+						value:'42码',
+						checked:false
+					},{
+						value:'43码',
+						checked:false
+					},{
+						value:'44码',
+						checked:false
+					},{
+						value:'45码',
+						checked:false
+					}]
+				}],
+				attrId:'',
+				valueEditId:'',
+				isEdieValue:false,
+				multipleList:[]
+			}
+		},
+		computed: {
+
+		},
+		filters: {
+			sliceMsg(val) {
+				var name = ''
+				if (typeof(val) == 'string') {
+					let newObj = JSON.parse(val)
+					for (let as in newObj) {
+						name += newObj[as] + '/'
+					}
+				}
+				return name;
+			}
+		},
+		onShow() {
+			this.attrId = uni.getStorageSync('attrId');
+			this.getGategoryList()
+		},
+		methods: {
+			editValue(item){
+				this.isEdieValue = true
+				this.valueEditId = item.id
+				this.specVal = item.value
+				this.$refs.addDialog.open()
+			},
+			delValue(item){
+				this.tui.request("/app/productAttributeValue/delById", "post", {
+					id: item.id
+				}, false, true).then((res) => {
+					if (res.code == 200) {
+						this.tui.toast("删除成功")
+						this.goGategoryLow(this.editItem)
+						this.$forceUpdate()
+					} else {
+						this.tui.toast("添加失败")
+					}
+				
+				}).catch((res) => {})
+			},
+			//初始化获取属性列表
+			getGategoryList() {
+				this.tui.request("/app/productAttribute/selectByCategoryId", "post", {categoryId:this.attrId}, false, true).then((res) => {
+					if (res.code == 200) {
+						this.indexList = res.result;
+					} else {
+						this.tui.toast(res.message)
+					}
+				}).catch((res) => {})
+			},
+			//判断需要打开哪个弹窗（删除弹窗、取消弹窗）
+			inputDialogToggle(type, item, parent) {
+				this.typeModel = type;
+				if (type == 'edit') {
+					this.inputVal = item.attributeName;
+					this.editItem = item;
+					this.$refs.delDialog.open('bottom')
+				} else if (type == 'add') {
+					this.inputVal = '';
+					this.isOpenId = item;
+					this.dialogTit = '输入属性名'
+					this.$refs.addTypeDialog.open('bottom')
+				}
+
+			},
+			close(){
+				this.$refs.attrValueDialog.close()
+			},
+			handleBlur(e){
+				this.inputVal = e.detail.value
+			},
+			handleBlurSort(e){
+				this.sortTextEdit = e.detail.value
+			},
+			//查询属性下有没有库存
+			getTypeToNum(id) {
+				let that = this;
+				this.tui.request("/app/stock/getlistByAttributeList", "post", {
+					categoryId: id,
+				}, false, true).then((res) => {
+					if (res.code == 200) {
+						if (res.result != '') {
+							this.goodsList = res.result
+							this.$refs.carPopup.open('bottom')
+						} else {
+							this.tui.request("/app/productAttribute/selectByCategoryId", "POST", {
+								categoryId: this.delItems.id
+							}, false, true).then((res1) => {
+								if (res1.code == 200) {
+									if (res1.result.length > 0) {
+										uni.showModal({
+											title: "提示",
+											content: "此属性已经维护了子属性，确定继续删除吗？",
+											success: function(res2) {
+												if (res2.confirm) {
+													that.delItemModal()
+												}
+											}
+										})
+									} else {
+										that.show = true
+									}
+								}
+							}).catch((res) => {})
+						}
+					}
+				}).catch((res) => {})
+			},
+			//点击选择列表，带参数 返回上一页
+			clickList(item) {
+				let pages = getCurrentPages();
+				let prevPage = pages[pages.length - 2];
+				prevPage.$vm.typeItem = item
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+			back() {
+				uni.navigateBack()
+			},
+			toggle(){
+				this.specVal = ''
+				this.isEdieValue = false
+				this.$refs.addDialog.open()
+			},
+			addSpec(e){
+				let that = this;
+				if(this.isEdieValue){
+					that.tui.request("/app/productAttributeValue/edit", "post", {
+						id: that.valueEditId,
+						value:e
+					}, false, true).then((res) => {
+						if (res.code == 200) {
+							that.tui.toast("修改成功")
+							that.goGategoryLow(that.editItem)
+							that.$forceUpdate()
+						} else {
+							that.tui.toast("添加失败")
+						}
+					
+					}).catch((res) => {})
+				}else{
+					that.tui.request("/app/productAttributeValue/save", "post", {
+						attributeId: that.editItem.id,
+						value:e
+					}, false, true).then((res) => {
+						if (res.code == 200) {
+							that.tui.toast("添加成功")
+							that.goGategoryLow(that.editItem)
+							that.$forceUpdate()
+						} else {
+							that.tui.toast("添加失败")
+						}
+					
+					}).catch((res) => {})
+				}
+			},
+			//属性编辑（新增，修改）
+			dialogInputConfirm(e) {
+				let that = this;
+				switch (that.typeModel) {
+					case 'add':
+						for (let i = 0; i < that.indexList.length; i++) {
+							if (that.indexList[i].attributeName == e) {
+								uni.showToast({
+									title: "请勿重复添加！",
+									icon: 'error'
+								})
+								return
+							}
+						}
+						if(e == ''){
+							that.tui.toast("请输入属性名")
+							return
+						}
+						that.tui.request("/app/productAttribute/save", "post", {
+							categoryId: that.attrId,
+							attributeName:e
+						}, false, true).then((res) => {
+							if (res.code == 200) {
+								that.tui.toast("添加成功")
+								that.$refs.addTypeDialog.close()
+								that.getGategoryList()
+							} else {
+								that.tui.toast("添加失败")
+							}
+						
+						}).catch((res) => {})
+						// that.$refs.addTypeDialog.val = ''
+						/* for(var i=0;i<that.defaultList.length;i++){
+							for(var m=0;m<that.defaultList[i].list.length;m++){
+								that.defaultList[i].list[m].checked = false
+							}
+						} */
+						that.typeText = ''
+						that.multipleList = []
+						break;
+					case 'edit':
+						that.tui.request("/app/productAttribute/edit", "post", {
+							attributeName: this.inputVal,
+							id: that.editItem.id
+						}, false, true).then((res) => {
+							if (res.code == 200) {
+								that.getGategoryList()
+								that.sortText = ''
+								uni.showToast({
+									title: "修改成功",
+									icon: 'none'
+								})
+							} else {
+								uni.showToast({
+									title: "修改失败",
+									icon: 'none'
+								})
+							}
+						}).catch((res) => {})
+						break;
+					default:
+				}
+				that.$refs.delDialog.close()
+				that.$refs.inputClose.val = ''
+				this.inputVal = ""
+			},
+			//点击取消按钮
+			dialogClose() {
+				this.inputVal = '';
+				this.specVal = '';
+				this.$refs.inputClose.val = ''
+				this.$refs.addClose.val = ''
+				
+			},
+			//带删除按钮的弹窗
+			dialogDel() {
+				this.tui.request("/app/productAttribute/delById", "post", {
+					id: this.editItem.id,
+				}, false, true).then((res) => {
+					if (res.code == 200) {
+						this.getGategoryList()
+						uni.showToast({
+							title: "删除成功",
+							icon: 'none'
+						})
+						this.$refs.carPopup.close()
+						this.$refs.delDialog.close()
+					} else {
+						uni.showToast({
+							title: "删除失败",
+							icon: 'none'
+						})
+					}
+				}).catch((res) => {})
+			},
+			delItemModal() {
+				this.show = false;
+				if (this.delType == 'del') {
+					this.tui.request("/app/productCategory/delById", "post", {
+						id: this.delItems.id,
+					}, false, true).then((res) => {
+						if (res.code == 200) {
+							this.getGategoryList()
+							uni.showToast({
+								title: "删除成功",
+								icon: 'none'
+							})
+							this.$refs.carPopup.close()
+							this.$refs.delDialog.close()
+							
+						} else {
+							uni.showToast({
+								title: "删除失败",
+								icon: 'none'
+							})
+						}
+					}).catch((res) => {})
+				}
+			},
+			delItem(item, type) {
+				this.delType = type;
+				this.delItems = item;
+				this.getTypeToNum(this.delItems.id)
+			},
+			//跳转子属性页
+			goGategoryLow(item) {
+				this.editItem = item
+				this.tui.request("/app/productAttributeValue/selectByAttributeId", "get", {
+					id: item.id,
+				}, false, true).then((res) => {
+					if (res.code == 200) {
+						this.defaultList = res.result;
+						this.$refs.attrValueDialog.open();
+					} else {
+						uni.showToast({
+							title: "删除失败",
+							icon: 'none'
+						})
+					}
+				}).catch((res) => {})
+				
+			},
+			//选择多个属性保存
+			addMultipleType(item,item1,index){
+				
+				
+				item.list[index].checked = !item.list[index].checked
+				var list = []
+				if(this.multipleList == ''){
+					
+					list.push(item.list[index])
+					var data = {
+						attributeName:item.name,
+						productAttributeValueVoList: list
+					}
+					this.multipleList.push(data)
+				}else{
+					for(var i=0;i<this.multipleList.length;i++){
+						if(this.multipleList[i].attributeName == item.name){ //同种属性
+							
+							
+							for(var m=0;m<this.multipleList[i].productAttributeValueVoList.length;m++){
+								if(this.multipleList[i].productAttributeValueVoList[m].value == item.list[index].value){ //属性相同
+									
+									this.multipleList[i].productAttributeValueVoList.splice(m,1)
+									
+									return;
+								}else{ //属性不同
+									if(m+1 == this.multipleList[i].productAttributeValueVoList.length){
+										
+										this.multipleList[i].productAttributeValueVoList.push(item.list[index])
+										
+										return;
+									}
+								}
+							}
+						}else{ //不同属性
+							if(this.multipleList.length == i+1){
+								
+								
+								list.push(item.list[index])
+								var data = {
+									attributeName:item.name,
+									productAttributeValueVoList: list
+								}
+								this.multipleList.push(data)
+								
+								return;
+							}
+						}
+					}
+				}
+				
+				
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page,.page1{
+		font-size: 28rpx;
+	}
+	.u-wrap {
+		height: calc(100vh);
+		/* #ifdef H5 */
+		height: calc(100vh - var(--window-top));
+		/* #endif */
+		display: flex;
+		flex-direction: column;
+
+		.top {
+			line-height: 70rpx;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			background-color: #fff;
+
+			.u-collapse-content {
+				.icon {
+					display: flex;
+					float: right;
+
+					.u-icon {
+						flex: 1;
+					}
+				}
+
+			}
+
+			.name {
+				font-size: 28rpx;
+
+				.rightBox {
+					display: flex;
+					float: right;
+				}
+			}
+
+			.attr {
+				line-height: 56rpx;
+				margin-left: 20rpx;
+
+				.attrName {
+					color: #767a82;
+					font-size: 24rpx;
+					display: flex;
+					box-sizing: border-box;
+					width: 100%;
+					margin-top: 20rpx;
+				}
+
+				.attrs {
+					margin-left: 20rpx;
+
+					.u-tag-wrapper {
+						width: 20%;
+					}
+				}
+			}
+		}
+	}
+
+	button {
+		color: #ffffff;
+		background: #5fd9ee;
+		width: 90%;
+		margin: 20rpx auto 20rpx;
+	}
+
+	.card-list {
+		width: 95%;
+		border-radius: 10upx;
+		background: #fff;
+		height: auto;
+		margin: -200rpx auto 0;
+
+	}
+	.checked{
+		background: #60F3FF;
+		color: #fff;
+	}
+	.card-list ul {}
+
+	.card-list li {
+		width: 95%;
+		height: 100rpx;
+		line-height: 100rpx;
+		padding-left: 20rpx;
+		font-size: 37rpx;
+		border-bottom: 0.5px solid #eee;
+		margin: 0 auto;
+	}
+
+	.bj-btn {
+		width: 120rpx;
+		height: 60rpx;
+		font-size: 26rpx;
+		background: red;
+		margin: 20rpx 0;
+		float: left;
+		padding: 0;
+		line-height: 60rpx;
+	}
+
+	.name {
+		width: 75%;
+		float: left;
+		display: flex;
+	}
+
+	.data-v-5ff5d986 {}
+
+	.popup-content {
+		align-items: center;
+		justify-content: center;
+		padding: 30rpx;
+		height: 1200rpx;
+		background-color: #fff;
+		margin-bottom: 100rpx;
+		overflow: scroll;
+	}
+
+	.popup-container {
+		width: 100%;
+		background: #fff;
+		height: 50rpx;
+	}
+
+	.checkList {
+		display: flex;
+		height: 50rpx;
+		font-size: 28rpx;
+		line-height: 50rpx;
+		margin: 20rpx 0;
+	}
+
+	.checkList-box {
+		height: 50rpx;
+		width: 60%;
+	}
+	.title {
+		flex-shrink: 0;
+		background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
+		background-size: 100%;
+		width: 100%;
+		height: 400rpx;
+		padding-bottom: 20rpx;
+	}
+	
+	.title-sreach {
+		width: 100%;
+		display: flex;
+		height: 200rpx;
+		position: relative;
+	}
+	
+	.back-btn {
+		margin-top: 110rpx;
+	}
+	.btn{
+		flex: 1;
+		line-height: 25px;
+		text-align: center;
+		height: 25px;
+		color: #1E90FF;
+		border-radius: 7px;
+		margin: 5px 0 0 10px;
+	}
+	
+	.title-search {
+		margin-top: 110rpx;
+		display: flex;
+		background: #fff;
+		height: 54rpx;
+		margin-left: 20rpx;
+		border-radius: 54rpx;
+		width: 380rpx;
+		flex: 1;
+	
+		input {
+			height: 54rpx;
+			line-height: 54rpx;
+		}
+	}
+	.popup-bottom {
+		width: 95%;
+		height: 100rpx;
+		position: fixed;
+		bottom: 0;
+		left: 2.5%;
+		display: flex;
+		z-index: 99;
+		background: #fff;
+	}
+
+	.popup-bottom-left {
+		width: 50%;
+		line-height: 80rpx;
+	}
+
+	.popup-bottom-right {
+		width: 50%;
+		line-height: 100rpx;
+	}
+
+	.bottom-btn {
+		width: 70%;
+		line-height: 70rpx;
+		height: 70rpx;
+		text-align: center;
+		/* margin-top: 10rpx; */
+		color: #fff;
+		font-size: 28rpx;
+		margin: 0 auto;
+		background: linear-gradient(90deg, #60F3FF, #088FEB);
+		border-radius: 70rpx;
+	}
+	.add-popup-content {
+		align-items: center;
+		justify-content: center;
+		padding: 30rpx;
+		width: 100%;
+		height: 325rpx;
+		background-color: #fff;
+		overflow: scroll;
+	}
+	
+	.add-popup-title {
+		font-size: 36rpx;
+		font-weight: bold;
+		text-align: center;
+		position: relative;
+	}
+	
+	.add-popup-container {
+		margin-top: 20rpx;
+	}
+	.title-name {
+		padding-top: 110rpx;
+		font-size: 36rpx;
+		font-weight: 700;
+		flex: 1;
+		text-align: center;
+	}
+	.add-popup-bottom {
+		display: flex;
+		height: 80rpx;
+		color: #fff;
+		line-height: 80rpx;
+		margin-top: 50rpx;
+	}
+	
+	.add-popup-btn {
+		flex: 1;
+		text-align: center;
+		background: linear-gradient(90deg, #60F3FF, #088FEB);
+	}
+	.title-fur {
+		width: 95%;
+		height: 70rpx;
+		margin: 0 auto;
+		border-bottom: 1px solid #eee;
+		display: flex;
+		.name {
+			font-size: 30rpx;
+			width: 65%;
+			height: 70rpx;
+			line-height: 70rpx;
+		}
+	}
+	.content-fur {
+		padding-bottom: 25rpx;
+	}
+	
+	.content-low {
+		width: auto;
+		border: 1px solid #eee;
+		display: inline-block;
+		min-width: 90rpx;
+		padding: 5rpx;
+		font-size: 35rpx;
+		text-align: center;
+		color: #777;
+		margin: 20rpx 0 0 20rpx;
+	}
+	.type-popup{
+		width: 500rpx;
+		height: auto;
+		background: #fff;
+		border-radius: 10px;
+		position: relative;
+		margin-bottom: 40rpx;
+	}
+	@media screen and (min-width: 760px) {
+		.add-popup-content{
+			height: 700px !important;
+		}
+		.vue-ref{
+			padding-bottom:0 !important;
+		}
+	}
+</style>
\ No newline at end of file