18 changed files with 2043 additions and 2138 deletions
@ -0,0 +1,117 @@
|
||||
<script> |
||||
export default { |
||||
name: "fomItem", |
||||
props: { |
||||
data: { |
||||
type: Object |
||||
}, |
||||
name: { |
||||
type: String |
||||
}, |
||||
type: { |
||||
type: String, |
||||
default: 'media' |
||||
}, |
||||
isShow: { |
||||
type: Boolean, |
||||
default: false |
||||
}, |
||||
optionName: { |
||||
type: String, |
||||
default: 'default' |
||||
} |
||||
}, |
||||
data() { |
||||
return { |
||||
imageUrl: '', |
||||
imageShow: false, |
||||
} |
||||
}, |
||||
methods: { |
||||
showBigImage(imgUrl) { |
||||
this.imageUrl = imgUrl; |
||||
this.imageShow = true; |
||||
}, |
||||
getString(value) { |
||||
let typeStr = typeof value; |
||||
if (typeStr === 'string') { |
||||
return value; |
||||
} else if (typeStr === 'object' || typeStr === 'array') { |
||||
return value.join(','); |
||||
} |
||||
}, |
||||
getShowStatus(){ |
||||
if(!this.isShow){ |
||||
if(this.type === 'media' || this.type === 'text'){ |
||||
return (Object.keys(this.data).length>0); |
||||
}else{ |
||||
return (this.data.value || this.data.option || this.data.remark || (typeof this.data.upload === 'object' && Object.keys(this.data.upload).length > 0)) |
||||
} |
||||
}else{ |
||||
return true; |
||||
} |
||||
|
||||
}, |
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<template> |
||||
<view class="content-item service-end" v-if="getShowStatus()"> |
||||
<view class="item-title"> |
||||
<view class="title row" |
||||
style="position:relative;justify-content: flex-start;width:100%;top:0;left:0;margin-bottom:30rpx;"> |
||||
<view class="value col" style="position: relative;text-align: left;"> |
||||
|
||||
<!-- <u-text text="协议内容" size="38" color="#191919"></u-text>--> |
||||
<view class="" style="position: relative;display:inline-block;"> |
||||
<view style="color:#191919;font-size:32rpx;display:inline-block;position: relative;z-index: 2;"> |
||||
{{ name }}： |
||||
</view> |
||||
<view class="background" |
||||
style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="item-content" v-if="type !== 'text'"> |
||||
<slot name="option"> |
||||
<view v-if="type !== 'media'"> |
||||
{{ getString(optionName !== 'value' ? data.option:(data.value?data.value +'次':'')) }} |
||||
</view> |
||||
</slot> |
||||
<slot name="remark"> |
||||
<view v-if="type !== 'media'"> |
||||
{{ data.remark }} |
||||
</view> |
||||
</slot> |
||||
<slot name="media"> |
||||
<view class="row"> |
||||
<view class="col-4" v-for="(item,index) in (this.type === 'media')?data:data.upload"> |
||||
<view class="item-image" v-if="item.type === 'image'"> |
||||
<u-image @click="showBigImage(item.url)" :src="item.url" mode="widthFix" width="100%"></u-image> |
||||
</view> |
||||
<view class="item-video" v-else> |
||||
<video mode="aspectFill" :src="item.url" |
||||
style="width:100%;height:200rpx;border-radius: 16rpx;border:2rpx solid #262626;"></video> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</slot> |
||||
</view> |
||||
<view class="item-content" v-else> |
||||
<view class=""> |
||||
{{data}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<u-overlay :show="imageShow" @click="imageShow = false"> |
||||
<view class="" style="display:flex;align-items: center;justify-content:center;width:100%;height:100vh;"> |
||||
<u-image mode="widthFix" :src="imageUrl" height="auto" width="100vw"></u-image> |
||||
</view> |
||||
</u-overlay> |
||||
</template> |
||||
|
||||
<style scoped lang="scss"> |
||||
|
||||
</style> |
||||
@ -0,0 +1,27 @@
|
||||
<template> |
||||
<view class="" style="padding:26rpx;border-radius: 20rpx;background-color:#fff;box-shadow:0rpx 0rpx 30rpx #dfdfdf"> |
||||
<slot></slot> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
/** |
||||
* 卡片 |
||||
* @description |
||||
* |
||||
* @property {String} title 显示的文字 |
||||
*/ |
||||
export default { |
||||
name: 'mz-card', |
||||
methods: { |
||||
|
||||
}, |
||||
mounted() { |
||||
|
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
|
||||
</style> |
||||
@ -0,0 +1,83 @@
|
||||
{ |
||||
"id": "mz-card", |
||||
"displayName": "mz-card 卡片", |
||||
"version": "1.0.1", |
||||
"description": "mz-card", |
||||
"keywords": [ |
||||
"卡片" |
||||
], |
||||
"repository": "", |
||||
"engines": { |
||||
"HBuilderX": "^3.1.0" |
||||
}, |
||||
"dcloudext": { |
||||
"type": "component-vue", |
||||
"sale": { |
||||
"regular": { |
||||
"price": "0.00" |
||||
}, |
||||
"sourcecode": { |
||||
"price": "0.00" |
||||
} |
||||
}, |
||||
"contact": { |
||||
"qq": "" |
||||
}, |
||||
"declaration": { |
||||
"ads": "无", |
||||
"data": "插件不采集任何数据", |
||||
"permissions": "无" |
||||
}, |
||||
"npmurl": "" |
||||
}, |
||||
"uni_modules": { |
||||
"dependencies": [ |
||||
|
||||
], |
||||
"encrypt": [], |
||||
"platforms": { |
||||
"cloud": { |
||||
"tcb": "y", |
||||
"aliyun": "y" |
||||
}, |
||||
"client": { |
||||
"Vue": { |
||||
"vue2": "y", |
||||
"vue3": "y" |
||||
}, |
||||
"App": { |
||||
"app-vue": "y", |
||||
"app-nvue": "y" |
||||
}, |
||||
"H5-mobile": { |
||||
"Safari": "y", |
||||
"Android Browser": "y", |
||||
"微信浏览器(Android)": "y", |
||||
"QQ浏览器(Android)": "y" |
||||
}, |
||||
"H5-pc": { |
||||
"Chrome": "y", |
||||
"IE": "y", |
||||
"Edge": "y", |
||||
"Firefox": "y", |
||||
"Safari": "y" |
||||
}, |
||||
"小程序": { |
||||
"微信": "y", |
||||
"阿里": "y", |
||||
"百度": "y", |
||||
"字节跳动": "y", |
||||
"QQ": "y", |
||||
"钉钉": "u", |
||||
"快手": "u", |
||||
"飞书": "u", |
||||
"京东": "u" |
||||
}, |
||||
"快应用": { |
||||
"华为": "u", |
||||
"联盟": "u" |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
Loading…
Reference in new issue