diff --git a/components/timePickerPopup/README.md b/components/timePickerPopup/README.md new file mode 100644 index 0000000..91e3133 --- /dev/null +++ b/components/timePickerPopup/README.md @@ -0,0 +1,87 @@ +### 使用组件 + +```html + +``` + +### 引入组件 + +```javascript +import TimePickerPopup from '@/components/time-picker-popup/time-picker-popup.vue'; +``` + +### 注册组件 + +```javascript +export default { + components: { TimePickerPopup }, + data() { + return { + value: ['00', '00', '00', '00'] + } + }, + onReady() { + this.open(); + }, + methods: { + confirm(data) { + uni.showToast({ + title: `${data[0]}:${data[1]}-${data[2]}:${data[3]}` + }) + }, + open() { + this.$refs.TimePickerPopupRef.open(); + } + } +} +``` + +### 参数 + +```javascript +// 当前选中的值 +value: { + type: Array, + default: () => (['00', '00', '00', '00']) +}, +// 标题 +title: { + type: String, + default: '时间' +}, +// 取消按钮文字 +cancelText: { + type: String, + default: '取消' +}, +// 取消按钮颜色 +canceColor: { + type: String, + default: '#666666' +}, +// 确定按钮文字 +confirmText: { + type: String, + default: '确定' +}, +// 确定按钮颜色 +confirmColor: { + type: String, + default: '#2bb781' +}, +// 分割符 +segmentation: { + type: String, + default: '-' +}, +// 设置选择器中间选中框的类名 注意页面或组件的style中写了scoped时,需要在类名前写/deep/ +indicatorClass: { + type: String, + default: 'picker-view__indicator' +}, +// 设置选择器中间选中框的样式 +indicatorStyle: { + type: String, + default: '' +}, +``` diff --git a/components/timePickerPopup/time-picker-popup.vue b/components/timePickerPopup/time-picker-popup.vue new file mode 100644 index 0000000..7a07f60 --- /dev/null +++ b/components/timePickerPopup/time-picker-popup.vue @@ -0,0 +1,159 @@ + + + + + \ No newline at end of file diff --git a/components/timePickerPopup/utils.js b/components/timePickerPopup/utils.js new file mode 100644 index 0000000..e093659 --- /dev/null +++ b/components/timePickerPopup/utils.js @@ -0,0 +1,69 @@ +// 组件props +const props = { + // 当前选中的值 + value: { + type: Array, + default: () => (['00', '00', '00', '00']) + }, + // 标题 + title: { + type: String, + default: '时间' + }, + // 取消按钮文字 + cancelText: { + type: String, + default: '取消' + }, + // 取消按钮颜色 + canceColor: { + type: String, + default: '#666666' + }, + // 确定按钮文字 + confirmText: { + type: String, + default: '确定' + }, + // 确定按钮颜色 + confirmColor: { + type: String, + default: '#2bb781' + }, + // 分割符 + segmentation: { + type: String, + default: '-' + }, + // 设置选择器中间选中框的类名 注意页面或组件的style中写了scoped时,需要在类名前写/deep/ + indicatorClass: { + type: String, + default: 'picker-view__indicator' + }, + // 设置选择器中间选中框的样式 + indicatorStyle: { + type: String, + default: '' + }, +} + +// 滚动数据 +let range = [ + [], + [], + [], + [] +]; +for (let i = 0; i < 24; i++) { + range[0].push(i >= 10 ? String(i) : `0${i}`); + range[2].push(i >= 10 ? String(i) : `0${i}`); +} +for (let i = 0; i < 60; i++) { + range[1].push(i >= 10 ? String(i) : `0${i}`); + range[3].push(i >= 10 ? String(i) : `0${i}`); +} + +export default { + props, + range +} \ No newline at end of file diff --git a/components/tpf-time-range/tpf-time-range.vue b/components/tpf-time-range/tpf-time-range.vue new file mode 100644 index 0000000..ab34330 --- /dev/null +++ b/components/tpf-time-range/tpf-time-range.vue @@ -0,0 +1,316 @@ + + + + + \ No newline at end of file diff --git a/pkg_join/views/supplier.vue b/pkg_join/views/supplier.vue index 60e4a5b..97f660f 100644 --- a/pkg_join/views/supplier.vue +++ b/pkg_join/views/supplier.vue @@ -187,6 +187,7 @@ + + + + + + +