|
|
|
@ -18,15 +18,17 @@ |
|
|
|
|
<!-- <view class="filter-content-detail show_min_height"> --> |
|
|
|
|
<scroll-view scroll-y="true" > |
|
|
|
|
<view class=""> |
|
|
|
|
<span class="zdyTitle" v-if="( productCodeLable? index==3 : false ) ">渠道</span> |
|
|
|
|
<view class="filter-content-detail show_min_height"> |
|
|
|
|
<text v-if="( productCodeLable? index==3 : false ) " v-for="( detailItem,idx) in selectDetailLists" :key="idx" class='filter-content-detail-item-default' :style="{'background-color':detailItem.isSelected?themeColor:'#FFFFFF','color':detailItem.isSelected?'#FFFFFF':'#666666'}" |
|
|
|
|
@tap="itemTap(idx,selectDetailLists,item.isMutiple,item.key,detailItem)"> |
|
|
|
|
@tap="itemTaps(idx,selectDetailLists,item.isMutiple,'channelCode',detailItem)"> |
|
|
|
|
{{detailItem.title}} |
|
|
|
|
</text> |
|
|
|
|
</view> |
|
|
|
|
<span class="zdyTitle" v-if="( productCodeLable? index==3 : false ) ">品牌</span> |
|
|
|
|
<view class="filter-content-detail show_min_height"> |
|
|
|
|
<text v-if="( productCodeLable? index!==2 : true ) " v-for="( detailItem,idx) in selectDetailList" :key="idx" class='filter-content-detail-item-default' :style="{'background-color':detailItem.isSelected?themeColor:'#FFFFFF','color':detailItem.isSelected?'#FFFFFF':'#666666'}" |
|
|
|
|
@tap="itemTap(idx,selectDetailList,item.isMutiple,item.key,detailItem)"> |
|
|
|
|
@tap="itemTap(idx,selectDetailList,item.isMutiple,item.key,detailItem,index)"> |
|
|
|
|
{{detailItem.title}} |
|
|
|
|
</text> |
|
|
|
|
</view> |
|
|
|
@ -40,9 +42,9 @@ |
|
|
|
|
</scroll-view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="filter-content-detail"> |
|
|
|
|
<view class="filter-content-detail" v-show="pickerShow"> |
|
|
|
|
<!-- 省市区选择 --> |
|
|
|
|
<view class="region-box" v-if="( productCodeLable? index==0 : true ) "> |
|
|
|
|
<view class="region-box" v-if="( productCodeLable? index==1 : true ) "> |
|
|
|
|
<picker-view :value="region" @change="bindChange"> |
|
|
|
|
<picker-view-column> |
|
|
|
|
<view class="center" v-for="(item, index) in areaCodeList" :key="index"> |
|
|
|
@ -64,10 +66,10 @@ |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="filter-content-footer"> |
|
|
|
|
<view class="filter-content-footer-item" style="color: #777777; background-color: #FFFFFF;" @tap="resetClick(selectDetailList,item.key)"> |
|
|
|
|
<view class="filter-content-footer-item" style="color: #777777; background-color: #FFFFFF;" @tap="resetClick(selectDetailList,item.key,selectDetailLists,'channelCode',index)"> |
|
|
|
|
<text>重置</text> |
|
|
|
|
</view> |
|
|
|
|
<view class="filter-content-footer-item" :style="{'color': '#FFFFFF', 'background-color': themeColor}" @tap="sureClick"> |
|
|
|
|
<view class="filter-content-footer-item" :style="{'color': '#FFFFFF', 'background-color': themeColor}" @tap="sureClick(selectDetailList,item.key,index)"> |
|
|
|
|
<text>确定</text> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
@ -97,7 +99,12 @@ |
|
|
|
|
areaIndex:[0, 0, 0], |
|
|
|
|
provinceCode:'', |
|
|
|
|
cityCode:'', |
|
|
|
|
areaCode:'' |
|
|
|
|
areaCode:'', |
|
|
|
|
region:[], |
|
|
|
|
paixu:1, |
|
|
|
|
oilCode:'0#', |
|
|
|
|
showHide:true, |
|
|
|
|
pickerShow:false, |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
props: { |
|
|
|
@ -187,7 +194,7 @@ |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
//选择值改变事件 省市区级联选择 |
|
|
|
|
bindChange(e) { |
|
|
|
|
bindChange(e,ccc) { |
|
|
|
|
// 用于对比滑动的是哪一列数据 |
|
|
|
|
const val = e.detail.value |
|
|
|
|
this.areaIndex = val |
|
|
|
@ -204,20 +211,19 @@ |
|
|
|
|
} else { |
|
|
|
|
this.areaIndex = e.detail.value; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 数组push‘全部’ |
|
|
|
|
if(this.areaCodeList[val[0]].childList[0].areaName != '全部'){ |
|
|
|
|
this.areaCodeList[val[0]].childList.unshift({areaName:'全部'}) |
|
|
|
|
} |
|
|
|
|
if(this.areaCodeList[val[0]].childList[val[1]].childList[0].areaName != '全部'){ |
|
|
|
|
this.areaCodeList[val[0]].childList[val[1]].childList.unshift({areaName:'全部'}) |
|
|
|
|
} |
|
|
|
|
console.log(this.areaCodeList,'99999999999999999') |
|
|
|
|
console.log(this.areaCodeList[this.areaIndex[0]],this.areaCodeList[this.areaIndex[0]].childList,this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList,'打印圣兽下标') |
|
|
|
|
console.log(this.areaCodeList[this.areaIndex[0]].areaName + this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].areaName + this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList[this.areaIndex[2]].areaName) |
|
|
|
|
this.provinceCode = this.areaCodeList[this.areaIndex[0]].id |
|
|
|
|
this.cityCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].id |
|
|
|
|
this.areaCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList[this.areaIndex[2]].id |
|
|
|
|
if(!ccc){ |
|
|
|
|
// 数组push‘全部’ |
|
|
|
|
if(this.areaCodeList[val[0]].childList[0].areaName != '全部'){ |
|
|
|
|
this.areaCodeList[val[0]].childList.unshift({areaName:'全部'}) |
|
|
|
|
} |
|
|
|
|
if(this.areaCodeList[val[0]].childList[val[1]].childList[0].areaName != '全部'){ |
|
|
|
|
this.areaCodeList[val[0]].childList[val[1]].childList.unshift({areaName:'全部'}) |
|
|
|
|
} |
|
|
|
|
this.provinceCode = this.areaCodeList[this.areaIndex[0]].id |
|
|
|
|
this.cityCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].id |
|
|
|
|
this.areaCode = this.areaCodeList[this.areaIndex[0]].childList[this.areaIndex[1]].childList[this.areaIndex[2]].id |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
this.$emit('changeArea',e) |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
@ -228,6 +234,7 @@ |
|
|
|
|
}else{ |
|
|
|
|
this.seleIdex = e + '/'+ w + '/' + j |
|
|
|
|
} |
|
|
|
|
this.oilCode = this.seleIdex |
|
|
|
|
}, |
|
|
|
|
setingFn(){ |
|
|
|
|
if(this.productCodeList){ |
|
|
|
@ -244,12 +251,15 @@ |
|
|
|
|
if (item.isMutiple) { |
|
|
|
|
obj[item.key] = []; |
|
|
|
|
item.detailList[0].isSelected = false; |
|
|
|
|
item.detailLists[0].isSelected = false; |
|
|
|
|
if (!Array.isArray(item.defaultSelectedIndex)) { // 如果默认值不是数组 |
|
|
|
|
item.defaultSelectedIndex = [item.defaultSelectedIndex]; |
|
|
|
|
} |
|
|
|
|
for (let j = 0; j < item.defaultSelectedIndex.length; j++) { // 将默认选中的值放入selectedObj |
|
|
|
|
item.detailList[item.defaultSelectedIndex[j]].isSelected = true; |
|
|
|
|
obj[item.key].push(item.detailList[item.defaultSelectedIndex[j]].value) |
|
|
|
|
item.detailLists[item.defaultSelectedIndex[j]].isSelected = true; |
|
|
|
|
obj[item.key].push(item.detailLists[item.defaultSelectedIndex[j]].value) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} else { |
|
|
|
@ -258,6 +268,11 @@ |
|
|
|
|
this.defaultSelectedTitleObj[item.key] = item.detailList[item.defaultSelectedIndex].title; |
|
|
|
|
item.detailList[0].isSelected = false; |
|
|
|
|
item.detailList[item.defaultSelectedIndex].isSelected = true; |
|
|
|
|
obj[item.key] = item.detailLists[item.defaultSelectedIndex].value; |
|
|
|
|
this.selectedTitleObj[item.key] = item.detailLists[item.defaultSelectedIndex].title; |
|
|
|
|
this.defaultSelectedTitleObj[item.key] = item.detailLists[item.defaultSelectedIndex].title; |
|
|
|
|
item.detailLists[0].isSelected = false; |
|
|
|
|
item.detailLists[item.defaultSelectedIndex].isSelected = true; |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
if (item.isMutiple) { |
|
|
|
@ -297,11 +312,15 @@ |
|
|
|
|
if (this.selectDetailList[this.menuList[i].defaultSelectedIndex[j]].isSelected == false) { |
|
|
|
|
this.itemTap(this.menuList[i].defaultSelectedIndex[j], this.selectDetailList, this.menuList[i].isMutiple, this |
|
|
|
|
.menuList[i].key) |
|
|
|
|
this.itemTaps(this.menuList[i].defaultSelectedIndex[j], this.selectDetailList, this.menuList[i].isMutiple, this |
|
|
|
|
.menuList[i].key) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
this.itemTap(this.menuList[i].defaultSelectedIndex, this.selectDetailList, this.menuList[i].isMutiple, this.menuList[ |
|
|
|
|
i].key) |
|
|
|
|
this.itemTaps(this.menuList[i].defaultSelectedIndex, this.selectDetailList, this.menuList[i].isMutiple, this.menuList[ |
|
|
|
|
i].key) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 获取非默认项的下标 |
|
|
|
@ -311,6 +330,8 @@ |
|
|
|
|
if (this.selectDetailList[unDefaultSelectedIndexArr[j]].isSelected == true) { |
|
|
|
|
this.itemTap(unDefaultSelectedIndexArr[j], this.selectDetailList, this.menuList[i].isMutiple, this |
|
|
|
|
.menuList[i].key) |
|
|
|
|
this.itemTaps(unDefaultSelectedIndexArr[j], this.selectDetailList, this.menuList[i].isMutiple, this |
|
|
|
|
.menuList[i].key) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -351,7 +372,7 @@ |
|
|
|
|
this.$emit('update:menuList', val) |
|
|
|
|
}, |
|
|
|
|
menuTabClick(index) { |
|
|
|
|
console.log('展开') |
|
|
|
|
console.log(this.menuList,'展开') |
|
|
|
|
this.menuIndex = index; |
|
|
|
|
this.selectDetailList = this.menuList[index].detailList; |
|
|
|
|
this.selectDetailLists = this.menuList[index].detailLists; |
|
|
|
@ -383,6 +404,7 @@ |
|
|
|
|
for (let i = 0; i < idx.length; i++) { |
|
|
|
|
if (this.menuList[index].detailList[idx[i]].isSelected == false) { |
|
|
|
|
this.itemTap(idx[i], this.menuList[index].detailList, true, this.selectedKey); |
|
|
|
|
this.itemTaps(idx[i], this.menuList[index].detailList, true, this.selectedKey); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
@ -390,6 +412,7 @@ |
|
|
|
|
if (this.menuList[index].detailList[idx].isSelected == false) { |
|
|
|
|
|
|
|
|
|
this.itemTap(idx, this.menuList[index].detailList, false, this.selectedKey); |
|
|
|
|
this.itemTaps(idx, this.menuList[index].detailList, false, this.selectedKey); |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -412,7 +435,7 @@ |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
//图标点击方法 |
|
|
|
|
itemTap(index, list, isMutiple, key, detailItem) { |
|
|
|
|
itemTap(index, list, isMutiple, key, detailItem,indexs) { |
|
|
|
|
//是否多选 |
|
|
|
|
if (isMutiple == true) { |
|
|
|
|
list[index].isSelected = !list[index].isSelected; |
|
|
|
@ -474,14 +497,104 @@ |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
if(indexs==1){ |
|
|
|
|
if(detailItem.value==10){ |
|
|
|
|
this.detailItems = '' |
|
|
|
|
this.pickerShow = true |
|
|
|
|
}else{ |
|
|
|
|
this.detailItems = detailItem.value |
|
|
|
|
this.provinceCode = '' |
|
|
|
|
this.cityCode = '' |
|
|
|
|
this.areaCode = '' |
|
|
|
|
this.pickerShow = false |
|
|
|
|
this.region = [] |
|
|
|
|
} |
|
|
|
|
}else{ |
|
|
|
|
this.pickerShow = false |
|
|
|
|
} |
|
|
|
|
if(indexs==2){ |
|
|
|
|
this.oilCode = detailItem.value |
|
|
|
|
} |
|
|
|
|
if(indexs==0){ |
|
|
|
|
this.paixu = detailItem.value=='juli'?1:2 |
|
|
|
|
} |
|
|
|
|
console.log(index, list, isMutiple, key, detailItem,indexs,'打印打印打印') |
|
|
|
|
// this.detailItems = detailItem.value*1000 |
|
|
|
|
} |
|
|
|
|
// #ifdef H5 |
|
|
|
|
this.$forceUpdate(); |
|
|
|
|
// #endif |
|
|
|
|
}, |
|
|
|
|
//图标点击方法 |
|
|
|
|
itemTaps(index, list, isMutiple, key, detailItem,indexs) { |
|
|
|
|
//是否多选 |
|
|
|
|
if (isMutiple == true) { |
|
|
|
|
list[index].isSelected = !list[index].isSelected; |
|
|
|
|
if (index == 0) { |
|
|
|
|
this.resetSelected(list, key) |
|
|
|
|
if (!this.independence) { |
|
|
|
|
this.selectedTitleObj[key] = list[index].title; |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
list[0].isSelected = false |
|
|
|
|
if (list[index].isSelected) { |
|
|
|
|
if (this.independence) { |
|
|
|
|
this.independenceObj[this.selectedKey].push(list[index].value); |
|
|
|
|
} else { |
|
|
|
|
this.selectedObj[key].push(list[index].value); |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
list[index].isSelected = false; |
|
|
|
|
if (this.independence) { |
|
|
|
|
var idx = this.independenceObj[this.selectedKey].indexOf(list[index].value); |
|
|
|
|
this.independenceObj[this.selectedKey].splice(idx, 1); |
|
|
|
|
} else { |
|
|
|
|
var idx = this.selectedObj[key].indexOf(list[index].value); |
|
|
|
|
this.selectedObj[key].splice(idx, 1); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
if (this.independence) { |
|
|
|
|
this.result = this.independenceObj; |
|
|
|
|
} else { |
|
|
|
|
this.result = this.selectedObj; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
//判断是否是第一个 |
|
|
|
|
if (index == 0) { |
|
|
|
|
this.resetSelected(list, key) |
|
|
|
|
if (!this.independence) { |
|
|
|
|
this.selectedTitleObj[key] = list[index].title; |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
//列表第一个为false |
|
|
|
|
list[0].isSelected = false |
|
|
|
|
if (this.independence) { |
|
|
|
|
this.independenceObj[this.selectedKey] = list[index].value; |
|
|
|
|
this.result = this.independenceObj; |
|
|
|
|
} else { |
|
|
|
|
this.selectedObj[key] = list[index].value; |
|
|
|
|
this.result = this.selectedObj; |
|
|
|
|
this.selectedTitleObj[key] = list[index].title; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
for (let i = 0; i < list.length; i++) { |
|
|
|
|
if (index == i) { |
|
|
|
|
list[i].isSelected = true |
|
|
|
|
} else { |
|
|
|
|
list[i].isSelected = false |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
console.log(index, list, isMutiple, key, detailItem,'打印打印打印') |
|
|
|
|
this.detailItems = detailItem.value*1000 |
|
|
|
|
} |
|
|
|
|
// #ifdef H5 |
|
|
|
|
this.$forceUpdate(); |
|
|
|
|
// #endif |
|
|
|
|
}, |
|
|
|
|
resetSelected(list, key) { |
|
|
|
|
resetSelected(list, key,lists, keys) { |
|
|
|
|
console.log('%c 重置方法第二步resetSelected函数参数↓','color:green;font-size:30px') |
|
|
|
|
if (typeof this.result[key] == 'object') { |
|
|
|
|
this.result[key] = []; |
|
|
|
@ -498,6 +611,23 @@ |
|
|
|
|
list[i].isSelected = false; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
if(key=='siteBrand'){ |
|
|
|
|
if (typeof this.result[keys] == 'object') { |
|
|
|
|
this.result[keys] = []; |
|
|
|
|
this.selectedTitleObj[keys] = lists[0].title; |
|
|
|
|
} else { |
|
|
|
|
this.result[keys] = ''; |
|
|
|
|
this.selectedTitleObj[key] = lists[0].title; |
|
|
|
|
console.log(this.result,'重置之后的数据') |
|
|
|
|
} |
|
|
|
|
for (let i = 0; i < lists.length; i++) { |
|
|
|
|
if (i == 0) { |
|
|
|
|
lists[i].isSelected = true; |
|
|
|
|
} else { |
|
|
|
|
lists[i].isSelected = false; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
console.log(this.result) |
|
|
|
|
// #ifdef H5 |
|
|
|
|
this.$forceUpdate(); |
|
|
|
@ -528,7 +658,23 @@ |
|
|
|
|
this.$emit("confirm", obj); |
|
|
|
|
}, |
|
|
|
|
//点击 确定方法 |
|
|
|
|
sureClick() { |
|
|
|
|
sureClick(selectDetailList,item,index) { |
|
|
|
|
console.log(index,this.oilCode,this.paixu,'5555555555555') |
|
|
|
|
if(index == 2&&!this.oilCode){ |
|
|
|
|
this.menuList[0].detailList[0].isSelected = true |
|
|
|
|
this.menuList[0].detailList[1].isSelected = false |
|
|
|
|
this.paixu = 1 |
|
|
|
|
this.selectedTitleObj['sort'] = '距离排序' |
|
|
|
|
} |
|
|
|
|
if(index == 0&&!this.oilCode&&this.paixu==2){ |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: '请先选择油品再价格排序', |
|
|
|
|
icon: 'none' |
|
|
|
|
}) |
|
|
|
|
this.itemTap(0, selectDetailList, false, item,selectDetailList[1],index) |
|
|
|
|
this.paixu = 1 |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
|
if(this.areaIndex[0] == 0){ |
|
|
|
|
this.provinceCode = '' |
|
|
|
|
this.cityCode = '' |
|
|
|
@ -549,6 +695,9 @@ |
|
|
|
|
obj.result.provinceCode = this.provinceCode |
|
|
|
|
obj.result.cityCode = this.cityCode |
|
|
|
|
obj.result.areaCode = this.areaCode |
|
|
|
|
obj.result.distance = this.provinceCode?'':this.cityCode?'':this.areaCode?'':this.detailItems |
|
|
|
|
obj.result.sort = this.paixu==1?'juli':'price' |
|
|
|
|
obj.result.oilProductCode = this.oilCode |
|
|
|
|
// obj.result.distance = this.detailItems |
|
|
|
|
console.log(obj,'look me!') |
|
|
|
|
// console.log(this.seleIdex.split('/'),this.productCodeList[this.seleIdex.split('/')[1]][this.seleIdex.split('/')[0]],this.seleIdex.split('/')[2],'dddddddddddddddddd') |
|
|
|
@ -562,7 +711,7 @@ |
|
|
|
|
} |
|
|
|
|
this.$emit("confirm", obj); |
|
|
|
|
}, |
|
|
|
|
resetClick(list, key) { |
|
|
|
|
resetClick(list, key,lists,keys,index) { |
|
|
|
|
console.log('%c 重置方法第一步resetClick函数参数↓','color:red;font-size:30px') |
|
|
|
|
console.log(list, key) |
|
|
|
|
if(this.seleIdex!==null&&this.seleIdex.split('/')[2]==2){ |
|
|
|
@ -570,14 +719,36 @@ |
|
|
|
|
this.pseleFn() |
|
|
|
|
// console.log(obj,'look me!2') |
|
|
|
|
// this.$emit("confirm", obj); |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
|
if(key == 'channelCode'){ |
|
|
|
|
this.provinceCode = '' |
|
|
|
|
this.cityCode = '' |
|
|
|
|
this.areaCode = '' |
|
|
|
|
} |
|
|
|
|
this.resetSelected(list, key) |
|
|
|
|
this.resetSelected(list, key,lists,keys) |
|
|
|
|
if(index == 2){ |
|
|
|
|
this.oilCode = '' |
|
|
|
|
this.paixu = 1 |
|
|
|
|
console.log(this.oilCode,index,'9999999999999999') |
|
|
|
|
} |
|
|
|
|
if(index == 1){ |
|
|
|
|
this.provinceCode = '' |
|
|
|
|
this.cityCode = '' |
|
|
|
|
this.areaCode = '' |
|
|
|
|
this.detailItems = '' |
|
|
|
|
this.region = [] |
|
|
|
|
this.pickerShow = false |
|
|
|
|
let aaa = { |
|
|
|
|
detail:{ |
|
|
|
|
value:[0,0] |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
let ccc = 1 |
|
|
|
|
this.bindChange(aaa,ccc) |
|
|
|
|
} |
|
|
|
|
if(index == 0){ |
|
|
|
|
this.paixu = 1 |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -741,4 +912,9 @@ |
|
|
|
|
height: 600upx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.zdyTitle{ |
|
|
|
|
font-weight: 600; |
|
|
|
|
margin: 10px 10px 0; |
|
|
|
|
display: block; |
|
|
|
|
} |
|
|
|
|
</style> |