更新打包配置
This commit is contained in:
+189
-189
@@ -1,197 +1,197 @@
|
||||
<template>
|
||||
<up-popup
|
||||
:show="show"
|
||||
:round="24"
|
||||
:closeOnClickOverlay="false"
|
||||
mode="bottom"
|
||||
>
|
||||
<view class="address-popup-view" >
|
||||
<view class="head-view">
|
||||
<text class="text-32 text-zu1 text-bold">{{headText}}</text>
|
||||
<MyBtn text="确定" @ok="onOk" v-if="!dataList.length" mh="48rpx" wd="128rpx" fz="24rpx"></MyBtn>
|
||||
<u-icon size="48rpx" name="close-circle-fill" color="#333" @click="onClose"></u-icon>
|
||||
</view>
|
||||
<scroll-view :scroll-x="true" class="address-select-view">
|
||||
<view class="address-select-view-scroll">
|
||||
<view class="select-box" @click="onSelectItrm(item,index)" v-for="(item,index) in selectList" :key="index">
|
||||
<text class="text-28 text-zu1" :style="{color:index == curSelect ? '#7934F6' : '#333',
|
||||
'white-space':'nowrap',}">{{item.name}}</text>
|
||||
<view class="select-line" v-if="index == curSelect"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</scroll-view>
|
||||
<scroll-view :scroll-y="true" class="address-bottom-list" :scroll-into-view="scrollId">
|
||||
<view class="address-data-view" v-for="(item,index) in dataList" :key="index" :id="item.zi">
|
||||
<text class="text-32 text-zu1 text-bold">{{item.zi}}</text>
|
||||
<view class="address-data-data" @click="onItem(item,xItem)" v-for="(xItem,xIndex) in item.data" :key="xIndex">
|
||||
<text class="text-32 text-zu1 ">{{xItem.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="right-zi-view" v-if="dataList.length">
|
||||
<view class="zi-box" v-for="(item,index) in dataList" @click="onMao(item.zi)" :key="index">
|
||||
<text class="text-24 text-zu1">{{item.zi}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<template>
|
||||
<up-popup
|
||||
:show="show"
|
||||
:round="24"
|
||||
:closeOnClickOverlay="false"
|
||||
mode="bottom"
|
||||
>
|
||||
<view class="address-popup-view" >
|
||||
<view class="head-view">
|
||||
<text class="text-32 text-zu1 text-bold">{{headText}}</text>
|
||||
<MyBtn text="确定" @ok="onOk" v-if="!dataList.length" mh="48rpx" wd="128rpx" fz="24rpx"></MyBtn>
|
||||
<u-icon size="48rpx" name="close-circle-fill" color="#333" @click="onClose"></u-icon>
|
||||
</view>
|
||||
<scroll-view :scroll-x="true" class="address-select-view">
|
||||
<view class="address-select-view-scroll">
|
||||
<view class="select-box" @click="onSelectItrm(item,index)" v-for="(item,index) in selectList" :key="index">
|
||||
<text class="text-28 text-zu1" :style="{color:index == curSelect ? '#7934F6' : '#333',
|
||||
'white-space':'nowrap',}">{{item.name}}</text>
|
||||
<view class="select-line" v-if="index == curSelect"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</scroll-view>
|
||||
<scroll-view :scroll-y="true" class="address-bottom-list" :scroll-into-view="scrollId">
|
||||
<view class="address-data-view" v-for="(item,index) in dataList" :key="index" :id="item.zi">
|
||||
<text class="text-32 text-zu1 text-bold">{{item.zi}}</text>
|
||||
<view class="address-data-data" @click="onItem(item,xItem)" v-for="(xItem,xIndex) in item.data" :key="xIndex">
|
||||
<text class="text-32 text-zu1 ">{{xItem.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="right-zi-view" v-if="dataList.length">
|
||||
<view class="zi-box" v-for="(item,index) in dataList" @click="onMao(item.zi)" :key="index">
|
||||
<text class="text-24 text-zu1">{{item.zi}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-popup>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Func from '/utils/func'
|
||||
import MyBtn from '@/components/common/my-btn.vue'
|
||||
export default {
|
||||
components:{MyBtn},
|
||||
data() {
|
||||
return {
|
||||
scrollId:'',
|
||||
}
|
||||
},
|
||||
props:{
|
||||
show:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
headText:{
|
||||
type:String,
|
||||
default:'请选择所在地区'
|
||||
},
|
||||
dataList:{
|
||||
type:Array,
|
||||
default:[]
|
||||
},
|
||||
selectList:{
|
||||
type:Array,
|
||||
default:[]
|
||||
},
|
||||
curSelect:{
|
||||
type:Number,
|
||||
default:0
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
onClose(){
|
||||
this.$emit('close')
|
||||
},
|
||||
onOk(){
|
||||
this.$emit('ok');
|
||||
},
|
||||
onMao(item){
|
||||
this.scrollId = item;
|
||||
},
|
||||
onSelectItrm(item,index){
|
||||
if(index != this.curSelect){
|
||||
this.$emit('select',item,index);
|
||||
}
|
||||
},
|
||||
onItem(item,xItem){
|
||||
Func.debounce(()=>this.onItemOne(item,xItem));
|
||||
},
|
||||
onItemOne(item,xItem){
|
||||
this.$emit('itemSelect',item,xItem);
|
||||
}
|
||||
}
|
||||
<script>
|
||||
import Func from '/utils/func'
|
||||
import MyBtn from '@/components/common/my-btn.vue'
|
||||
export default {
|
||||
components:{MyBtn},
|
||||
data() {
|
||||
return {
|
||||
scrollId:'',
|
||||
}
|
||||
},
|
||||
props:{
|
||||
show:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
headText:{
|
||||
type:String,
|
||||
default:'请选择所在地区'
|
||||
},
|
||||
dataList:{
|
||||
type:Array,
|
||||
default:[]
|
||||
},
|
||||
selectList:{
|
||||
type:Array,
|
||||
default:[]
|
||||
},
|
||||
curSelect:{
|
||||
type:Number,
|
||||
default:0
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
onClose(){
|
||||
this.$emit('close')
|
||||
},
|
||||
onOk(){
|
||||
this.$emit('ok');
|
||||
},
|
||||
onMao(item){
|
||||
this.scrollId = item;
|
||||
},
|
||||
onSelectItrm(item,index){
|
||||
if(index != this.curSelect){
|
||||
this.$emit('select',item,index);
|
||||
}
|
||||
},
|
||||
onItem(item,xItem){
|
||||
Func.debounce(()=>this.onItemOne(item,xItem));
|
||||
},
|
||||
onItemOne(item,xItem){
|
||||
this.$emit('itemSelect',item,xItem);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.address-popup-view{
|
||||
width:100vw;
|
||||
height:1000rpx;
|
||||
min-height:1000rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: #fff;
|
||||
border-radius: 24rpx;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
.right-zi-view{
|
||||
width:64rpx;
|
||||
max-height:600rpx;
|
||||
overflow-y: auto;
|
||||
position: absolute;
|
||||
right:32rpx;
|
||||
border-radius: 32rpx;
|
||||
padding: 32rpx 0;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: rgba(128,128,128,0.3);
|
||||
}
|
||||
.address-bottom-list{
|
||||
width:100%;
|
||||
height:calc(100% - 88rpx - 88rpx - 32rpx);
|
||||
margin-top:32rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
.address-data-view{
|
||||
width:100%;
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-bottom:1rpx solid #eee;
|
||||
.address-data-data{
|
||||
padding-top: 24rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
padding: 24rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.address-select-view{
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
min-height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
.address-select-view-scroll{
|
||||
width:100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.select-line{
|
||||
width:50rpx;
|
||||
height:8rpx;
|
||||
min-height:8rpx;
|
||||
background-color: #7934F6;
|
||||
border-radius: 4rpx;
|
||||
|
||||
}
|
||||
.select-box{
|
||||
margin-right:24rpx;
|
||||
height:56rpx;
|
||||
min-height:56rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.head-view{
|
||||
width:100vw;
|
||||
height:88rpx;
|
||||
min-height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
<style lang="scss" scoped>
|
||||
.address-popup-view{
|
||||
width:100vw;
|
||||
height:1000rpx;
|
||||
min-height:1000rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: #fff;
|
||||
border-radius: 24rpx;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
.right-zi-view{
|
||||
width:64rpx;
|
||||
max-height:600rpx;
|
||||
overflow-y: auto;
|
||||
position: absolute;
|
||||
right:32rpx;
|
||||
border-radius: 32rpx;
|
||||
padding: 32rpx 0;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: rgba(128,128,128,0.3);
|
||||
}
|
||||
.address-bottom-list{
|
||||
width:100%;
|
||||
height:calc(100% - 88rpx - 88rpx - 32rpx);
|
||||
margin-top:32rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
.address-data-view{
|
||||
width:100%;
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-bottom:1rpx solid #eee;
|
||||
.address-data-data{
|
||||
padding-top: 24rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
padding: 24rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.address-select-view{
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
min-height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
.address-select-view-scroll{
|
||||
width:100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.select-line{
|
||||
width:50rpx;
|
||||
height:8rpx;
|
||||
min-height:8rpx;
|
||||
background-color: #7934F6;
|
||||
border-radius: 4rpx;
|
||||
|
||||
}
|
||||
.select-box{
|
||||
margin-right:24rpx;
|
||||
height:56rpx;
|
||||
min-height:56rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.head-view{
|
||||
width:100vw;
|
||||
height:88rpx;
|
||||
min-height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
+152
-152
@@ -1,152 +1,152 @@
|
||||
<template>
|
||||
<view class="down-popup-view" v-if="show">
|
||||
<view class="down-panel">
|
||||
<view class="flex-r-lr mt-24">
|
||||
<view></view>
|
||||
<text class="text-zu1 text-32">{{title}}</text>
|
||||
<image src="https://cex-pub.s3.ap-southeast-1.amazonaws.com/static/new/close.png" @click.stop="onCancel" class="close-img"></image>
|
||||
</view>
|
||||
<text class="text-zu1 text-48 mt-88">{{articleTitle}}</text>
|
||||
<view class="content-text mt-48">
|
||||
<text class="text-28 text-zu1">
|
||||
{{contentText}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="bottom-btn">
|
||||
<view class="left-box left flex-c" @click.stop="onCancel">
|
||||
<text class="text-fu text-32">{{cancel}}</text>
|
||||
</view>
|
||||
<view class="left-box right flex-c" @click.stop="onOk">
|
||||
<text class="text-white text-32">{{ok}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Func from '/utils/func'
|
||||
export default {
|
||||
props:{
|
||||
show:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
title:{
|
||||
type:String,
|
||||
default:'签署合同'
|
||||
},
|
||||
articleTitle:{
|
||||
type:String,
|
||||
default:'消费型合伙人协议'
|
||||
},
|
||||
cancel:{
|
||||
type:String,
|
||||
default:'取消'
|
||||
},
|
||||
ok:{
|
||||
type:String,
|
||||
default:'去签署'
|
||||
},
|
||||
contentText:{
|
||||
type:String,
|
||||
default:`信任桥（深圳）网络科技有限公司（以下简称"甲方"或"公司"）系依据《中华人民共和国公司法》及相关法律法规，在深圳市市场监督管理局登记注册的有限责任公司（统一社会信用代码： 91440300MAD3XHDP7C），现合法存续并有效经营。
|
||||
|
||||
公司经核准的经营范围包括（但不限于）：
|
||||
(1) 全品类居民生活消费品零售；
|
||||
(2) 互联网零售及相关配套服务；
|
||||
(3) 供应链管理服务；
|
||||
(4) 电子商务平台运营；
|
||||
(5) 货物及技术进出口业务；
|
||||
(6) 国家法律法规允许的其他经营项目。
|
||||
|
||||
公司为独立企业法人，依法自主经营、自负盈亏，股东以其认缴的出资额为限对公司承担责任。
|
||||
|
||||
公司已依法取得开展主营业务所需的以下资质文件：
|
||||
(1) 《增值电信业务经营许可证》；
|
||||
(2) 《食品经营许可证》；
|
||||
(3) 《出版物经营许可证》；
|
||||
(4) 其他经营相关资质。`
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
onCancel(){
|
||||
|
||||
this.$emit('cancel');
|
||||
},
|
||||
onOk(){
|
||||
Func.debounce(this.dOk())
|
||||
},
|
||||
dOk(){
|
||||
this.$emit('ok');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.down-popup-view{
|
||||
width:100%;
|
||||
height:100vh;
|
||||
min-height:100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: rgba(0,0,0,0.3);
|
||||
position: fixed;
|
||||
left:0;
|
||||
top:0;
|
||||
z-index: 10000;
|
||||
.down-panel{
|
||||
width:100%;
|
||||
height:764rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
position: absolute;
|
||||
bottom:0;
|
||||
border-radius: 32rpx 32rpx 0 0 ;
|
||||
.content-text{
|
||||
flex:1;
|
||||
width:100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.bottom-btn{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
margin-top:40rpx;
|
||||
margin-bottom:80rpx;
|
||||
.left-box{
|
||||
width:48%;
|
||||
height:100%;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.left{
|
||||
border:1rpx solid #eaeaea;
|
||||
}
|
||||
.right{
|
||||
background: linear-gradient( 270deg, #B164FB 0%, #7934F6 100%);
|
||||
}
|
||||
}
|
||||
.close-img{
|
||||
width:44rpx;
|
||||
height:44rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
<template>
|
||||
<view class="down-popup-view" v-if="show">
|
||||
<view class="down-panel">
|
||||
<view class="flex-r-lr mt-24">
|
||||
<view></view>
|
||||
<text class="text-zu1 text-32">{{title}}</text>
|
||||
<image src="https://cex-pub.s3.ap-southeast-1.amazonaws.com/static/new/close.png" @click.stop="onCancel" class="close-img"></image>
|
||||
</view>
|
||||
<text class="text-zu1 text-48 mt-88">{{articleTitle}}</text>
|
||||
<view class="content-text mt-48">
|
||||
<text class="text-28 text-zu1">
|
||||
{{contentText}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="bottom-btn">
|
||||
<view class="left-box left flex-c" @click.stop="onCancel">
|
||||
<text class="text-fu text-32">{{cancel}}</text>
|
||||
</view>
|
||||
<view class="left-box right flex-c" @click.stop="onOk">
|
||||
<text class="text-white text-32">{{ok}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Func from '/utils/func'
|
||||
export default {
|
||||
props:{
|
||||
show:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
title:{
|
||||
type:String,
|
||||
default:'签署合同'
|
||||
},
|
||||
articleTitle:{
|
||||
type:String,
|
||||
default:'消费型合伙人协议'
|
||||
},
|
||||
cancel:{
|
||||
type:String,
|
||||
default:'取消'
|
||||
},
|
||||
ok:{
|
||||
type:String,
|
||||
default:'去签署'
|
||||
},
|
||||
contentText:{
|
||||
type:String,
|
||||
default:`信任桥（深圳）网络科技有限公司（以下简称"甲方"或"公司"）系依据《中华人民共和国公司法》及相关法律法规，在深圳市市场监督管理局登记注册的有限责任公司（统一社会信用代码： 91440300MAD3XHDP7C），现合法存续并有效经营。
|
||||
|
||||
公司经核准的经营范围包括（但不限于）：
|
||||
(1) 全品类居民生活消费品零售；
|
||||
(2) 互联网零售及相关配套服务；
|
||||
(3) 供应链管理服务；
|
||||
(4) 电子商务平台运营；
|
||||
(5) 货物及技术进出口业务；
|
||||
(6) 国家法律法规允许的其他经营项目。
|
||||
|
||||
公司为独立企业法人，依法自主经营、自负盈亏，股东以其认缴的出资额为限对公司承担责任。
|
||||
|
||||
公司已依法取得开展主营业务所需的以下资质文件：
|
||||
(1) 《增值电信业务经营许可证》；
|
||||
(2) 《食品经营许可证》；
|
||||
(3) 《出版物经营许可证》；
|
||||
(4) 其他经营相关资质。`
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
onCancel(){
|
||||
|
||||
this.$emit('cancel');
|
||||
},
|
||||
onOk(){
|
||||
Func.debounce(this.dOk())
|
||||
},
|
||||
dOk(){
|
||||
this.$emit('ok');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.down-popup-view{
|
||||
width:100%;
|
||||
height:100vh;
|
||||
min-height:100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: rgba(0,0,0,0.3);
|
||||
position: fixed;
|
||||
left:0;
|
||||
top:0;
|
||||
z-index: 10000;
|
||||
.down-panel{
|
||||
width:100%;
|
||||
height:764rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
position: absolute;
|
||||
bottom:0;
|
||||
border-radius: 32rpx 32rpx 0 0 ;
|
||||
.content-text{
|
||||
flex:1;
|
||||
width:100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.bottom-btn{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
margin-top:40rpx;
|
||||
margin-bottom:80rpx;
|
||||
.left-box{
|
||||
width:48%;
|
||||
height:100%;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.left{
|
||||
border:1rpx solid #eaeaea;
|
||||
}
|
||||
.right{
|
||||
background: linear-gradient( 270deg, #B164FB 0%, #7934F6 100%);
|
||||
}
|
||||
}
|
||||
.close-img{
|
||||
width:44rpx;
|
||||
height:44rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
+21
-21
@@ -1,21 +1,21 @@
|
||||
//取手机设置
|
||||
const systemInfo = uni.getSystemInfoSync();
|
||||
export const uniPlatform = systemInfo.uniPlatform;
|
||||
|
||||
//屏幕长高 顶部 底部安全区 型号 是否为ios 以ios11模拟器开发暂取5个 安卓和其它ios机型有需要以后在说
|
||||
export const screen = {
|
||||
width:systemInfo.safeArea.width,
|
||||
height:systemInfo.safeArea.height,
|
||||
top:systemInfo.statusBarHeight ? systemInfo.statusBarHeight : systemInfo.safeAreaInsets.top,
|
||||
bottom:Math.abs(systemInfo.safeAreaInsets.bottom),
|
||||
platform:systemInfo.platform,
|
||||
isIos:systemInfo.platform === 'ios' ? true : false
|
||||
};
|
||||
|
||||
//网络状态 当前网络状态 是否有网 是否支持下载 4 5g wifi 支持
|
||||
export const network = {
|
||||
curNet:'',
|
||||
isNone:'',
|
||||
isDownload:''
|
||||
};
|
||||
export const s3 = 'https://cex-pub.s3.ap-southeast-1.amazonaws.com/static/';
|
||||
//取手机设置
|
||||
const systemInfo = uni.getSystemInfoSync();
|
||||
export const uniPlatform = systemInfo.uniPlatform;
|
||||
|
||||
//屏幕长高 顶部 底部安全区 型号 是否为ios 以ios11模拟器开发暂取5个 安卓和其它ios机型有需要以后在说
|
||||
export const screen = {
|
||||
width:systemInfo.safeArea.width,
|
||||
height:systemInfo.safeArea.height,
|
||||
top:systemInfo.statusBarHeight ? systemInfo.statusBarHeight : systemInfo.safeAreaInsets.top,
|
||||
bottom:Math.abs(systemInfo.safeAreaInsets.bottom),
|
||||
platform:systemInfo.platform,
|
||||
isIos:systemInfo.platform === 'ios' ? true : false
|
||||
};
|
||||
|
||||
//网络状态 当前网络状态 是否有网 是否支持下载 4 5g wifi 支持
|
||||
export const network = {
|
||||
curNet:'',
|
||||
isNone:'',
|
||||
isDownload:''
|
||||
};
|
||||
export const s3 = 'https://cex-pub.s3.ap-southeast-1.amazonaws.com/static/';
|
||||
|
||||
+144
-144
@@ -1,144 +1,144 @@
|
||||
<template>
|
||||
<view class="header" :style="{backgroundColor:bgColor,height:height,borderBottomWidth:borderWidth}">
|
||||
<view class="header-left">
|
||||
<view class="header-left" v-if="isBack" @click="goback">
|
||||
<u-icon :size="fontSize" name="arrow-left" :color="color"></u-icon>
|
||||
</view>
|
||||
<slot name="left" v-else>
|
||||
</slot>
|
||||
</view>
|
||||
<view class="header-mid">
|
||||
<slot name="mid" v-if="isMid">
|
||||
|
||||
</slot>
|
||||
<text v-else :style="{fontSize:fontSize,fontWeight:fontWeight,color:color}">{{title}}</text>
|
||||
</view>
|
||||
<view class="header-right">
|
||||
<slot name="right">
|
||||
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 共用头部
|
||||
* title:中间标题 默认空
|
||||
* bgColor:背景色 默认#fff
|
||||
* height:高度 默认88rpx
|
||||
* isBack:是否打开左方返回 默认打开
|
||||
* borderWidth:下划线 默认无
|
||||
* fontSize:返回箭头 中间字体大小 默认30rpx
|
||||
* fontWeight:中间字体字重 默认加粗
|
||||
* color:返回箭头 中间字体颜色 默认#333
|
||||
* slot->left:左边插槽 开启后要将isBack传false
|
||||
* slot->right:右边插槽
|
||||
* isReturn 抛出返回方法
|
||||
*/
|
||||
export default {
|
||||
props:{
|
||||
black:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isMid:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
title:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
bgColor:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
},
|
||||
height:{
|
||||
type:String,
|
||||
default:'88rpx'
|
||||
},
|
||||
isBack:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
borderWidth:{
|
||||
type:String,
|
||||
default:'0'
|
||||
},
|
||||
fontSize:{
|
||||
type:String,
|
||||
default:'36rpx'
|
||||
},
|
||||
fontWeight:{
|
||||
type:String,
|
||||
default:'bold'
|
||||
},
|
||||
color:{
|
||||
type:String,
|
||||
default:'#333'
|
||||
},
|
||||
isReturn:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
goback(){
|
||||
if(this.isReturn){
|
||||
this.$emit('return');
|
||||
}else{
|
||||
console.log('2312313')
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.header{
|
||||
width:100vw;
|
||||
height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-color: #eee;
|
||||
font-weight: bold;
|
||||
padding: 0 30rpx;
|
||||
font-size: 30rpx;
|
||||
box-sizing: border-box;
|
||||
.header-left{
|
||||
min-width:120rpx;
|
||||
height:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.left-img{
|
||||
width:18rpx;
|
||||
height:32rpx;
|
||||
}
|
||||
}
|
||||
.header-right{
|
||||
min-width:120rpx;
|
||||
height:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
position: relative;
|
||||
}
|
||||
.header-mid{
|
||||
flex:1;
|
||||
height:100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
<template>
|
||||
<view class="header" :style="{backgroundColor:bgColor,height:height,borderBottomWidth:borderWidth}">
|
||||
<view class="header-left">
|
||||
<view class="header-left" v-if="isBack" @click="goback">
|
||||
<u-icon :size="fontSize" name="arrow-left" :color="color"></u-icon>
|
||||
</view>
|
||||
<slot name="left" v-else>
|
||||
</slot>
|
||||
</view>
|
||||
<view class="header-mid">
|
||||
<slot name="mid" v-if="isMid">
|
||||
|
||||
</slot>
|
||||
<text v-else :style="{fontSize:fontSize,fontWeight:fontWeight,color:color}">{{title}}</text>
|
||||
</view>
|
||||
<view class="header-right">
|
||||
<slot name="right">
|
||||
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 共用头部
|
||||
* title:中间标题 默认空
|
||||
* bgColor:背景色 默认#fff
|
||||
* height:高度 默认88rpx
|
||||
* isBack:是否打开左方返回 默认打开
|
||||
* borderWidth:下划线 默认无
|
||||
* fontSize:返回箭头 中间字体大小 默认30rpx
|
||||
* fontWeight:中间字体字重 默认加粗
|
||||
* color:返回箭头 中间字体颜色 默认#333
|
||||
* slot->left:左边插槽 开启后要将isBack传false
|
||||
* slot->right:右边插槽
|
||||
* isReturn 抛出返回方法
|
||||
*/
|
||||
export default {
|
||||
props:{
|
||||
black:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isMid:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
title:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
bgColor:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
},
|
||||
height:{
|
||||
type:String,
|
||||
default:'88rpx'
|
||||
},
|
||||
isBack:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
borderWidth:{
|
||||
type:String,
|
||||
default:'0'
|
||||
},
|
||||
fontSize:{
|
||||
type:String,
|
||||
default:'36rpx'
|
||||
},
|
||||
fontWeight:{
|
||||
type:String,
|
||||
default:'bold'
|
||||
},
|
||||
color:{
|
||||
type:String,
|
||||
default:'#333'
|
||||
},
|
||||
isReturn:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
goback(){
|
||||
if(this.isReturn){
|
||||
this.$emit('return');
|
||||
}else{
|
||||
console.log('2312313')
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.header{
|
||||
width:100vw;
|
||||
height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-color: #eee;
|
||||
font-weight: bold;
|
||||
padding: 0 30rpx;
|
||||
font-size: 30rpx;
|
||||
box-sizing: border-box;
|
||||
.header-left{
|
||||
min-width:120rpx;
|
||||
height:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.left-img{
|
||||
width:18rpx;
|
||||
height:32rpx;
|
||||
}
|
||||
}
|
||||
.header-right{
|
||||
min-width:120rpx;
|
||||
height:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
position: relative;
|
||||
}
|
||||
.header-mid{
|
||||
flex:1;
|
||||
height:100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -1,99 +1,99 @@
|
||||
<template>
|
||||
<up-popup
|
||||
:show="show"
|
||||
:round="24"
|
||||
:closeOnClickOverlay="false"
|
||||
mode="center"
|
||||
>
|
||||
<view class="home-popup-view" v-if="dataObj">
|
||||
<view class="home-popup-head">
|
||||
<image src="https://cex-pub.s3.ap-southeast-1.amazonaws.com/static/new/logo.png" class="logo-img"></image>
|
||||
<text class="text-28 text-zu" style="margin-left:14rpx">信任桥</text>
|
||||
<text class="text-28 text-fu" style="margin-left:14rpx">分享商品</text>
|
||||
</view>
|
||||
<view class="home-popup-mid">
|
||||
<image :src="dataObj.goodsGraph.split(',')[0]"></image>
|
||||
</view>
|
||||
<text class="text-32 text-zi text-bold" style="margin-top:16rpx">￥<text class="text-44">{{dataObj.minPrice}}</text>
|
||||
</text>
|
||||
<text class="text-32 text-zu1 text-overflow1" style="margin-top:16rpx">{{dataObj.name}}</text>
|
||||
<MyBtn text="查看详情" wd="100%" br="44rpx" @ok="onOk" style="margin-top:24rpx"></MyBtn>
|
||||
</view>
|
||||
</up-popup>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Func from '/utils/func'
|
||||
import MyBtn from '@/components/common/my-btn.vue'
|
||||
export default {
|
||||
components:{MyBtn},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
props:{
|
||||
show:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
dataObj:{
|
||||
type:Object,
|
||||
default:()=>{}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
onOk(){
|
||||
this.$emit('jumpShop');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.home-popup-view{
|
||||
width:620rpx;
|
||||
height:1000rpx;
|
||||
min-height:1000rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
border-radius: 24rpx;
|
||||
position: relative;
|
||||
padding: 32rpx;
|
||||
box-sizing: border-box;
|
||||
.home-popup-mid{
|
||||
width:100%;
|
||||
height:540rpx;
|
||||
min-height:540rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 16rpx;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
margin-top:28rpx;
|
||||
image{
|
||||
width:100%;
|
||||
height:100%
|
||||
}
|
||||
}
|
||||
.home-popup-head{
|
||||
width:100%;
|
||||
height:64rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
min-height:64rpx;
|
||||
.logo-img{
|
||||
width:64rpx;
|
||||
height:64rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
<template>
|
||||
<up-popup
|
||||
:show="show"
|
||||
:round="24"
|
||||
:closeOnClickOverlay="false"
|
||||
mode="center"
|
||||
>
|
||||
<view class="home-popup-view" v-if="dataObj">
|
||||
<view class="home-popup-head">
|
||||
<image src="https://cex-pub.s3.ap-southeast-1.amazonaws.com/static/new/logo.png" class="logo-img"></image>
|
||||
<text class="text-28 text-zu" style="margin-left:14rpx">信任桥</text>
|
||||
<text class="text-28 text-fu" style="margin-left:14rpx">分享商品</text>
|
||||
</view>
|
||||
<view class="home-popup-mid">
|
||||
<image :src="dataObj.goodsGraph.split(',')[0]"></image>
|
||||
</view>
|
||||
<text class="text-32 text-zi text-bold" style="margin-top:16rpx">￥<text class="text-44">{{dataObj.minPrice}}</text>
|
||||
</text>
|
||||
<text class="text-32 text-zu1 text-overflow1" style="margin-top:16rpx">{{dataObj.name}}</text>
|
||||
<MyBtn text="查看详情" wd="100%" br="44rpx" @ok="onOk" style="margin-top:24rpx"></MyBtn>
|
||||
</view>
|
||||
</up-popup>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Func from '/utils/func'
|
||||
import MyBtn from '@/components/common/my-btn.vue'
|
||||
export default {
|
||||
components:{MyBtn},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
props:{
|
||||
show:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
dataObj:{
|
||||
type:Object,
|
||||
default:()=>{}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
onOk(){
|
||||
this.$emit('jumpShop');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.home-popup-view{
|
||||
width:620rpx;
|
||||
height:1000rpx;
|
||||
min-height:1000rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
border-radius: 24rpx;
|
||||
position: relative;
|
||||
padding: 32rpx;
|
||||
box-sizing: border-box;
|
||||
.home-popup-mid{
|
||||
width:100%;
|
||||
height:540rpx;
|
||||
min-height:540rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 16rpx;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
margin-top:28rpx;
|
||||
image{
|
||||
width:100%;
|
||||
height:100%
|
||||
}
|
||||
}
|
||||
.home-popup-head{
|
||||
width:100%;
|
||||
height:64rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
min-height:64rpx;
|
||||
.logo-img{
|
||||
width:64rpx;
|
||||
height:64rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
@@ -1,67 +1,67 @@
|
||||
<template>
|
||||
<view class="my-btn" @click.stop="onClick"
|
||||
:style="{
|
||||
'border-radius':br,'min-height':mh,'background':bg,width:wd,'height':mh
|
||||
}">
|
||||
<text :style="{
|
||||
color:color,'font-size':fz,'font-weight':fw
|
||||
}">{{text}}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
text:{
|
||||
type:String,
|
||||
default:'确认'
|
||||
},
|
||||
wd:{
|
||||
type:String,
|
||||
default:'100%'
|
||||
},
|
||||
mh:{
|
||||
type:String,
|
||||
default:'88rpx'
|
||||
},
|
||||
bg:{
|
||||
type:String,
|
||||
default:'#7934F6'
|
||||
},
|
||||
br:{
|
||||
type:String,
|
||||
default:'16rpx'
|
||||
},
|
||||
color:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
},
|
||||
fz:{
|
||||
type:String,
|
||||
default:'32rpx'
|
||||
},
|
||||
fw:{
|
||||
type:String,
|
||||
default:'500'
|
||||
}
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
onClick(){
|
||||
this.$emit('ok');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.my-btn{
|
||||
width:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
<template>
|
||||
<view class="my-btn" @click.stop="onClick"
|
||||
:style="{
|
||||
'border-radius':br,'min-height':mh,'background':bg,width:wd,'height':mh
|
||||
}">
|
||||
<text :style="{
|
||||
color:color,'font-size':fz,'font-weight':fw
|
||||
}">{{text}}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
text:{
|
||||
type:String,
|
||||
default:'确认'
|
||||
},
|
||||
wd:{
|
||||
type:String,
|
||||
default:'100%'
|
||||
},
|
||||
mh:{
|
||||
type:String,
|
||||
default:'88rpx'
|
||||
},
|
||||
bg:{
|
||||
type:String,
|
||||
default:'#7934F6'
|
||||
},
|
||||
br:{
|
||||
type:String,
|
||||
default:'16rpx'
|
||||
},
|
||||
color:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
},
|
||||
fz:{
|
||||
type:String,
|
||||
default:'32rpx'
|
||||
},
|
||||
fw:{
|
||||
type:String,
|
||||
default:'500'
|
||||
}
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
onClick(){
|
||||
this.$emit('ok');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.my-btn{
|
||||
width:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
+150
-150
@@ -1,150 +1,150 @@
|
||||
<template>
|
||||
<view class="header" :style="{backgroundColor:bgColor,height:height,borderBottomWidth:borderWidth}">
|
||||
<view class="header-left">
|
||||
<view class="header-left" v-if="isBack" @click="goback">
|
||||
<u-icon :size="fontSize" name="arrow-left" :color="color"></u-icon>
|
||||
</view>
|
||||
<slot name="left" v-else>
|
||||
</slot>
|
||||
</view>
|
||||
<view class="header-mid">
|
||||
<slot name="mid" v-if="isMid">
|
||||
|
||||
</slot>
|
||||
<text v-else :style="{fontSize:fontSize,fontWeight:fontWeight,color:color}">{{title}}</text>
|
||||
</view>
|
||||
<view class="header-right">
|
||||
<slot name="right">
|
||||
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 共用头部
|
||||
* title:中间标题 默认空
|
||||
* bgColor:背景色 默认#fff
|
||||
* height:高度 默认88rpx
|
||||
* isBack:是否打开左方返回 默认打开
|
||||
* borderWidth:下划线 默认无
|
||||
* fontSize:返回箭头 中间字体大小 默认30rpx
|
||||
* fontWeight:中间字体字重 默认加粗
|
||||
* color:返回箭头 中间字体颜色 默认#333
|
||||
* slot->left:左边插槽 开启后要将isBack传false
|
||||
* slot->right:右边插槽
|
||||
* isReturn 抛出返回方法
|
||||
*/
|
||||
export default {
|
||||
props:{
|
||||
black:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isMid:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
title:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
bgColor:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
},
|
||||
height:{
|
||||
type:String,
|
||||
default:'88rpx'
|
||||
},
|
||||
isBack:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
borderWidth:{
|
||||
type:String,
|
||||
default:'0'
|
||||
},
|
||||
fontSize:{
|
||||
type:String,
|
||||
default:'36rpx'
|
||||
},
|
||||
fontWeight:{
|
||||
type:String,
|
||||
default:'bold'
|
||||
},
|
||||
color:{
|
||||
type:String,
|
||||
default:'#333'
|
||||
},
|
||||
isReturn:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
goback(){
|
||||
if(this.isReturn){
|
||||
this.$emit('return');
|
||||
}else{
|
||||
console.log('2312313')
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.header{
|
||||
width:100vw;
|
||||
height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom-style: solid;
|
||||
font-weight: bold;
|
||||
padding: 0 30rpx;
|
||||
font-size: 30rpx;
|
||||
background-color: transparent;
|
||||
box-sizing: border-box;
|
||||
.header-left{
|
||||
width:48rpx;
|
||||
height: 48rpx;
|
||||
display: flex;
|
||||
background: rgba(0,0,0,0.2);
|
||||
border-radius: 8rpx;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
.left-img{
|
||||
width:18rpx;
|
||||
height:30rpx;
|
||||
}
|
||||
}
|
||||
.header-right{
|
||||
min-width:240rpx;
|
||||
height:56rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
position: relative;
|
||||
}
|
||||
.header-mid{
|
||||
color: #fff;
|
||||
flex:1;
|
||||
height:100%;
|
||||
margin-left: 32rpx;
|
||||
font-size: 36rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
<template>
|
||||
<view class="header" :style="{backgroundColor:bgColor,height:height,borderBottomWidth:borderWidth}">
|
||||
<view class="header-left">
|
||||
<view class="header-left" v-if="isBack" @click="goback">
|
||||
<u-icon :size="fontSize" name="arrow-left" :color="color"></u-icon>
|
||||
</view>
|
||||
<slot name="left" v-else>
|
||||
</slot>
|
||||
</view>
|
||||
<view class="header-mid">
|
||||
<slot name="mid" v-if="isMid">
|
||||
|
||||
</slot>
|
||||
<text v-else :style="{fontSize:fontSize,fontWeight:fontWeight,color:color}">{{title}}</text>
|
||||
</view>
|
||||
<view class="header-right">
|
||||
<slot name="right">
|
||||
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 共用头部
|
||||
* title:中间标题 默认空
|
||||
* bgColor:背景色 默认#fff
|
||||
* height:高度 默认88rpx
|
||||
* isBack:是否打开左方返回 默认打开
|
||||
* borderWidth:下划线 默认无
|
||||
* fontSize:返回箭头 中间字体大小 默认30rpx
|
||||
* fontWeight:中间字体字重 默认加粗
|
||||
* color:返回箭头 中间字体颜色 默认#333
|
||||
* slot->left:左边插槽 开启后要将isBack传false
|
||||
* slot->right:右边插槽
|
||||
* isReturn 抛出返回方法
|
||||
*/
|
||||
export default {
|
||||
props:{
|
||||
black:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isMid:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
title:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
bgColor:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
},
|
||||
height:{
|
||||
type:String,
|
||||
default:'88rpx'
|
||||
},
|
||||
isBack:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
borderWidth:{
|
||||
type:String,
|
||||
default:'0'
|
||||
},
|
||||
fontSize:{
|
||||
type:String,
|
||||
default:'36rpx'
|
||||
},
|
||||
fontWeight:{
|
||||
type:String,
|
||||
default:'bold'
|
||||
},
|
||||
color:{
|
||||
type:String,
|
||||
default:'#333'
|
||||
},
|
||||
isReturn:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
methods: {
|
||||
goback(){
|
||||
if(this.isReturn){
|
||||
this.$emit('return');
|
||||
}else{
|
||||
console.log('2312313')
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.header{
|
||||
width:100vw;
|
||||
height:88rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom-style: solid;
|
||||
font-weight: bold;
|
||||
padding: 0 30rpx;
|
||||
font-size: 30rpx;
|
||||
background-color: transparent;
|
||||
box-sizing: border-box;
|
||||
.header-left{
|
||||
width:48rpx;
|
||||
height: 48rpx;
|
||||
display: flex;
|
||||
background: rgba(0,0,0,0.2);
|
||||
border-radius: 8rpx;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
.left-img{
|
||||
width:18rpx;
|
||||
height:30rpx;
|
||||
}
|
||||
}
|
||||
.header-right{
|
||||
min-width:240rpx;
|
||||
height:56rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
position: relative;
|
||||
}
|
||||
.header-mid{
|
||||
color: #fff;
|
||||
flex:1;
|
||||
height:100%;
|
||||
margin-left: 32rpx;
|
||||
font-size: 36rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -1,35 +1,35 @@
|
||||
<template>
|
||||
<view :style="{ height: safeHeight + 'px',width:width + 'px',backgroundColor:bgColor}"
|
||||
class="top-view">
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {screen} from './global.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
safeHeight:screen.top,
|
||||
width:screen.width
|
||||
}
|
||||
},
|
||||
props: {
|
||||
bgColor:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
}
|
||||
},
|
||||
onShow(){
|
||||
// safeHeight:screen.top,
|
||||
// width:screen.width,
|
||||
},
|
||||
mounted(){
|
||||
this.width = screen.width;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.top-view{
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view :style="{ height: safeHeight + 'px',width:width + 'px',backgroundColor:bgColor}"
|
||||
class="top-view">
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {screen} from './global.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
safeHeight:screen.top,
|
||||
width:screen.width
|
||||
}
|
||||
},
|
||||
props: {
|
||||
bgColor:{
|
||||
type:String,
|
||||
default:'#fff'
|
||||
}
|
||||
},
|
||||
onShow(){
|
||||
// safeHeight:screen.top,
|
||||
// width:screen.width,
|
||||
},
|
||||
mounted(){
|
||||
this.width = screen.width;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.top-view{
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user