725
parent
afe74abe23
commit
a10022ca65
4
App.vue
4
App.vue
|
@ -16,7 +16,9 @@
|
||||||
@import "/style/css/layout.css";
|
@import "/style/css/layout.css";
|
||||||
@import "style/css/main.css";
|
@import "style/css/main.css";
|
||||||
@import "style/css/flex-main.css";
|
@import "style/css/flex-main.css";
|
||||||
@import "/style/iconfont.css";
|
/* @import "/style/iconfont.css"; */
|
||||||
|
/* @import "vant/lib/index.less";
|
||||||
|
@import url("./static/font/iconfont.css"); */
|
||||||
|
|
||||||
/deep/.uni-select {
|
/deep/.uni-select {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
|
|
@ -12,7 +12,7 @@
|
||||||
<script>
|
<script>
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style lang="less">
|
||||||
.headInfo {
|
.headInfo {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
|
|
@ -23,7 +23,7 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style lang="less">
|
||||||
.headInfo {
|
.headInfo {
|
||||||
position: relative;
|
position: relative;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
|
40
main.js
40
main.js
|
@ -22,27 +22,27 @@ import liuStepBar from './uni_modules/liu-step-bar/components/liu-step-bar/liu-s
|
||||||
Vue.component('uni-pop', uniPop)
|
Vue.component('uni-pop', uniPop)
|
||||||
Vue.component('liu-step-bar', liuStepBar)
|
Vue.component('liu-step-bar', liuStepBar)
|
||||||
|
|
||||||
import Vant from 'vant';
|
// import Vant from 'vant';
|
||||||
import 'vant/lib/index.less';
|
// import 'vant/lib/index.less';
|
||||||
Vue.use(Vant);
|
// Vue.use(Vant);
|
||||||
import {
|
// import {
|
||||||
RadioGroup,
|
// RadioGroup,
|
||||||
Radio,
|
// Radio,
|
||||||
Button,
|
// Button,
|
||||||
Uploader,
|
// Uploader,
|
||||||
Field,
|
// Field,
|
||||||
Checkbox,
|
// Checkbox,
|
||||||
CheckboxGroup,
|
// CheckboxGroup,
|
||||||
Progress
|
// Progress
|
||||||
} from 'vant';
|
// } from 'vant';
|
||||||
|
|
||||||
Vue.use(Radio);
|
// Vue.use(Radio);
|
||||||
Vue.use(RadioGroup);
|
// Vue.use(RadioGroup);
|
||||||
Vue.use(Button);
|
// Vue.use(Button);
|
||||||
Vue.use(Uploader);
|
// Vue.use(Uploader);
|
||||||
Vue.use(Field);
|
// Vue.use(Field);
|
||||||
Vue.use(Checkbox);
|
// Vue.use(Checkbox);
|
||||||
Vue.use(CheckboxGroup);
|
// Vue.use(CheckboxGroup);
|
||||||
|
|
||||||
|
|
||||||
const app = new Vue({
|
const app = new Vue({
|
||||||
|
|
|
@ -177,7 +177,7 @@
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style lang="less">
|
||||||
.container {
|
.container {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
|
@ -721,7 +721,7 @@
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style lang="less">
|
||||||
.blue {
|
.blue {
|
||||||
color: #108ee9;
|
color: #108ee9;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,9 +1,8 @@
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'iconfont';
|
font-family: "liicon";
|
||||||
/* Project id 3979772 */
|
src: url('~@/static/font/iconfont.woff?t=1584513180461') format('woff'),
|
||||||
src: url('//at.alicdn.com/t/c/font_3979772_sd5890vlebd.woff2?t=1679996974313') format('woff2'),
|
url('~@/static/font/iconfont.ttf?t=1584513180461') format('truetype'),
|
||||||
url('//at.alicdn.com/t/c/font_3979772_sd5890vlebd.woff?t=1679996974313') format('woff'),
|
url('~@/static/font/iconfont.svg?t=1584513180461#iconfont') format('svg');
|
||||||
url('//at.alicdn.com/t/c/font_3979772_sd5890vlebd.ttf?t=1679996974313') format('truetype');
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.iconfont {
|
.iconfont {
|
||||||
|
|
|
@ -2,10 +2,8 @@
|
||||||
<view class="uni-date">
|
<view class="uni-date">
|
||||||
<view class="uni-date-editor" @click="show">
|
<view class="uni-date-editor" @click="show">
|
||||||
<slot>
|
<slot>
|
||||||
<view
|
<view class="uni-date-editor--x"
|
||||||
class="uni-date-editor--x"
|
:class="{'uni-date-editor--x__disabled': disabled,'uni-date-x--border': border}">
|
||||||
:class="{'uni-date-editor--x__disabled': disabled,'uni-date-x--border': border}"
|
|
||||||
>
|
|
||||||
<view v-if="!isRange" class="uni-date-x uni-date-single">
|
<view v-if="!isRange" class="uni-date-x uni-date-single">
|
||||||
<uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons>
|
<uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons>
|
||||||
<view class="uni-date__x-input">{{ displayValue || singlePlaceholderText }}</view>
|
<view class="uni-date__x-input">{{ displayValue || singlePlaceholderText }}</view>
|
||||||
|
@ -13,11 +11,13 @@
|
||||||
|
|
||||||
<view v-else class="uni-date-x uni-date-range">
|
<view v-else class="uni-date-x uni-date-range">
|
||||||
<uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons>
|
<uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons>
|
||||||
<view class="uni-date__x-input text-center">{{ displayRangeValue.startDate || startPlaceholderText }}</view>
|
<view class="uni-date__x-input text-center">
|
||||||
|
{{ displayRangeValue.startDate || startPlaceholderText }}</view>
|
||||||
|
|
||||||
<view class="range-separator">{{rangeSeparator}}</view>
|
<view class="range-separator">{{rangeSeparator}}</view>
|
||||||
|
|
||||||
<view class="uni-date__x-input text-center">{{ displayRangeValue.endDate || endPlaceholderText }}</view>
|
<view class="uni-date__x-input text-center">
|
||||||
|
{{ displayRangeValue.endDate || endPlaceholderText }}</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view v-if="showClearIcon" class="uni-date__icon-clear" @click.stop="clear">
|
<view v-if="showClearIcon" class="uni-date__icon-clear" @click.stop="clear">
|
||||||
|
@ -38,16 +38,16 @@
|
||||||
:placeholder="selectDateText" />
|
:placeholder="selectDateText" />
|
||||||
|
|
||||||
<time-picker type="time" v-model="pickerTime" :border="false" :disabled="!inputDate"
|
<time-picker type="time" v-model="pickerTime" :border="false" :disabled="!inputDate"
|
||||||
:start="timepickerStartTime" :end="timepickerEndTime" :hideSecond="hideSecond" style="width: 100%;">
|
:start="timepickerStartTime" :end="timepickerEndTime" :hideSecond="hideSecond"
|
||||||
<input class="uni-date__input text-center" type="text" v-model="pickerTime" :placeholder="selectTimeText"
|
style="width: 100%;">
|
||||||
:disabled="!inputDate" />
|
<input class="uni-date__input text-center" type="text" v-model="pickerTime"
|
||||||
|
:placeholder="selectTimeText" :disabled="!inputDate" />
|
||||||
</time-picker>
|
</time-picker>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<Calendar ref="pcSingle" :showMonth="false" :start-date="calendarRange.startDate"
|
<Calendar ref="pcSingle" :showMonth="false" :start-date="calendarRange.startDate"
|
||||||
:end-date="calendarRange.endDate" :date="calendarDate" @change="singleChange"
|
:end-date="calendarRange.endDate" :date="calendarDate" @change="singleChange"
|
||||||
:default-value="defaultValue"
|
:default-value="defaultValue" style="padding: 0 8px;" />
|
||||||
style="padding: 0 8px;" />
|
|
||||||
|
|
||||||
<view v-if="hasTime" class="popup-x-footer">
|
<view v-if="hasTime" class="popup-x-footer">
|
||||||
<text class="confirm-text" @click="confirmSingleChange">{{okText}}</text>
|
<text class="confirm-text" @click="confirmSingleChange">{{okText}}</text>
|
||||||
|
@ -61,8 +61,8 @@
|
||||||
<input class="uni-date__input uni-date-range__input" type="text" v-model="tempRange.startDate"
|
<input class="uni-date__input uni-date-range__input" type="text" v-model="tempRange.startDate"
|
||||||
:placeholder="startDateText" />
|
:placeholder="startDateText" />
|
||||||
|
|
||||||
<time-picker type="time" v-model="tempRange.startTime" :start="timepickerStartTime" :border="false"
|
<time-picker type="time" v-model="tempRange.startTime" :start="timepickerStartTime"
|
||||||
:disabled="!tempRange.startDate" :hideSecond="hideSecond">
|
:border="false" :disabled="!tempRange.startDate" :hideSecond="hideSecond">
|
||||||
<input class="uni-date__input uni-date-range__input" type="text"
|
<input class="uni-date__input uni-date-range__input" type="text"
|
||||||
v-model="tempRange.startTime" :placeholder="startTimeText"
|
v-model="tempRange.startTime" :placeholder="startTimeText"
|
||||||
:disabled="!tempRange.startDate" />
|
:disabled="!tempRange.startDate" />
|
||||||
|
@ -102,8 +102,7 @@
|
||||||
|
|
||||||
<Calendar v-if="isPhone" ref="mobile" :clearDate="false" :date="calendarDate" :defTime="mobileCalendarTime"
|
<Calendar v-if="isPhone" ref="mobile" :clearDate="false" :date="calendarDate" :defTime="mobileCalendarTime"
|
||||||
:start-date="calendarRange.startDate" :end-date="calendarRange.endDate" :selectableTimes="mobSelectableTime"
|
:start-date="calendarRange.startDate" :end-date="calendarRange.endDate" :selectableTimes="mobSelectableTime"
|
||||||
:startPlaceholder="startPlaceholder" :endPlaceholder="endPlaceholder"
|
:startPlaceholder="startPlaceholder" :endPlaceholder="endPlaceholder" :default-value="defaultValue"
|
||||||
:default-value="defaultValue"
|
|
||||||
:pleStatus="endMultipleStatus" :showMonth="false" :range="isRange" :hasTime="hasTime" :insert="false"
|
:pleStatus="endMultipleStatus" :showMonth="false" :range="isRange" :hasTime="hasTime" :insert="false"
|
||||||
:hideSecond="hideSecond" @confirm="mobileChange" @maskClose="close" />
|
:hideSecond="hideSecond" @confirm="mobileChange" @maskClose="close" />
|
||||||
</view>
|
</view>
|
||||||
|
@ -133,9 +132,19 @@
|
||||||
**/
|
**/
|
||||||
import Calendar from './calendar.vue'
|
import Calendar from './calendar.vue'
|
||||||
import TimePicker from './time-picker.vue'
|
import TimePicker from './time-picker.vue'
|
||||||
import { initVueI18n } from '@dcloudio/uni-i18n'
|
import {
|
||||||
|
initVueI18n
|
||||||
|
} from '@dcloudio/uni-i18n'
|
||||||
import i18nMessages from './i18n/index.js'
|
import i18nMessages from './i18n/index.js'
|
||||||
import { getDateTime, getDate, getTime, getDefaultSecond, dateCompare, checkDate, fixIosDateFormat } from './util'
|
import {
|
||||||
|
getDateTime,
|
||||||
|
getDate,
|
||||||
|
getTime,
|
||||||
|
getDefaultSecond,
|
||||||
|
dateCompare,
|
||||||
|
checkDate,
|
||||||
|
fixIosDateFormat
|
||||||
|
} from './util'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'UniDatetimePicker',
|
name: 'UniDatetimePicker',
|
||||||
|
@ -373,7 +382,8 @@
|
||||||
return this.i18nT("uni-datetime-picker.clear")
|
return this.i18nT("uni-datetime-picker.clear")
|
||||||
},
|
},
|
||||||
showClearIcon() {
|
showClearIcon() {
|
||||||
return this.clearIcon && !this.disabled && (this.displayValue || (this.displayRangeValue.startDate && this.displayRangeValue.endDate))
|
return this.clearIcon && !this.disabled && (this.displayValue || (this.displayRangeValue.startDate && this
|
||||||
|
.displayRangeValue.endDate))
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
@ -454,7 +464,9 @@
|
||||||
this.isPhone = navigator.userAgent.toLowerCase().indexOf('mobile') !== -1
|
this.isPhone = navigator.userAgent.toLowerCase().indexOf('mobile') !== -1
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const { windowWidth } = uni.getSystemInfoSync()
|
const {
|
||||||
|
windowWidth
|
||||||
|
} = uni.getSystemInfoSync()
|
||||||
this.isPhone = windowWidth <= 500
|
this.isPhone = windowWidth <= 500
|
||||||
this.windowWidth = windowWidth
|
this.windowWidth = windowWidth
|
||||||
},
|
},
|
||||||
|
@ -624,7 +636,10 @@
|
||||||
},
|
},
|
||||||
mobileChange(e) {
|
mobileChange(e) {
|
||||||
if (this.isRange) {
|
if (this.isRange) {
|
||||||
const {before, after} = e.range
|
const {
|
||||||
|
before,
|
||||||
|
after
|
||||||
|
} = e.range
|
||||||
|
|
||||||
if (!before || !after) {
|
if (!before || !after) {
|
||||||
return
|
return
|
||||||
|
@ -818,6 +833,7 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.uni-date-x {
|
.uni-date-x {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
@ -832,6 +848,7 @@
|
||||||
.icon-calendar {
|
.icon-calendar {
|
||||||
padding-left: 3px;
|
padding-left: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.range-separator {
|
.range-separator {
|
||||||
height: 35px;
|
height: 35px;
|
||||||
/* #ifndef MP */
|
/* #ifndef MP */
|
||||||
|
|
Loading…
Reference in New Issue