测试诗画登录

This commit is contained in:
weiwei committed 2025-04-08 15:30:45 +08:00
1 parent 2f34b15cb1
commit a2ee2f402c
5 files changed
+494 -394

No files matched your search

+3
View File
@@ -70,7 +70,10 @@ export default {
async onLaunch() {
if (isDevEnv()) return
uni.setNavigationBarTitle({ title: "" })
console.log("环境判断")
// 诗画浦江获取用户信息进行环境判断
const res = await (window as any).CP2.getAppInfo()
if (res.code == 0) {
+17 -2
View File
@@ -37,6 +37,11 @@
退出登录
</view>
</view>
<view v-if="state.appInfo == 'sh'" class="flex-col-center m-t-40rpx m-x-30rpx">
<view class="w-full text-center sub-text-28 p-y-20rpx rounded-40rpx border-solid border border-#0094ff" @tap="doChangeRole">
切换角色
</view>
</view>
</crud-layout>
</template>
@@ -45,6 +50,7 @@ import { reactive } from "vue"
import { onLoad, onShow } from "@dcloudio/uni-app"
import { isEmpty } from "radash"
import { filePath } from "@@/utils/file"
import { getAppInfo } from "@@/utils/getAppInfo"
import { hooks, router, constant } from "@@/index"
import { userApi } from "@@/api"
import isDevEnv from "@/sheep/utils/isDevEnv"
@@ -57,7 +63,7 @@ interface MenuItem {
router: string
}
const state = reactive<{ wallet: any; userInfo: any; menuList: MenuItem[] }>({
const state = reactive<{ wallet: any; userInfo: any; menuList: MenuItem[]; appInfo: string }>({
wallet: [],
userInfo: {},
menuList: [
@@ -67,6 +73,7 @@ const state = reactive<{ wallet: any; userInfo: any; menuList: MenuItem[] }>({
// { text: "跨单位就餐", icon: "/static/icon/service_1.png", router: "/pages/apply/stride-list" },
{ text: "人脸管理", icon: "/static/icon/service_5.png", router: "/pages/human-face/list" },
],
appInfo: "",
})
const onTabLogin = () => (isDevEnv() ? router.jump("/pages/test/login") : checkAppInfo())
@@ -190,6 +197,12 @@ const doLogout = async () => {
uni.showToast({ title: "退出登录成功", icon: "none" })
}
// 切换角色
const doChangeRole = () => {
uni.removeStorageSync("userRole")
router.jump("/pages/user/userRole")
}
// 扫一扫
const doScanCode = async () => {
usePayStore().setPayData({})
@@ -279,7 +292,7 @@ const getStorageUserInfo = () => {
}
}
onLoad(() => {
onLoad(async () => {
const app = getApp()
app._initTabbar()
@@ -301,6 +314,8 @@ onLoad(() => {
router: "",
})
: ""
state.appInfo = await getAppInfo()
})
onShow(() => {
getStorageUserInfo()
+2 -2
View File
@@ -48,7 +48,7 @@ const selectRole = (role: "user" | "merchant") => (userRole.value = role)
// 确认选择
const confirmRole = () => {
uni.setStorageSync("userRole", userRole.value)
if (userRole.value === "user") uni.switchTab({ url: "/pages/tabbar/coopMerchant" })
if (userRole.value === "merchant") uni.switchTab({ url: "/pages/tabbar/individualOrder" })
if (userRole.value === "user") uni.reLaunch({ url: "/pages/tabbar/coopMerchant" })
if (userRole.value === "merchant") uni.reLaunch({ url: "/pages/tabbar/individualOrder" })
}
</script>
+15
View File
@@ -0,0 +1,15 @@
// 检测app信息判断运行环境
export const getAppInfo = async (): Promise<string> => {
try {
const res = await (window as any).CP2.getAppInfo()
// 浙政钉环境
if (res.code === 0) {
return "dd"
} else {
// 诗画环境
return "sh"
}
} catch (error) {
return "unknown"
}
}
@@ -1,8 +1,8 @@
<script setup lang="ts">
import { ref, computed, onMounted, watch, type PropType } from 'vue';
import { useTmConfig } from "../../libs/config";
import { tmDate, type tmDateTypeTime, createDate } from '../../libs/tmDate';
import { getDefaultColor } from "../../libs/colors";
import { ref, computed, onMounted, watch, type PropType } from "vue"
import { useTmConfig } from "../../libs/config"
import { tmDate, type tmDateTypeTime, createDate } from "../../libs/tmDate"
import { getDefaultColor } from "../../libs/colors"
type PICKER_ITEM_INFO = Record<string, any>
@@ -16,161 +16,161 @@ type PICKER_ITEM_INFO = Record<string, any>
| --- | --- | --- | --- |
| ☑️| ☑️ | ☑️ | ☑️ | ☑️ | 1.0.0 |
*/
defineOptions({ name: 'TmBetweenTime' });
defineOptions({ name: "TmBetweenTime" })
const { config } = useTmConfig()
type coverValue = {
value: string[],
str: string
value: string[]
str: string
}
type ModelType = "year" | "month" | "day" | "hour" | "minute" | "second";
type ModelType = "year" | "month" | "day" | "hour" | "minute" | "second"
const props = defineProps({
/**
* 当前时间,与modelStr不同,此提供的值必须是正常的时间格式
* 否则报错,无法运行。
*/
modelValue: {
type: [Array<string>],
default: (): string[] => [] as string[]
},
/**
* 当前时间经过format格式化后输出的值。
* 此值不会处理输入,只输出显示。
*/
modelStr: {
type: String,
default: ""
},
/**
* 当前打开的状态。
* 等同v-model:model-show
*/
modelShow: {
type: Boolean,
default: false
},
/**
* 顶部标题
*/
title: {
type: String,
default: "请选择时间"
},
/**
* 开始时间,请提供正确的时间格式
*/
start: {
type: String,
default: ""
},
/**
* 结束时间,请提供正确的时间格式
*/
end: {
type: String,
default: ""
},
/**
* 精确到的级别,这里只是展示,具体的返回值还是完整的值。
* year:年
* month:年月
* day:年月日
* hour:年月日小时
* minute:年月日小时分钟
* second:年月日小时分钟秒
*/
type: {
type: String as PropType<ModelType>,
default: "day"
},
/**
* 输出时间格式,只对v-model:modelStr及输入框展示有效
* 因此它可能不是一个标准时间,比如YY SS ,所以不能作为modelValue使用
* 有效格式:
* YYYY年
* MM月
* DD日
* hh小时
* mm分钟
* ss秒
*/
format: {
type: String,
default: "YYYY-MM-DD"
},
/**
* 上方的单位名称
*/
cellUnits: {
type: Array as PropType<string[]>,
default: (): string[] => ['年', '月', '日', '时', '分', '秒'] as string[]
},
/**
* 快速时间区间选择,如果直接填写数字字符,会以你提供的数字最近多少来天来算。
* d:本日
* w:本周
* m:本月
* y:本年
* q:本季度
* 7:最近7天,后面的依此类推,数字的就是最近xx天。
*/
quickDate: {
type: [Array<string>],
default: (): string[] => ['d', 'w', 'm', 'y', 'q'] as string[]
},
/**
* 是否懒加载内部内容。
* 当前你的列表内容非常多,且影响打开的动画性能时,请务必
* 设置此项为true,以获得流畅视觉效果。如果选择数据较少没有必要打开
*/
lazyContent: {
type: Boolean,
default: false
},
/**
* 如果你的快捷选择较多可能会让高度不足,需要自行设置下高。
*/
drawerSize: {
type: String,
default: '1020'
}
/**
* 当前时间,与modelStr不同,此提供的值必须是正常的时间格式
* 否则报错,无法运行。
*/
modelValue: {
type: [Array<string>],
default: (): string[] => [] as string[],
},
/**
* 当前时间经过format格式化后输出的值。
* 此值不会处理输入,只输出显示。
*/
modelStr: {
type: String,
default: "",
},
/**
* 当前打开的状态。
* 等同v-model:model-show
*/
modelShow: {
type: Boolean,
default: false,
},
/**
* 顶部标题
*/
title: {
type: String,
default: "请选择时间",
},
/**
* 开始时间,请提供正确的时间格式
*/
start: {
type: String,
default: "",
},
/**
* 结束时间,请提供正确的时间格式
*/
end: {
type: String,
default: "",
},
/**
* 精确到的级别,这里只是展示,具体的返回值还是完整的值。
* year:年
* month:年月
* day:年月日
* hour:年月日小时
* minute:年月日小时分钟
* second:年月日小时分钟秒
*/
type: {
type: String as PropType<ModelType>,
default: "day",
},
/**
* 输出时间格式,只对v-model:modelStr及输入框展示有效
* 因此它可能不是一个标准时间,比如YY SS ,所以不能作为modelValue使用
* 有效格式:
* YYYY年
* MM月
* DD日
* hh小时
* mm分钟
* ss秒
*/
format: {
type: String,
default: "YYYY-MM-DD",
},
/**
* 上方的单位名称
*/
cellUnits: {
type: Array as PropType<string[]>,
default: (): string[] => ["年", "月", "日", "时", "分", "秒"] as string[],
},
/**
* 快速时间区间选择,如果直接填写数字字符,会以你提供的数字最近多少来天来算。
* d:本日
* w:本周
* m:本月
* y:本年
* q:本季度
* 7:最近7天,后面的依此类推,数字的就是最近xx天。
*/
quickDate: {
type: [Array<string>],
default: (): string[] => ["d", "w", "m", "y", "q"] as string[],
},
/**
* 是否懒加载内部内容。
* 当前你的列表内容非常多,且影响打开的动画性能时,请务必
* 设置此项为true,以获得流畅视觉效果。如果选择数据较少没有必要打开
*/
lazyContent: {
type: Boolean,
default: false,
},
/**
* 如果你的快捷选择较多可能会让高度不足,需要自行设置下高。
*/
drawerSize: {
type: String,
default: "1020",
},
})
const emit = defineEmits([
/**
* 取消时触发
*/
'cancel',
/**
* 确认触发
* @param {string} date 当前选中时间
*/
'confirm',
/**
* 滑动变换时触发
* @param {string} date - 当前选中时间
*/
'change',
/**
* 变量控制打开状态
* 等同v-model:model-show
*/
'update:modelShow',
/**
* 经格式化后的值。等同v-model:model-str
*/
'update:modelStr',
'update:modelValue'
]);
/**
* 取消时触发
*/
"cancel",
/**
* 确认触发
* @param {string} date 当前选中时间
*/
"confirm",
/**
* 滑动变换时触发
* @param {string} date - 当前选中时间
*/
"change",
/**
* 变量控制打开状态
* 等同v-model:model-show
*/
"update:modelShow",
/**
* 经格式化后的值。等同v-model:model-str
*/
"update:modelStr",
"update:modelValue",
])
let startValue = new tmDate()
let endValue = new tmDate()
startValue.subtraction(1, 'y')
startValue.subtraction(1, "y")
const show = ref(false)
const nowValue = ref<string[]>(['', ''])
const nowModelValue = ref<string[]>(['', ''])
const nowValue = ref<string[]>(["", ""])
const nowModelValue = ref<string[]>(["", ""])
const startDate = ref(startValue)
const endDate = ref(endValue)
const changeIndex = ref(0)
@@ -179,338 +179,405 @@ const quicklist = ref<coverValue[]>([])
const _lazyContent = computed(() => props.lazyContent)
const _start_date = computed(() => props.start === "" ? startDate.value : new tmDate(props.start))
const _end_date = computed(() => props.end === "" ? endDate.value : new tmDate(props.end))
const _start_date = computed(() => (props.start === "" ? startDate.value : new tmDate(props.start)))
const _end_date = computed(() => (props.end === "" ? endDate.value : new tmDate(props.end)))
const _start_date_str = computed(() => _start_date.value.format())
const _end_date_str = computed(() => _end_date.value.format())
const _start_date_str_format = computed(() => nowValue.value[0] === '' ? '开始时间' : (new tmDate(nowValue.value[0])).format(props.format))
const _end_date_str_format = computed(() => nowValue.value[1] === '' ? '结束时间' : (new tmDate(nowValue.value[1])).format(props.format))
const _start_date_str_format = computed(() => (nowValue.value[0] === "" ? "开始时间" : new tmDate(nowValue.value[0]).format(props.format)))
const _end_date_str_format = computed(() => (nowValue.value[1] === "" ? "结束时间" : new tmDate(nowValue.value[1]).format(props.format)))
const _backgroundColor = computed(() => config.mode === 'dark' ? getDefaultColor(config.inputDarkColor) : getDefaultColor('#f5f5f5'))
const _borderColor = computed(() => config.mode === 'dark' ? getDefaultColor(config.borderDarkColor) : getDefaultColor('#eaeaea'))
const _backgroundColor = computed(() => (config.mode === "dark" ? getDefaultColor(config.inputDarkColor) : getDefaultColor("#f5f5f5")))
const _borderColor = computed(() => (config.mode === "dark" ? getDefaultColor(config.borderDarkColor) : getDefaultColor("#eaeaea")))
const _activeBorderColor = computed(() => getDefaultColor(config.color))
const _placeStyle = computed(() => config.mode === 'dark' ? "color:#c7c7c7;" : "color:#838383;")
const _fontColor = computed(() => config.mode === 'dark' ? "#efefef" : "#333")
const _isDark = computed(() => config.mode === 'dark')
const _placeStyle = computed(() => (config.mode === "dark" ? "color:#c7c7c7;" : "color:#838383;"))
const _fontColor = computed(() => (config.mode === "dark" ? "#efefef" : "#333"))
const _isDark = computed(() => config.mode === "dark")
watch(() => props.modelValue, (newvalue: string[]) => {
let sortvalue = sorDateVaild(validTimeDate(newvalue))
let newvaluestr = sortvalue.join('')
if (newvaluestr === nowModelValue.value.join('')) return
nowValue.value = sortvalue
nowModelValue.value = sortvalue
tongbuModelStr()
})
watch(
() => props.modelValue,
(newvalue: string[]) => {
let sortvalue = sorDateVaild(validTimeDate(newvalue))
let newvaluestr = sortvalue.join("")
if (newvaluestr === nowModelValue.value.join("")) return
nowValue.value = sortvalue
nowModelValue.value = sortvalue
tongbuModelStr()
},
)
watch(() => props.modelShow, (newValue: boolean) => {
if (newValue === show.value) return
show.value = newValue
})
watch(
() => props.modelShow,
(newValue: boolean) => {
if (newValue === show.value) return
show.value = newValue
},
)
watch(() => props.quickDate, (newvalue: string[]) => {
quicklist.value = getQuickDateType()
})
watch(
() => props.quickDate,
(newvalue: string[]) => {
quicklist.value = getQuickDateType()
},
)
onMounted(() => {
yanchiDuration.value = _lazyContent.value ? false : true
yanchiDuration.value = _lazyContent.value ? false : true
let str = validTimeDate(props.modelValue)
nowValue.value = str
nowModelValue.value = str
quicklist.value = getQuickDateType()
tongbuModelStr()
let str = validTimeDate(props.modelValue)
nowValue.value = str
nowModelValue.value = str
quicklist.value = getQuickDateType()
tongbuModelStr()
})
function clearDate() {
let dst = ['', ''] as string[]
nowValue.value = dst
let dst = ["", ""] as string[]
nowValue.value = dst
}
function tongbuModelStr() {
let str = coverStrVal()
/**
* 经格式化后的值。等同v-model:model-str
*/
emit('update:modelStr', str === '~' ? '' : str)
let str = coverStrVal()
/**
* 经格式化后的值。等同v-model:model-str
*/
emit("update:modelStr", str === "~" ? "" : str)
}
function dateChangeView(datestr: string) {
let nowvalu = nowValue.value.slice(0)
nowvalu[changeIndex.value] = datestr
let strStart = nowvalu[0]
let strEnd = nowvalu[1]
let types = getTypes()
if (strEnd !== '' && strStart !== '') {
if (changeIndex.value === 0) {
if (new tmDate(strStart).isBetweenOf(new tmDate(strEnd), '>', types)) {
strEnd = strStart
}
} else if (changeIndex.value === 1) {
if (new tmDate(strEnd).isBetweenOf(new tmDate(strStart), '<', types)) {
strStart = strEnd
}
}
}
let nowvalu = nowValue.value.slice(0)
nowvalu[changeIndex.value] = datestr
let strStart = nowvalu[0]
let strEnd = nowvalu[1]
let types = getTypes()
if (strEnd !== "" && strStart !== "") {
if (changeIndex.value === 0) {
if (new tmDate(strStart).isBetweenOf(new tmDate(strEnd), ">", types)) {
strEnd = strStart
}
} else if (changeIndex.value === 1) {
if (new tmDate(strEnd).isBetweenOf(new tmDate(strStart), "<", types)) {
strStart = strEnd
}
}
}
nowValue.value = [strStart, strEnd]
nowValue.value = [strStart, strEnd]
}
function tagsClick(item: coverValue) {
nowValue.value = item.value
nowValue.value = item.value
}
function inputClick(index: number) {
changeIndex.value = index
changeIndex.value = index
let nowvalu = nowValue.value.slice(0)
let strStart = nowvalu[0]
let strEnd = nowvalu[1]
let nowvalu = nowValue.value.slice(0)
let strStart = nowvalu[0]
let strEnd = nowvalu[1]
if (changeIndex.value === 0) {
if (strStart === '') {
strStart = strEnd !== '' ? strEnd : (endDate.value.format())
nowValue.value = [strStart, strEnd]
}
} else if (changeIndex.value === 1) {
if (strEnd === '') {
strEnd = strStart !== '' ? strStart : (endDate.value.format())
nowValue.value = [strStart, strEnd]
}
}
if (changeIndex.value === 0) {
if (strStart === "") {
strStart = strEnd !== "" ? strEnd : endDate.value.format()
nowValue.value = [strStart, strEnd]
}
} else if (changeIndex.value === 1) {
if (strEnd === "") {
strEnd = strStart !== "" ? strStart : endDate.value.format()
nowValue.value = [strStart, strEnd]
}
}
}
function getQuickDateType(): coverValue[] {
let typelist: coverValue[] = []
if (props.quickDate.length === 0) return typelist
let list = props.quickDate
for (let i = 0; i < list.length; i++) {
let item: string = list[i]
if (!isNaN(parseInt(item))) {
let dshi = parseInt(item)! as number
let date = new tmDate()
let start = date.format()
date.subtraction(dshi, 'd')
let end = date.format()
let typelist: coverValue[] = []
if (props.quickDate.length === 0) return typelist
let list = props.quickDate
for (let i = 0; i < list.length; i++) {
let item: string = list[i]
if (!isNaN(parseInt(item))) {
let dshi = parseInt(item)! as number
let date = new tmDate()
let start = date.format()
date.subtraction(dshi, "d")
let end = date.format()
typelist.push({ value: [end, start], str: '最近' + item + '天' } as coverValue)
} else {
let date = new tmDate()
let startFDate = "YYYY/DD/MM 00:00:00"
let endFDate = "YYYY/DD/MM 23:59:59"
let start = date.format(startFDate)
let end = date.format(endFDate)
let desc = "本日"
if (item === 'w') {
start = date.getDateStartOf('w').format(startFDate)
end = date.getDateEndOf('w').format(endFDate)
desc = "本周"
} else if (item === 'm') {
start = date.getDateStartOf('m').format(startFDate)
end = date.getDateEndOf('m').format(endFDate)
desc = "本月"
} else if (item === 'y') {
start = date.getDateStartOf('y').format(startFDate)
end = date.getDateEndOf('y').format(endFDate)
desc = "本年"
} else if (item === 'q') {
let nowq = date.getQuarter('')
let itemqatar = nowq[0]
start = itemqatar.start
end = itemqatar.end
desc = "本季度"
}
typelist.push({ value: [end, start], str: "最近" + item + "天" } as coverValue)
} else {
let date = new tmDate()
let startFDate = "YYYY/DD/MM 00:00:00"
let endFDate = "YYYY/DD/MM 23:59:59"
let start = date.format(startFDate)
let end = date.format(endFDate)
let desc = "本日"
if (item === "w") {
start = date.getDateStartOf("w").format(startFDate)
end = date.getDateEndOf("w").format(endFDate)
desc = "本周"
} else if (item === "m") {
start = date.getDateStartOf("m").format(startFDate)
end = date.getDateEndOf("m").format(endFDate)
desc = "本月"
} else if (item === "y") {
start = date.getDateStartOf("y").format(startFDate)
end = date.getDateEndOf("y").format(endFDate)
desc = "本年"
} else if (item === "q") {
let nowq = date.getQuarter("")
let itemqatar = nowq[0]
start = itemqatar.start
end = itemqatar.end
desc = "本季度"
}
typelist.push({ value: [start, end], str: desc } as coverValue)
}
}
return typelist
typelist.push({ value: [start, end], str: desc } as coverValue)
}
}
return typelist
}
// 获取精确单位
function getTypes(): tmDateTypeTime {
if (props.type === 'year') {
return 'y' as tmDateTypeTime
} else if (props.type === 'month') {
return 'm' as tmDateTypeTime
} else if (props.type === 'day') {
return 'd' as tmDateTypeTime
} else if (props.type === 'hour') {
return 'h' as tmDateTypeTime
} else if (props.type === 'minute') {
return 'M' as tmDateTypeTime
} else if (props.type === 'second') {
return 's' as tmDateTypeTime
}
return 's' as tmDateTypeTime
if (props.type === "year") {
return "y" as tmDateTypeTime
} else if (props.type === "month") {
return "m" as tmDateTypeTime
} else if (props.type === "day") {
return "d" as tmDateTypeTime
} else if (props.type === "hour") {
return "h" as tmDateTypeTime
} else if (props.type === "minute") {
return "M" as tmDateTypeTime
} else if (props.type === "second") {
return "s" as tmDateTypeTime
}
return "s" as tmDateTypeTime
}
//验证提供的值是否合法,并纠正为合法值。
function validTimeDate(val: string[]): string[] {
let str = ['', '']
if (val.length >= 1) {
str[0] = val[0]!
}
if (val.length >= 2) {
str[1] = val[1]!
}
let str = ["", ""]
if (val.length >= 1) {
str[0] = val[0]!
}
if (val.length >= 2) {
str[1] = val[1]!
}
return sorDateVaild(str)
return sorDateVaild(str)
}
function sorDateVaild(str: string[]): string[] {
let types = getTypes()
str.sort((a: string, b: string): number => {
return new tmDate(a).getTime(types) - new tmDate(b).getTime(types)
})
return str
let types = getTypes()
str.sort((a: string, b: string): number => {
return new tmDate(a).getTime(types) - new tmDate(b).getTime(types)
})
return str
}
function openShow() {
show.value = true
/**
* 变量控制打开状态
* 等同v-model:model-show
*/
emit('update:modelShow', true)
show.value = true
/**
* 变量控制打开状态
* 等同v-model:model-show
*/
emit("update:modelShow", true)
}
function onClose() {
/**
* 变量控制打开状态
* 等同v-model:model-show
*/
emit('update:modelShow', false)
cancelResetDataCol()
if (_lazyContent.value) {
yanchiDuration.value = false
}
/**
* 变量控制打开状态
* 等同v-model:model-show
*/
emit("update:modelShow", false)
cancelResetDataCol()
if (_lazyContent.value) {
yanchiDuration.value = false
}
}
function onOpen() {
yanchiDuration.value = true
yanchiDuration.value = true
}
function onCancel() {
emit('cancel')
cancelResetDataCol()
emit("cancel")
show.value = false
cancelResetDataCol()
}
function cancelResetDataCol() {
nowValue.value = nowModelValue.value.slice(0)
nowValue.value = nowModelValue.value.slice(0)
}
function coverStrVal(): string {
let estrt = nowValue.value[0]
let eend = nowValue.value[1]
let start = estrt === '' ? '' : (new tmDate(estrt)).format(props.format)
let ebd = eend === '' ? '' : (new tmDate(eend)).format(props.format)
return start + '~' + ebd
let estrt = nowValue.value[0]
let eend = nowValue.value[1]
let start = estrt === "" ? "" : new tmDate(estrt).format(props.format)
let ebd = eend === "" ? "" : new tmDate(eend).format(props.format)
return start + "~" + ebd
}
function onConfirm() {
let str = coverStrVal()
let tmdate: string[] = []
if (nowValue.value[0] !== '' && nowValue.value[1] !== '') {
tmdate = nowValue.value.slice(0)
nowModelValue.value = tmdate
}
/**
* 点击确认时同步。等同v-model
*/
emit('update:modelValue', tmdate)
let str = coverStrVal()
let tmdate: string[] = []
if (nowValue.value[0] !== "" && nowValue.value[1] !== "") {
tmdate = nowValue.value.slice(0)
nowModelValue.value = tmdate
}
/**
* 点击确认时同步。等同v-model
*/
emit("update:modelValue", tmdate)
/**
* 经格式化后的值。等同v-model:model-str
*/
emit('update:modelStr', str === '~' ? '' : str)
/**
* 经格式化后的值。等同v-model:model-str
*/
emit("update:modelStr", str === "~" ? "" : str)
emit('confirm', tmdate)
emit("confirm", tmdate)
show.value = false
}
</script>
<template>
<view @click="openShow">
<!--
<view @click="openShow">
<!--
@slot 插槽,默认触发打开选择器。你的默认布局可以放置在这里。
-->
<slot></slot>
</view>
<tm-drawer @open="onOpen" :widthCoverCenter="true" :disabledScroll="true" @close="onClose" @confirm="onConfirm"
@cancel="onCancel" :showFooter="true" v-model:show="show" :size="drawerSize" :showClose="false">
<template v-slot:title>
<view
style="padding: 0 20px;flex:1;display: flex;flex-direction: row;justify-content: space-between;align-items: center;height: 100%;">
<tm-text>{{ title }}</tm-text>
<tm-text @click="clearDate" style="opacity: 0.5;">清空</tm-text>
</view>
</template>
<view v-if="yanchiDuration" class="tmPickerDateWrap">
<view v-if="quicklist.length > 0" class="tmPickerDateWrapQuickTags">
<tm-tag font-size="26" :font-color="(_isDark ? 'white' : '')" @click="tagsClick(item)" skin='thin'
size="m" style="margin-right:10px;margin-bottom: 5px;" v-for="(item, index) in quicklist"
:key="index">{{
item.str }}</tm-tag>
</view>
<view v-if="quicklist.length > 0" style="height: 8px;"></view>
<view class="tmPickerDateWrapQuickInput">
<view @click="inputClick(0)" style="flex:1;height: 40px;">
<input :placeholder-style="_placeStyle"
:style="{ color: changeIndex == 0 ? _activeBorderColor : _fontColor, border: `2px solid ${changeIndex == 0 ? _activeBorderColor : _borderColor}`, backgroundColor: _backgroundColor }"
class="tmPickerInput" :disabled="true" :value="_start_date_str_format" />
</view>
<tm-text style="width: 64px;text-align: center;">至</tm-text>
<view @click="inputClick(1)" style="flex:1;height: 40px;">
<input :placeholder-style="_placeStyle"
:style="{ color: changeIndex == 1 ? _activeBorderColor : _fontColor, border: `2px solid ${changeIndex == 1 ? _activeBorderColor : _borderColor}`, backgroundColor: _backgroundColor }"
class="tmPickerInput" :disabled="true" :value="_end_date_str_format" />
</view>
</view>
<tm-date-view v-if="show" @change="dateChangeView" :format="format" :type="type" :cell-units="cellUnits"
:start="_start_date_str" :end="_end_date_str" :model-value='nowValue[changeIndex]'></tm-date-view>
</view>
<tm-icon v-if="!yanchiDuration" size="42" spin name="loader-line"></tm-icon>
</tm-drawer>
<slot></slot>
</view>
<tm-drawer
@open="onOpen"
:widthCoverCenter="true"
:disabledScroll="true"
@close="onClose"
:showFooter="true"
v-model:show="show"
:size="drawerSize"
:showClose="false"
>
<template v-slot:title>
<view
style="
padding: 0 20px;
flex: 1;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 100%;
"
>
<tm-text>{{ title }}</tm-text>
<tm-text @click="clearDate" style="opacity: 0.5">清空</tm-text>
</view>
</template>
<view v-if="yanchiDuration" class="tmPickerDateWrap">
<view v-if="quicklist.length > 0" class="tmPickerDateWrapQuickTags">
<tm-tag
font-size="26"
:font-color="_isDark ? 'white' : ''"
@click="tagsClick(item)"
skin="thin"
size="m"
style="margin-right: 10px; margin-bottom: 5px"
v-for="(item, index) in quicklist"
:key="index"
>{{ item.str }}</tm-tag
>
</view>
<view v-if="quicklist.length > 0" style="height: 8px"></view>
<view class="tmPickerDateWrapQuickInput">
<view @click="inputClick(0)" style="flex: 1; height: 40px">
<input
:placeholder-style="_placeStyle"
:style="{
color: changeIndex == 0 ? _activeBorderColor : _fontColor,
border: `2px solid ${changeIndex == 0 ? _activeBorderColor : _borderColor}`,
backgroundColor: _backgroundColor,
}"
class="tmPickerInput"
:disabled="true"
:value="_start_date_str_format"
/>
</view>
<tm-text style="width: 64px; text-align: center">至</tm-text>
<view @click="inputClick(1)" style="flex: 1; height: 40px">
<input
:placeholder-style="_placeStyle"
:style="{
color: changeIndex == 1 ? _activeBorderColor : _fontColor,
border: `2px solid ${changeIndex == 1 ? _activeBorderColor : _borderColor}`,
backgroundColor: _backgroundColor,
}"
class="tmPickerInput"
:disabled="true"
:value="_end_date_str_format"
/>
</view>
</view>
<tm-date-view
v-if="show"
@change="dateChangeView"
:format="format"
:type="type"
:cell-units="cellUnits"
:start="_start_date_str"
:end="_end_date_str"
:model-value="nowValue[changeIndex]"
></tm-date-view>
</view>
<tm-icon v-if="!yanchiDuration" size="42" spin name="loader-line"></tm-icon>
<template #footer>
<view class="flex px-4">
<tm-button @click="onCancel" :block="true" skin="thin">取消</tm-button>
&nbsp;&nbsp;
<tm-button @click="onConfirm" :block="true">确认</tm-button>
</view>
</template>
</tm-drawer>
</template>
<style scoped>
.tmPickerDateText {
text-align: left;
transition-duration: 350ms;
transition-timing-function: linear;
transition-property: transform, opacity;
transform: translateY(100%) scale(0);
opacity: 0;
text-align: left;
transition-duration: 350ms;
transition-timing-function: linear;
transition-property: transform, opacity;
transform: translateY(100%) scale(0);
opacity: 0;
}
.tmPickerDateWrapQuickInputPlackeTips {
flex: 1;
display: flex;
flex-direction: row;
pointer-events: none;
flex: 1;
display: flex;
flex-direction: row;
pointer-events: none;
}
.tmPickerInput {
border-radius: 80rpx;
height: 80rpx;
border-radius: 80rpx;
height: 80rpx;
padding: 0 20rpx;
font-size: 30rpx;
flex: 1;
pointer-events: none;
text-align: center;
padding: 0 20rpx;
font-size: 30rpx;
flex: 1;
pointer-events: none;
text-align: center;
}
.tmPickerDateWrapQuickInput {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-bottom: 16rpx;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-bottom: 16rpx;
}
.tmPickerDateWrapQuickTags {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 16rpx;
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 16rpx;
}
</style>
</style>