提交 ee159961 编写于 作者: M mehaotian

build uni-ui 1.2.10

上级 babe1d77
...@@ -81,7 +81,7 @@ ...@@ -81,7 +81,7 @@
background-color: #f1f1f1; background-color: #f1f1f1;
background-color: transparent; background-color: transparent;
text-align: center; text-align: center;
font-family: "Helvetica Neue", Helvetica, sans-serif; font-family: 'Helvetica Neue', Helvetica, sans-serif;
font-size: 12px; font-size: 12px;
padding: 0px 6px; padding: 0px 6px;
} }
......
...@@ -136,7 +136,7 @@ ...@@ -136,7 +136,7 @@
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
.uni-border:after { .uni-border:after {
content: ""; content: '';
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
...@@ -165,7 +165,7 @@ ...@@ -165,7 +165,7 @@
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
.uni-border-bottom:after { .uni-border-bottom:after {
content: ""; content: '';
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
...@@ -193,7 +193,7 @@ ...@@ -193,7 +193,7 @@
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
.uni-border-top:after { .uni-border-top:after {
content: ""; content: '';
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
......
...@@ -180,7 +180,7 @@ ...@@ -180,7 +180,7 @@
} }
.uni-combox__selector::before { .uni-combox__selector::before {
content: ""; content: '';
position: absolute; position: absolute;
width: 0; width: 0;
height: 0; height: 0;
......
...@@ -20,58 +20,6 @@ const attrs = [ ...@@ -20,58 +20,6 @@ const attrs = [
] ]
export default { export default {
props: {
options: {
type: [Object, Array],
default () {
return {}
}
},
collection: {
type: String,
default: ''
},
action: {
type: String,
default: ''
},
field: {
type: String,
default: ''
},
pageData: {
type: String,
default: 'add'
},
pageCurrent: {
type: Number,
default: 1
},
pageSize: {
type: Number,
default: 20
},
getcount: {
type: [Boolean, String],
default: false
},
orderby: {
type: String,
default: ''
},
where: {
type: [String, Object],
default: ''
},
getone: {
type: [Boolean, String],
default: false
},
manual: {
type: Boolean,
default: false
}
},
data() { data() {
return { return {
loading: false, loading: false,
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<template v-else> <template v-else>
<checkbox-group v-if="multiple" class="checklist-group" :class="{'is-list':mode==='list','is-wrap':wrap}" @change="chagne"> <checkbox-group v-if="multiple" class="checklist-group" :class="{'is-list':mode==='list','is-wrap':wrap}" @change="chagne">
<label class="checklist-box" :class="item.labelClass" :style="[item.styleBackgroud]" v-for="(item,index) in dataList" :key="index"> <label class="checklist-box" :class="item.labelClass" :style="[item.styleBackgroud]" v-for="(item,index) in dataList" :key="index">
<checkbox hidden :disabled="!!item.disable" :value="item.value+''" :checked="item.selected" /> <checkbox class="hidden" hidden :disabled="!!item.disabled" :value="item.value+''" :checked="item.selected" />
<view v-if="(mode !=='tag' && mode !== 'list') || ( mode === 'list' && icon === 'left')" class="checkbox__inner" :class="item.checkboxBgClass" :style="[item.styleIcon]"> <view v-if="(mode !=='tag' && mode !== 'list') || ( mode === 'list' && icon === 'left')" class="checkbox__inner" :class="item.checkboxBgClass" :style="[item.styleIcon]">
<view class="checkbox__inner-icon" :class="item.checkboxClass"></view> <view class="checkbox__inner-icon" :class="item.checkboxClass"></view>
</view> </view>
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
</checkbox-group> </checkbox-group>
<radio-group v-else class="checklist-group" :class="{'is-list':mode==='list','is-wrap':wrap}" @change="chagne"> <radio-group v-else class="checklist-group" :class="{'is-list':mode==='list','is-wrap':wrap}" @change="chagne">
<label class="checklist-box" :class="item.labelClass" :style="[item.styleBackgroud]" v-for="(item,index) in dataList" :key="index"> <label class="checklist-box" :class="item.labelClass" :style="[item.styleBackgroud]" v-for="(item,index) in dataList" :key="index">
<radio hidden :disabled="item.disable" :value="item.value+''" :checked="item.selected" /> <radio hidden :disabled="item.disabled" :value="item.value+''" :checked="item.selected" />
<view v-if="(mode !=='tag' && mode !== 'list') || ( mode === 'list' && icon === 'left')" class="radio__inner" :class="item.checkboxBgClass" :style="[item.styleBackgroud]"> <view v-if="(mode !=='tag' && mode !== 'list') || ( mode === 'list' && icon === 'left')" class="radio__inner" :class="item.checkboxBgClass" :style="[item.styleBackgroud]">
<view class="radio__inner-icon" :class="item.checkboxClass" :style="[item.styleIcon]"></view> <view class="radio__inner-icon" :class="item.checkboxClass" :style="[item.styleIcon]"></view>
</view> </view>
...@@ -106,11 +106,63 @@ ...@@ -106,11 +106,63 @@
selectedTextColor: { selectedTextColor: {
type: String, type: String,
default: '' default: ''
},
// clientDB 相关
options: {
type: [Object, Array],
default () {
return {}
}
},
collection: {
type: String,
default: ''
},
action: {
type: String,
default: ''
},
field: {
type: String,
default: ''
},
pageData: {
type: String,
default: 'add'
},
pageCurrent: {
type: Number,
default: 1
},
pageSize: {
type: Number,
default: 20
},
getcount: {
type: [Boolean, String],
default: false
},
orderby: {
type: String,
default: ''
},
where: {
type: [String, Object],
default: ''
},
getone: {
type: [Boolean, String],
default: false
},
manual: {
type: Boolean,
default: false
} }
}, },
watch: { watch: {
localdata: { localdata: {
handler(newVal) { handler(newVal) {
this.range = newVal
this.dataList = this.getDataList(this.getSelectedValue(newVal)) this.dataList = this.getDataList(this.getSelectedValue(newVal))
}, },
deep: true deep: true
...@@ -119,7 +171,6 @@ ...@@ -119,7 +171,6 @@
listData(newVal) { listData(newVal) {
this.range = newVal this.range = newVal
this.dataList = this.getDataList(this.getSelectedValue(newVal)) this.dataList = this.getDataList(this.getSelectedValue(newVal))
// console.log('----listData', this.dataList);
}, },
value(newVal) { value(newVal) {
this.dataList = this.getDataList(newVal) this.dataList = this.getDataList(newVal)
...@@ -223,7 +274,7 @@ ...@@ -223,7 +274,7 @@
let classes = [] let classes = []
switch (this.mode) { switch (this.mode) {
case 'default': case 'default':
item.disable && classes.push('disabled-cursor') item.disabled && classes.push('disabled-cursor')
break break
case 'button': case 'button':
classes.push(...['is-button', ...this.getClasses(item, 'button')]) classes.push(...['is-button', ...this.getClasses(item, 'button')])
...@@ -234,7 +285,7 @@ ...@@ -234,7 +285,7 @@
} else { } else {
classes.push('is-list-box') classes.push('is-list-box')
} }
item.disable && classes.push('is-list-disabled') item.disabled && classes.push('is-list-disabled')
index !== 0 && classes.push('is-list-border') index !== 0 && classes.push('is-list-border')
break break
case 'tag': case 'tag':
...@@ -289,6 +340,7 @@ ...@@ -289,6 +340,7 @@
} }
} }
dataList.forEach((item, index) => { dataList.forEach((item, index) => {
item.disabled = item.disable || item.disabled || false
if (this.multiple) { if (this.multiple) {
if (value.length > 0) { if (value.length > 0) {
let have = value.find(val => val === item.value) let have = value.find(val => val === item.value)
...@@ -317,14 +369,14 @@ ...@@ -317,14 +369,14 @@
if (selectList.length <= min) { if (selectList.length <= min) {
let have = selectList.find(val => val.value === item.value) let have = selectList.find(val => val.value === item.value)
if (have !== undefined) { if (have !== undefined) {
item.disable = true item.disabled = true
} }
} }
if (selectList.length >= max && max !== '') { if (selectList.length >= max && max !== '') {
let have = selectList.find(val => val.value === item.value) let have = selectList.find(val => val.value === item.value)
if (have === undefined) { if (have === undefined) {
item.disable = true item.disabled = true
} }
} }
} }
...@@ -361,11 +413,11 @@ ...@@ -361,11 +413,11 @@
*/ */
getClasses(item, name, type = '') { getClasses(item, name, type = '') {
let classes = [] let classes = []
item.disable && classes.push('is-' + name + '-disabled' + type) item.disabled && classes.push('is-' + name + '-disabled' + type)
item.selected && classes.push('is-' + name + '-checked' + type) item.selected && classes.push('is-' + name + '-checked' + type)
if (this.mode !== 'button' || name === 'button') { if (this.mode !== 'button' || name === 'button') {
item.selected && item.disable && classes.push('is-' + name + '-disabled-checked' + type) item.selected && item.disabled && classes.push('is-' + name + '-disabled-checked' + type)
} }
return classes return classes
...@@ -443,6 +495,8 @@ ...@@ -443,6 +495,8 @@
@charset "UTF-8"; @charset "UTF-8";
.uni-data-checklist { .uni-data-checklist {
position: relative;
z-index: 0;
/* min-height: 36px; */ /* min-height: 36px; */
} }
...@@ -564,7 +618,7 @@ ...@@ -564,7 +618,7 @@
top: 1px; top: 1px;
width: 3px; width: 3px;
opacity: 0; opacity: 0;
transition: transform 0.2s; transition: transform .2s;
transform-origin: center; transform-origin: center;
transform: rotate(40deg) scaleY(0.4); transform: rotate(40deg) scaleY(0.4);
} }
...@@ -585,7 +639,7 @@ ...@@ -585,7 +639,7 @@
border-radius: 16px; border-radius: 16px;
background-color: #fff; background-color: #fff;
z-index: 1; z-index: 1;
transition: border-color 0.3s; transition: border-color .3s;
} }
.radio__inner-icon { .radio__inner-icon {
...@@ -593,7 +647,7 @@ ...@@ -593,7 +647,7 @@
height: 8px; height: 8px;
border-radius: 10px; border-radius: 10px;
opacity: 0; opacity: 0;
transition: transform 0.3s; transition: transform .3s;
} }
.checkobx__list { .checkobx__list {
...@@ -758,4 +812,10 @@ ...@@ -758,4 +812,10 @@
.is-wrap { .is-wrap {
flex-direction: column; flex-direction: column;
} }
.hidden {
/* #ifdef MP-ALIPAY */
display: none;
/* #endif */
}
</style> </style>
\ No newline at end of file
...@@ -304,14 +304,14 @@ ...@@ -304,14 +304,14 @@
} }
.uni-datetime-picker-colon::after { .uni-datetime-picker-colon::after {
content: ":"; content: ':';
position: absolute; position: absolute;
top: 53px; top: 53px;
right: 0; right: 0;
} }
.uni-datetime-picker-hyphen::after { .uni-datetime-picker-hyphen::after {
content: "-"; content: '-';
position: absolute; position: absolute;
top: 53px; top: 53px;
right: -2px; right: -2px;
...@@ -342,7 +342,7 @@ ...@@ -342,7 +342,7 @@
border-style: solid; border-style: solid;
transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
transform-origin: center; transform-origin: center;
transition: transform 0.3s; transition: transform .3s;
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 5px; right: 5px;
......
<template> <template>
<view class="uni-easyinput" :class="{'uni-easyinput-error':msg}"> <view class="uni-easyinput" :class="{'uni-easyinput-error':msg}" :style="{color:inputBorder && msg?'#dd524d':styles.color}">
<view class="uni-easyinput__content" :class="{'is-input-border':inputBorder ,'is-input-error-border':inputBorder && msg,'is-textarea':type==='textarea','is-disabled':disabled}"> <view class="uni-easyinput__content" :class="{'is-input-border':inputBorder ,'is-input-error-border':inputBorder && msg,'is-textarea':type==='textarea','is-disabled':disabled}" :style="{'border-color':inputBorder && msg?'#dd524d':styles.borderColor,'background-color':disabled?styles.disableColor:'#fff'}">
<uni-icons v-if="prefixIcon" class="content-clear-icon" :type="prefixIcon" color="#c0c4cc"></uni-icons> <uni-icons v-if="prefixIcon" class="content-clear-icon" :type="prefixIcon" color="#c0c4cc" @click="onClickIcon('prefix')"></uni-icons>
<textarea v-if="type === 'textarea'" class="uni-easyinput__content-textarea" :class="{'input-padding':inputBorder}" :name="name" :value="val" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" :maxlength="inputMaxlength" :focus="focused" :autoHeight="autoHeight" @input="onInput" @blur="onBlur" @focus="onFocus" @confirm="onConfirm"></textarea> <textarea v-if="type === 'textarea'" class="uni-easyinput__content-textarea" :class="{'input-padding':inputBorder}" :name="name" :value="val" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" :maxlength="inputMaxlength" :focus="focused" :autoHeight="autoHeight" @input="onInput" @blur="onBlur" @focus="onFocus" @confirm="onConfirm"></textarea>
<input v-else :type="type === 'password'?'text':type" class="uni-easyinput__content-input" :style="{ <input v-else :type="type === 'password'?'text':type" class="uni-easyinput__content-input" :style="{
'padding-right':type === 'password' ||clearable || prefixIcon?'':'10px', 'padding-right':type === 'password' ||clearable || prefixIcon?'':'10px',
'padding-left':prefixIcon?'':'10px', 'padding-left':prefixIcon?'':'10px'
'color':msg?'#dd524d':''
}" :name="name" :value="val" :password="!showPassword && type === 'password'" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" :maxlength="inputMaxlength" :focus="focused" @focus="onFocus" @blur="onBlur" @input="onInput" @confirm="onConfirm" /> }" :name="name" :value="val" :password="!showPassword && type === 'password'" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" :maxlength="inputMaxlength" :focus="focused" @focus="onFocus" @blur="onBlur" @input="onInput" @confirm="onConfirm" />
<template v-if="type === 'password'"> <template v-if="type === 'password'">
<uni-icons v-if="val != '' " class="content-clear-icon" :class="{'is-textarea-icon':type==='textarea'}" :type="showPassword?'eye-slash-filled':'eye-filled'" :size="18" color="#c0c4cc" @click="onEyes"></uni-icons> <uni-icons v-if="val != '' " class="content-clear-icon" :class="{'is-textarea-icon':type==='textarea'}" :type="showPassword?'eye-slash-filled':'eye-filled'" :size="18" color="#c0c4cc" @click="onEyes"></uni-icons>
</template> </template>
<template v-else-if="suffixIcon"> <template v-else-if="suffixIcon">
<uni-icons v-if="suffixIcon" class="content-clear-icon" :type="suffixIcon" color="#c0c4cc"></uni-icons> <uni-icons v-if="suffixIcon" class="content-clear-icon" :type="suffixIcon" color="#c0c4cc" @click="onClickIcon('suffix')"></uni-icons>
</template> </template>
<template v-else> <template v-else>
<uni-icons class="content-clear-icon" :class="{'is-textarea-icon':type==='textarea'}" type="clear" :size="clearSize" v-if="clearable && focused && val " color="#c0c4cc" @click="onClear"></uni-icons> <uni-icons class="content-clear-icon" :class="{'is-textarea-icon':type==='textarea'}" type="clear" :size="clearSize" v-if="clearable && focused && val " color="#c0c4cc" @click="onClear"></uni-icons>
...@@ -26,31 +25,33 @@ ...@@ -26,31 +25,33 @@
* Field 输入框 * Field 输入框
* @description 此组件可以实现表单的输入与校验,包括 "text" 和 "textarea" 类型。 * @description 此组件可以实现表单的输入与校验,包括 "text" 和 "textarea" 类型。
* @tutorial https://ext.dcloud.net.cn/plugin?id=21001 * @tutorial https://ext.dcloud.net.cn/plugin?id=21001
* @property {String| Number} value 输入内容 * @property {String| Number} value 输入内容
* @property {String } type 输入框的类型(默认text) password/text/textarea/.. * @property {String } type 输入框的类型(默认text) password/text/textarea/..
* @value text 文本输入键盘 * @value text 文本输入键盘
* @value textarea 多行文本输入键盘 * @value textarea 多行文本输入键盘
* @value password 密码输入键盘 * @value password 密码输入键盘
* @value number 数字输入键盘,注意iOS上app-vue弹出的数字键盘并非9宫格方式 * @value number 数字输入键盘,注意iOS上app-vue弹出的数字键盘并非9宫格方式
* @value idcard 身份证输入键盘,信、支付宝、百度、QQ小程序 * @value idcard 身份证输入键盘,信、支付宝、百度、QQ小程序
* @value digit 带小数点的数字键盘 ,App的nvue页面、微信、支付宝、百度、头条、QQ小程序支持 * @value digit 带小数点的数字键盘 ,App的nvue页面、微信、支付宝、百度、头条、QQ小程序支持
* @property {Boolean} clearable 是否显示右侧清空内容的图标控件(输入框有内容,且获得焦点时才显示),点击可清空输入框内容(默认true) * @property {Boolean} clearable 是否显示右侧清空内容的图标控件(输入框有内容,且获得焦点时才显示),点击可清空输入框内容(默认true)
* @property {Boolean} autoHeight 是否自动增高输入区域,type为textarea时有效(默认true) * @property {Boolean} autoHeight 是否自动增高输入区域,type为textarea时有效(默认true)
* @property {String } placeholder 输入框的提示文字 * @property {String } placeholder 输入框的提示文字
* @property {String } placeholderStyle placeholder的样式(内联样式,字符串),如"color: #ddd" * @property {String } placeholderStyle placeholder的样式(内联样式,字符串),如"color: #ddd"
* @property {Boolean} focus 是否自动获得焦点(默认false) * @property {Boolean} focus 是否自动获得焦点(默认false)
* @property {Boolean} disabled 是否不可输入(默认false) * @property {Boolean} disabled 是否不可输入(默认false)
* @property {Number } maxlength 最大输入长度,设置为 -1 的时候不限制最大长度(默认140) * @property {Number } maxlength 最大输入长度,设置为 -1 的时候不限制最大长度(默认140)
* @property {String } confirmType 设置键盘右下角按钮的文字,仅在type="text"时生效(默认done) * @property {String } confirmType 设置键盘右下角按钮的文字,仅在type="text"时生效(默认done)
* @property {Number } clearSize 清除图标的大小,单位px(默认15) * @property {Number } clearSize 清除图标的大小,单位px(默认15)
* @property {String} prefixIcon 输入框头部图标 * @property {String} prefixIcon 输入框头部图标
* @property {String} suffixIcon 输入框尾部图标 * @property {String} suffixIcon 输入框尾部图标
* @property {Boolean} trim 是否自动去除两端的空格 * @property {Boolean} trim 是否自动去除两端的空格
* @property {Boolean} inputBorder 是否显示input输入框的边框(默认false) * @property {Boolean} inputBorder 是否显示input输入框的边框(默认false)
* @event {Function} input 输入框内容发生变化时触发 * @property {Object} styles 自定义颜色
* @event {Function} focus 输入框获得焦点时触发 * @event {Function} input 输入框内容发生变化时触发
* @event {Function} blur 输入框失去焦点时触发 * @event {Function} focus 输入框获得焦点时触发
* @event {Function} confirm 点击完成按钮时触发 * @event {Function} blur 输入框失去焦点时触发
* @event {Function} confirm 点击完成按钮时触发
* @event {Function} iconClick 点击图标时触发
* @example <uni-easyinput v-model="mobile"></uni-easyinput> * @example <uni-easyinput v-model="mobile"></uni-easyinput>
*/ */
...@@ -116,6 +117,17 @@ ...@@ -116,6 +117,17 @@
trim: { trim: {
type: Boolean, type: Boolean,
default: true default: true
},
// 自定义样式
styles: {
type: Object,
default () {
return {
color: '#333',
disableColor: '#eee',
borderColor: '#e5e5e5'
}
}
} }
}, },
data() { data() {
...@@ -141,6 +153,7 @@ ...@@ -141,6 +153,7 @@
}, },
watch: { watch: {
value(newVal) { value(newVal) {
if (this.errMsg) this.errMsg = ''
this.val = newVal this.val = newVal
if (this.formItem) { if (this.formItem) {
this.formItem.setValue(newVal) this.formItem.setValue(newVal)
...@@ -176,6 +189,9 @@ ...@@ -176,6 +189,9 @@
*/ */
init() { init() {
},
onClickIcon(type) {
this.$emit('iconClick', type)
}, },
/** /**
* 获取父元素实例 * 获取父元素实例
......
此差异已折叠。
...@@ -179,7 +179,6 @@ ...@@ -179,7 +179,6 @@
this.labelPos = this.labelPosition ? this.labelPosition : labelPosition this.labelPos = this.labelPosition ? this.labelPosition : labelPosition
this.labelWid = this.label ? (this.labelWidth ? this.labelWidth : labelWidth) : 0 this.labelWid = this.label ? (this.labelWidth ? this.labelWidth : labelWidth) : 0
this.labelAli = this.labelAlign ? this.labelAlign : labelAlign this.labelAli = this.labelAlign ? this.labelAlign : labelAlign
console.log(this.labelWid);
// 判断第一个 item // 判断第一个 item
if (!this.form.isFirstBorder) { if (!this.form.isFirstBorder) {
this.form.isFirstBorder = true this.form.isFirstBorder = true
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<scroll-view :scroll-into-view="scrollViewId" class="uni-indexed-list__scroll" scroll-y> <scroll-view :scroll-into-view="scrollViewId" class="uni-indexed-list__scroll" scroll-y>
<view v-for="(list, idx) in lists" :key="idx" :id="'uni-indexed-list-' + idx"> <view v-for="(list, idx) in lists" :key="idx" :id="'uni-indexed-list-' + idx">
<!-- #endif --> <!-- #endif -->
<uni-indexed-list-item :list="list" :loaded="loaded" :idx="idx" :showSelect="showSelect" @itemClick="onClick"></uni-indexed-list-item> <indexed-list-item :list="list" :loaded="loaded" :idx="idx" :showSelect="showSelect" @itemClick="onClick"></indexed-list-item>
<!-- #ifndef APP-NVUE --> <!-- #ifndef APP-NVUE -->
</view> </view>
</scroll-view> </scroll-view>
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
</template> </template>
<script> <script>
import uniIcons from '../uni-icons/uni-icons.vue' import uniIcons from '../uni-icons/uni-icons.vue'
import uniIndexedListItem from './uni-indexed-list-item.vue' import indexedListItem from './uni-indexed-list-item.vue'
// #ifdef APP-NVUE // #ifdef APP-NVUE
const dom = weex.requireModule('dom'); const dom = weex.requireModule('dom');
// #endif // #endif
...@@ -85,7 +85,7 @@ ...@@ -85,7 +85,7 @@
name: 'UniIndexedList', name: 'UniIndexedList',
components: { components: {
uniIcons, uniIcons,
uniIndexedListItem indexedListItem
}, },
props: { props: {
options: { options: {
......
...@@ -92,7 +92,7 @@ ...@@ -92,7 +92,7 @@
right: 0; right: 0;
left: 0; left: 0;
height: 1px; height: 1px;
content: ""; content: '';
-webkit-transform: scaleY(0.5); -webkit-transform: scaleY(0.5);
transform: scaleY(0.5); transform: scaleY(0.5);
background-color: #e5e5e5; background-color: #e5e5e5;
......
...@@ -244,7 +244,7 @@ ...@@ -244,7 +244,7 @@
right: 0; right: 0;
left: 0; left: 0;
height: 1px; height: 1px;
content: ""; content: '';
-webkit-transform: scaleY(0.5); -webkit-transform: scaleY(0.5);
transform: scaleY(0.5); transform: scaleY(0.5);
background-color: #e5e5e5; background-color: #e5e5e5;
......
...@@ -294,7 +294,7 @@ ...@@ -294,7 +294,7 @@
right: 0; right: 0;
left: 0; left: 0;
height: 1px; height: 1px;
content: ""; content: '';
-webkit-transform: scaleY(0.5); -webkit-transform: scaleY(0.5);
transform: scaleY(0.5); transform: scaleY(0.5);
background-color: #e5e5e5; background-color: #e5e5e5;
......
...@@ -247,8 +247,8 @@ ...@@ -247,8 +247,8 @@
} }
/* .transition { /* .transition {
transition: all 0.3s; transition: all 0.3s;
} */ } */
.movable-view-box { .movable-view-box {
flex-shrink: 0; flex-shrink: 0;
height: 100%; height: 100%;
......
...@@ -117,7 +117,7 @@ ...@@ -117,7 +117,7 @@
<style scoped> <style scoped>
/* .uni-title { /* .uni-title {
} */ } */
.uni-title__box { .uni-title__box {
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
display: flex; display: flex;
......
...@@ -77,7 +77,7 @@ ...@@ -77,7 +77,7 @@
<style scoped> <style scoped>
.uni-table-tr { .uni-table-tr {
display: table-row; display: table-row;
transition: all 0.3s; transition: all .3s;
box-sizing: border-box; box-sizing: border-box;
} }
......
...@@ -5,17 +5,21 @@ ...@@ -5,17 +5,21 @@
<view class="example"> <view class="example">
<uni-easyinput v-model="value" focus placeholder="请输入内容" @input="input"></uni-easyinput> <uni-easyinput v-model="value" focus placeholder="请输入内容" @input="input"></uni-easyinput>
</view> </view>
<uni-section title="自定义样式" type="line"></uni-section>
<view class="example">
<uni-easyinput v-model="value" :styles="styles" :placeholderStyle="placeholderStyle" focus placeholder="请输入内容" @input="input"></uni-easyinput>
</view>
<uni-section title="左图标" type="line"></uni-section> <uni-section title="左图标" type="line"></uni-section>
<view class="example"> <view class="example">
<uni-easyinput prefixIcon="search" v-model="value" placeholder="请输入内容"></uni-easyinput> <uni-easyinput prefixIcon="search" v-model="value" placeholder="请输入内容" @iconClick="iconClick"></uni-easyinput>
</view> </view>
<uni-section title="右图标" type="line"></uni-section> <uni-section title="右图标" type="line"></uni-section>
<view class="example"> <view class="example">
<uni-easyinput suffixIcon="search" v-model="value" placeholder="请输入内容"></uni-easyinput> <uni-easyinput suffixIcon="search" v-model="value" placeholder="请输入内容" @iconClick="iconClick"></uni-easyinput>
</view> </view>
<uni-section title="禁用" type="line"></uni-section> <uni-section title="禁用" type="line"></uni-section>
<view class="example"> <view class="example">
<uni-easyinput disabled v-model="value" placeholder="请输入内容"></uni-easyinput> <uni-easyinput disabled value="已禁用" placeholder="请输入内容"></uni-easyinput>
</view> </view>
<uni-section title="密码框" type="line"></uni-section> <uni-section title="密码框" type="line"></uni-section>
<view class="example"> <view class="example">
...@@ -39,7 +43,12 @@ ...@@ -39,7 +43,12 @@
data() { data() {
return { return {
value: '', value: '',
password: '' password: '',
placeholderStyle: "color:#499721;font-size:16px",
styles: {
color: 'blue',
borderColor: '#499721'
}
} }
}, },
...@@ -48,6 +57,12 @@ ...@@ -48,6 +57,12 @@
methods: { methods: {
input(e) { input(e) {
console.log('输入内容:', e); console.log('输入内容:', e);
},
iconClick(type) {
uni.showToast({
title: `点击了${type==='prefix'?'左侧':'右侧'}的图标`,
icon: 'none'
})
} }
} }
} }
......
<template> <template>
<view> <view>
<text class="example-info"> uni-forms 组件一般由输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。</text> <text class="example-info"> uni-forms 组件一般由输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。</text>
<uni-forms :value="formData" ref="form" validate-trigger="bind" err-show-type="undertext"> <uni-forms :value="formData" ref="form" validate-trigger="bind" err-show-type="toast">
<uni-group title="基本信息" top="0"> <uni-group title="基本信息" top="0">
<uni-forms-item name="name" required label="用户名"> <uni-forms-item name="name" required label="用户名">
<uni-easyinput type="text" :inputBorder="true" v-model="formData.name" placeholder="请输入用户名"></uni-easyinput> <uni-easyinput type="text" :inputBorder="true" v-model="formData.name" placeholder="请输入用户名"></uni-easyinput>
...@@ -16,9 +16,9 @@ ...@@ -16,9 +16,9 @@
<uni-forms-item name="email" label="邮箱"> <uni-forms-item name="email" label="邮箱">
<uni-easyinput type="text" v-model="formData.email" placeholder="请输入邮箱"></uni-easyinput> <uni-easyinput type="text" v-model="formData.email" placeholder="请输入邮箱"></uni-easyinput>
</uni-forms-item> </uni-forms-item>
<!-- <uni-forms-item name="time" label="创建时间"> <uni-forms-item name="time" label="创建时间">
<uni-datetime-picker v-model="formData.time" :min-year="2000" :max-year="2030" :timestamp="true" @change="datetimeChange"></uni-datetime-picker> <uni-datetime-picker v-model="formData.time" :min-year="2000" :max-year="2030" :timestamp="true" @change="datetimeChange"></uni-datetime-picker>
</uni-forms-item> --> </uni-forms-item>
<uni-forms-item name="checked" label="详细信息"> <uni-forms-item name="checked" label="详细信息">
<switch :checked="formData.checked" @change="change('checked',$event.detail.value)" /> <switch :checked="formData.checked" @change="change('checked',$event.detail.value)" />
</uni-forms-item> </uni-forms-item>
...@@ -185,9 +185,6 @@ ...@@ -185,9 +185,6 @@
this.$refs.form.setRules(this.rules) this.$refs.form.setRules(this.rules)
}, },
methods: { methods: {
test(e) {
console.log('---', e.detail.value);
},
change(name, value) { change(name, value) {
this.formData.checked = value this.formData.checked = value
this.$refs.form.setValue(name, value) this.$refs.form.setValue(name, value)
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册