chore: 修改preview ；增加tag插槽 ；修改标题样式
This commit is contained in:
Hefeng
@ -1,213 +1,153 @@
|
||||
<!--本文件由FirstUI授权予新疆天衡创新研究院有限公司（手机号：18 6 14 072 5 4 9，身份证尾号：5A07X5）专用，请尊重知识产权，勿私下传播，违者追究法律责任。-->
|
||||
<template>
|
||||
<view class="fui-preview__wrap" :class="{'fui-preview__unlined':!isBorder,'fui-preview__background':!background}"
|
||||
:style="{'border-top-color':borderColor,'border-bottom-color':borderColor,marginTop:marginTop+'rpx',marginBottom:marginBottom+'rpx',background:background}">
|
||||
<view class="fui-preview__hd" :style="{paddingLeft:padding+'rpx',paddingRight:padding+'rpx'}"
|
||||
v-if="pvd[label] || pvd[value]">
|
||||
<view class="fui-preview__item">
|
||||
<text class="fui-preview__label" :class="{'fui-preview__gray':!labelColor}"
|
||||
:style="{color:labelColor,fontSize:hdLabelSize+'rpx',width:hdLabelWidth>0?hdLabelWidth+'rpx':'auto',marginRight:labelRight+'rpx'}">{{pvd[label] || ''}}</text>
|
||||
<text class="fui-preview__value-hd" :class="{'fui-preview__color':!hdValColor}"
|
||||
:style="{color:hdValColor,fontSize:hdValSize+'rpx',textAlign:bdAlign}">{{pvd[value] || ''}}</text>
|
||||
</view>
|
||||
<view :style="{background:borderColor,left:hdLeft+'rpx',right:hdRight+'rpx'}" class="fui-preview__border"
|
||||
:class="{'fui-preview__border-color':!borderColor}"></view>
|
||||
</view>
|
||||
<view class="fui-preview__bd" v-if="pvd[list] && pvd[list].length>0"
|
||||
:style="{paddingLeft:padding+'rpx',paddingRight:padding+'rpx'}">
|
||||
<view class="fui-preview__item" v-for="(item,index) in pvd[list]" :key="index">
|
||||
<text class="fui-preview__label"
|
||||
:class="[!labelColor && !item[lColor]?'fui-preview__gray':'','fui-preview__label-'+labelAlign]"
|
||||
:style="{color:item[lColor] || labelColor,fontSize:bdSize+'rpx',width:labelWidth>0?labelWidth+'rpx':'auto',marginRight:labelRight+'rpx'}">{{item[label]}}</text>
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<text class="fui-preview__value" :class="{'fui-preview__color':!bdColor && !item[valueColor]}"
|
||||
:style="{color:item[valueColor] || bdColor,fontSize:bdSize+'rpx',textAlign:bdAlign}"
|
||||
@tap="itemClick(index)">{{item[value]}}</text>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<view class="fui-preview__value-wrap">
|
||||
<text class="fui-preview__value" :class="{'fui-preview__color':!bdColor && !item[valueColor]}"
|
||||
:style="{color:item[valueColor] || bdColor,fontSize:bdSize+'rpx',textAlign:bdAlign}"
|
||||
@tap="itemClick(index)">{{item[value]}}</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
<slot></slot>
|
||||
<view class="fui-preview__ft" :style="{'border-top-color':borderColor}"
|
||||
v-if="pvd[buttons] && pvd[buttons].length>0">
|
||||
<view :style="{'border-right-color':idx!==pvd[buttons].length-1?borderColor : 'transparent'}"
|
||||
:class="[highlight?'fui-preview__hover-weex':'',idx!==pvd[buttons].length-1?'fui-preview__btn-def':'fui-preview__btn']"
|
||||
:hover-class="highlight?'fui-preview_hover':''" :hover-stay-time="150" v-for="(btn,idx) in pvd[buttons]"
|
||||
:key="idx" @tap="handleClick(idx)">
|
||||
<text :style="{fontSize:btnSize+'rpx',color:btn[color] || '#465CFF'}"
|
||||
:class="{'fui-preview__link':!btn[color]}">{{btn[text]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 本文件由FirstUI授权予新疆天衡创新研究院有限公司（手机号：18 6 14 072 5 4 9，身份证尾号：5A07X5）专用，请尊重知识产权，勿私下传播，违者追究法律责任。 -->
|
||||
<script>
|
||||
export default {
|
||||
name: "fui-preview",
|
||||
emits: ['click', 'valueClick'],
|
||||
export default {
|
||||
name: 'FuiPreview',
|
||||
props: {
|
||||
previewData: {
|
||||
type: Object,
|
||||
default () {
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
},
|
||||
fields: {
|
||||
type: Object,
|
||||
default () {
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
},
|
||||
// #ifdef APP-NVUE
|
||||
background: {
|
||||
type: String,
|
||||
default: '#fff'
|
||||
default: '#fff',
|
||||
},
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
background: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
// #endif
|
||||
marginTop: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
default: 0,
|
||||
},
|
||||
marginBottom: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
default: 0,
|
||||
},
|
||||
//左右间距
|
||||
// 左右间距
|
||||
padding: {
|
||||
type: [Number, String],
|
||||
default: 32
|
||||
default: 32,
|
||||
},
|
||||
labelWidth: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
default: 0,
|
||||
},
|
||||
//left / right / justify
|
||||
// left / right / justify
|
||||
labelAlign: {
|
||||
type: String,
|
||||
default: 'left'
|
||||
default: 'left',
|
||||
},
|
||||
// #ifdef APP-NVUE
|
||||
labelColor: {
|
||||
type: String,
|
||||
default: '#7F7F7F'
|
||||
default: '#7F7F7F',
|
||||
},
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
labelColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
// #endif
|
||||
//V1.9.9+
|
||||
// V1.9.9+
|
||||
labelRight: {
|
||||
type: [Number, String],
|
||||
default: 32
|
||||
default: 32,
|
||||
},
|
||||
//V1.9.9+
|
||||
// V1.9.9+
|
||||
hdLabelWidth: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
default: 0,
|
||||
},
|
||||
hdLabelSize: {
|
||||
type: [Number, String],
|
||||
default: 32
|
||||
default: 32,
|
||||
},
|
||||
hdValSize: {
|
||||
type: [Number, String],
|
||||
default: 36
|
||||
default: 36,
|
||||
},
|
||||
// #ifdef APP-NVUE
|
||||
hdValColor: {
|
||||
type: String,
|
||||
default: '#181818'
|
||||
default: '#181818',
|
||||
},
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
hdValColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
// #endif
|
||||
bdSize: {
|
||||
type: [Number, String],
|
||||
default: 28
|
||||
default: 28,
|
||||
},
|
||||
// #ifdef APP-NVUE
|
||||
bdColor: {
|
||||
type: String,
|
||||
default: '#181818'
|
||||
default: '#181818',
|
||||
},
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
bdColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
// #endif
|
||||
//V1.9.9+ 内容对齐方式：left、right
|
||||
// V1.9.9+ 内容对齐方式：left、right
|
||||
bdAlign: {
|
||||
type: String,
|
||||
default: 'right'
|
||||
default: 'right',
|
||||
},
|
||||
btnSize: {
|
||||
type: [Number, String],
|
||||
default: 32
|
||||
default: 32,
|
||||
},
|
||||
//按钮是否有点击效果
|
||||
// 按钮是否有点击效果
|
||||
highlight: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
default: true,
|
||||
},
|
||||
hdLeft: {
|
||||
type: [Number, String],
|
||||
default: 32
|
||||
default: 32,
|
||||
},
|
||||
hdRight: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
default: 0,
|
||||
},
|
||||
// #ifdef APP-NVUE
|
||||
borderColor: {
|
||||
type: String,
|
||||
default: '#eee'
|
||||
default: '#eee',
|
||||
},
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
borderColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
// #endif
|
||||
//是否需要preview外层上下线条
|
||||
// 是否需要preview外层上下线条
|
||||
isBorder: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
default: true,
|
||||
},
|
||||
watch: {
|
||||
previewData(val) {
|
||||
this.initData(val)
|
||||
},
|
||||
//未做深度监听
|
||||
fields(val) {
|
||||
this.handleFileds()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initData(this.previewData)
|
||||
},
|
||||
emits: ['click', 'valueClick'],
|
||||
data() {
|
||||
return {
|
||||
pvd: {},
|
||||
@ -218,40 +158,52 @@
|
||||
valueColor: 'valueColor',
|
||||
buttons: 'buttons',
|
||||
text: 'text',
|
||||
color: 'color'
|
||||
};
|
||||
color: 'color',
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
previewData(val) {
|
||||
this.initData(val)
|
||||
},
|
||||
// 未做深度监听
|
||||
fields(val) {
|
||||
this.handleFileds()
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.initData(this.previewData)
|
||||
},
|
||||
methods: {
|
||||
handleFileds() {
|
||||
if (this.fields && typeof this.fields === 'object') {
|
||||
this.label = this.fields.label || 'label';
|
||||
this.value = this.fields.value || 'value';
|
||||
this.list = this.fields.list || 'list';
|
||||
this.lColor = this.fields.labelColor || 'labelColor';
|
||||
this.valueColor = this.fields.valueColor || 'valueColor';
|
||||
this.buttons = this.fields.buttons || 'buttons';
|
||||
this.text = this.fields.text || 'text';
|
||||
this.color = this.fields.color || 'color';
|
||||
this.label = this.fields.label || 'label'
|
||||
this.value = this.fields.value || 'value'
|
||||
this.list = this.fields.list || 'list'
|
||||
this.lColor = this.fields.labelColor || 'labelColor'
|
||||
this.valueColor = this.fields.valueColor || 'valueColor'
|
||||
this.buttons = this.fields.buttons || 'buttons'
|
||||
this.text = this.fields.text || 'text'
|
||||
this.color = this.fields.color || 'color'
|
||||
}
|
||||
},
|
||||
initData(val) {
|
||||
this.handleFileds()
|
||||
val = val || {};
|
||||
val[this.list] = val[this.list] || [];
|
||||
val[this.buttons] = val[this.buttons] || [];
|
||||
this.pvd = val;
|
||||
val = val || {}
|
||||
val[this.list] = val[this.list] || []
|
||||
val[this.buttons] = val[this.buttons] || []
|
||||
this.pvd = val
|
||||
},
|
||||
handleClick(idx) {
|
||||
let params = this.pvd[this.buttons][idx] || {}
|
||||
const params = this.pvd[this.buttons][idx] || {}
|
||||
this.$emit('click', {
|
||||
index: idx,
|
||||
...params
|
||||
...params,
|
||||
})
|
||||
},
|
||||
itemClick(index) {
|
||||
this.$emit('valueClick', {
|
||||
index,
|
||||
item: this.pvd[this.list][index]
|
||||
item: this.pvd[this.list][index],
|
||||
})
|
||||
},
|
||||
setValue(index, value) {
|
||||
@ -259,16 +211,104 @@
|
||||
if (idx || idx === 0) {
|
||||
const data = JSON.parse(JSON.stringify(this.pvd))
|
||||
const item = data[this.list][idx]
|
||||
item[this.value] = value;
|
||||
item[this.value] = value
|
||||
this.pvd = data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view
|
||||
class="fui-preview__wrap" :class="{ 'fui-preview__unlined': !isBorder, 'fui-preview__background': !background }"
|
||||
:style="{ 'border-top-color': borderColor, 'border-bottom-color': borderColor, 'marginTop': `${marginTop}rpx`, 'marginBottom': `${marginBottom}rpx`, 'background': background }"
|
||||
>
|
||||
<view
|
||||
v-if="pvd[label] || pvd[value]" class="fui-preview__hd"
|
||||
:style="{ paddingLeft: `${padding}rpx`, paddingRight: `${padding}rpx` }"
|
||||
>
|
||||
<view class="fui-preview__item">
|
||||
<text
|
||||
class="fui-preview__label" style="color: #333;font-weight:600"
|
||||
:style="{ color: labelColor, fontSize: `${hdLabelSize}rpx`, width: hdLabelWidth > 0 ? `${hdLabelWidth}rpx` : 'auto', marginRight: `${labelRight}rpx` }"
|
||||
>
|
||||
{{ pvd[label] || '' }}
|
||||
</text>
|
||||
<text
|
||||
class="fui-preview__value-hd" :class="{ 'fui-preview__color': !hdValColor }"
|
||||
:style="{ color: hdValColor, fontSize: `${hdValSize}rpx`, textAlign: bdAlign }"
|
||||
>
|
||||
{{ pvd[value] || '' }}
|
||||
</text>
|
||||
</view>
|
||||
<view
|
||||
:style="{ background: borderColor, left: `${hdLeft}rpx`, right: `${hdRight}rpx` }" class="fui-preview__border"
|
||||
:class="{ 'fui-preview__border-color': !borderColor }"
|
||||
/>
|
||||
</view>
|
||||
<view :style="{ paddingLeft: `${padding}rpx`, paddingRight: `${padding}rpx` }">
|
||||
<slot name="tag" />
|
||||
</view>
|
||||
|
||||
<view
|
||||
v-if="pvd[list] && pvd[list].length > 0" class="fui-preview__bd"
|
||||
:style="{ paddingLeft: `${padding}rpx`, paddingRight: `${padding}rpx` }"
|
||||
>
|
||||
<view v-for="(item, index) in pvd[list]" :key="index" class="fui-preview__item">
|
||||
<text
|
||||
class="fui-preview__label"
|
||||
:class="[!labelColor && !item[lColor] ? 'fui-preview__gray' : '', `fui-preview__label-${labelAlign}`]"
|
||||
:style="{ color: item[lColor] || labelColor, fontSize: `${bdSize}rpx`, width: labelWidth > 0 ? `${labelWidth}rpx` : 'auto', marginRight: `${labelRight}rpx` }"
|
||||
>
|
||||
{{ item[label] }}
|
||||
</text>
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<text
|
||||
class="fui-preview__value" :class="{ 'fui-preview__color': !bdColor && !item[valueColor] }"
|
||||
:style="{ color: item[valueColor] || bdColor, fontSize: `${bdSize}rpx`, textAlign: bdAlign }"
|
||||
@tap="itemClick(index)"
|
||||
>
|
||||
{{ item[value] }}
|
||||
</text>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<view class="fui-preview__value-wrap">
|
||||
<text
|
||||
class="fui-preview__value" :class="{ 'fui-preview__color': !bdColor && !item[valueColor] }"
|
||||
:style="{ color: item[valueColor] || bdColor, fontSize: `${bdSize}rpx`, textAlign: bdAlign }"
|
||||
@tap="itemClick(index)"
|
||||
>
|
||||
{{ item[value] }}
|
||||
</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
<slot />
|
||||
<view
|
||||
v-if="pvd[buttons] && pvd[buttons].length > 0" class="fui-preview__ft"
|
||||
:style="{ 'border-top-color': borderColor }"
|
||||
>
|
||||
<view
|
||||
v-for="(btn, idx) in pvd[buttons]" :key="idx"
|
||||
:style="{ 'border-right-color': idx !== pvd[buttons].length - 1 ? borderColor : 'transparent' }"
|
||||
:class="[highlight ? 'fui-preview__hover-weex' : '', idx !== pvd[buttons].length - 1 ? 'fui-preview__btn-def' : 'fui-preview__btn']"
|
||||
:hover-class="highlight ? 'fui-preview_hover' : ''" :hover-stay-time="150" @tap="handleClick(idx)"
|
||||
>
|
||||
<text
|
||||
:style="{ fontSize: `${btnSize}rpx`, color: btn[color] || '#465CFF' }"
|
||||
:class="{ 'fui-preview__link': !btn[color] }"
|
||||
>
|
||||
{{ btn[text] }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.fui-preview__wrap {
|
||||
.fui-preview__wrap {
|
||||
/* #ifndef APP-NVUE */
|
||||
width: 100%;
|
||||
border-top-width: 0;
|
||||
@ -284,77 +324,77 @@
|
||||
border-bottom-width: 0.5px;
|
||||
border-bottom-style: solid;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__background {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__background {
|
||||
background: var(--fui-bg-color, #FFFFFF) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.fui-preview__unlined {
|
||||
/* #endif */
|
||||
.fui-preview__unlined {
|
||||
border-top-width: 0 !important;
|
||||
border-bottom-width: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__wrap::before {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__wrap::before {
|
||||
top: 0;
|
||||
border-top: 1px solid var(--fui-color-border, #EEEEEE);
|
||||
-webkit-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
-webkit-transform: scaleY(.5);
|
||||
transform: scaleY(.5)
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__wrap::after {
|
||||
.fui-preview__wrap::after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__wrap::before {
|
||||
.fui-preview__wrap::before {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__wrap::after {
|
||||
.fui-preview__wrap::after {
|
||||
bottom: 0;
|
||||
border-bottom: 1px solid var(--fui-color-border, #EEEEEE);
|
||||
-webkit-transform-origin: 0 100%;
|
||||
transform-origin: 0 100%;
|
||||
-webkit-transform: scaleY(.5);
|
||||
transform: scaleY(.5)
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__unlined::before {
|
||||
.fui-preview__unlined::before {
|
||||
border-top-width: 0 !important;
|
||||
border-bottom-width: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__unlined::after {
|
||||
.fui-preview__unlined::after {
|
||||
border-top-width: 0 !important;
|
||||
border-bottom-width: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.fui-preview__hd {
|
||||
/* #endif */
|
||||
.fui-preview__hd {
|
||||
position: relative;
|
||||
padding-top: 32rpx;
|
||||
padding-bottom: 32rpx;
|
||||
padding-bottom: 8rpx;
|
||||
text-align: right;
|
||||
/* #ifndef APP-NVUE */
|
||||
box-sizing: border-box;
|
||||
/* #endif */
|
||||
line-height: 56rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__border {
|
||||
.fui-preview__border {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
/* #ifdef APP-NVUE */
|
||||
@ -368,22 +408,22 @@
|
||||
transform-origin: 0 100%;
|
||||
z-index: 1;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__border-color {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__border-color {
|
||||
background: var(--fui-color-border, #EEEEEE) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
/* #ifdef APP-NVUE */
|
||||
.fui-preview__value-wrap {
|
||||
/* #ifdef APP-NVUE */
|
||||
.fui-preview__value-wrap {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.fui-preview__value {
|
||||
/* #endif */
|
||||
.fui-preview__value {
|
||||
text-align: right;
|
||||
/* #ifndef APP-NVUE */
|
||||
flex: 1;
|
||||
@ -391,22 +431,22 @@
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__color {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__color {
|
||||
color: var(--fui-color-title, #181818) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
.fui-preview__value-hd {
|
||||
.fui-preview__value-hd {
|
||||
font-style: normal;
|
||||
font-size: 36rpx;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__bd {
|
||||
.fui-preview__bd {
|
||||
flex: 1;
|
||||
padding-top: 32rpx;
|
||||
padding-bottom: 32rpx;
|
||||
@ -414,10 +454,9 @@
|
||||
/* #ifndef APP-NVUE */
|
||||
box-sizing: border-box
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.fui-preview__ft {
|
||||
.fui-preview__ft {
|
||||
/* #ifdef APP-NVUE */
|
||||
flex: 1;
|
||||
/* #endif */
|
||||
@ -432,10 +471,10 @@
|
||||
border-top-width: 0;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__ft::before {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__ft::before {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
@ -445,11 +484,11 @@
|
||||
border-top: 1px solid var(--fui-color-border, #EEEEEE);
|
||||
transform-origin: 0 0;
|
||||
transform: scaleY(.5)
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
.fui-preview__item {
|
||||
.fui-preview__item {
|
||||
padding: 8rpx 0;
|
||||
overflow: hidden;
|
||||
/* #ifndef APP-NVUE */
|
||||
@ -460,37 +499,37 @@
|
||||
/* #ifdef APP-NVUE */
|
||||
align-items: flex-start;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__label {
|
||||
.fui-preview__label {
|
||||
margin-right: 32rpx;
|
||||
/* #ifndef APP-NVUE */
|
||||
min-width: 112rpx;
|
||||
text-align: justify;
|
||||
flex-shrink: 0;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__label-right {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__label-right {
|
||||
text-align-last: right;
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__label-justify {
|
||||
.fui-preview__label-justify {
|
||||
text-align-last: justify;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__gray {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__gray {
|
||||
color: var(--fui-color-subtitle, #7F7F7F) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
.fui-preview__btn,
|
||||
.fui-preview__btn-def {
|
||||
.fui-preview__btn,
|
||||
.fui-preview__btn-def {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
/* #ifndef APP-NVUE */
|
||||
@ -502,27 +541,27 @@
|
||||
/* #ifdef H5 */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__btn-def {
|
||||
.fui-preview__btn-def {
|
||||
position: relative;
|
||||
/* #ifdef APP-NVUE */
|
||||
border-right-width: 0.5px;
|
||||
border-right-style: solid;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
.fui-preview__link {
|
||||
.fui-preview__link {
|
||||
/* #ifdef APP-NVUE */
|
||||
color: #465CFF !important;
|
||||
/* #endif */
|
||||
/* #ifndef APP-NVUE */
|
||||
color: var(--fui-color-link, #465CFF) !important;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__btn-def::after {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview__btn-def::after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
right: 0;
|
||||
@ -532,21 +571,21 @@
|
||||
border-right: 1px solid var(--fui-color-border, #eee);
|
||||
transform-origin: 100% 0;
|
||||
transform: scaleX(.5)
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview_hover {
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-preview_hover {
|
||||
background-color: var(--fui-bg-color-hover, rgba(0, 0, 0, 0.2)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
|
||||
/* #ifdef APP-NVUE */
|
||||
.fui-preview__hover-weex:active {
|
||||
/* #ifdef APP-NVUE */
|
||||
.fui-preview__hover-weex:active {
|
||||
background-color: rgba(0, 0, 0, 0.2) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
/* #endif */
|
||||
</style>
|
||||
Reference in New Issue
Block a user