Merge branch 'ymf' of https://newgitea.sxczgkj.cn/czg_team/cashier_app into new_gyq

components/my-components/my-hour-area.vue

@@ -0,0 +1,111 @@
+<template>
+  <view >
+    <up-radio-group v-model="useTimeType" placement="row">
+      <up-radio
+        v-for="item in useTimeTypeList"
+        :key="item.value"
+        :value="item.value"
+        :name="item.value"
+        :label="item.label"
+      ></up-radio>
+    </up-radio-group>
+
+    <view class="u-flex u-m-t-30 box" v-if="useTimeType=='custom'">
+        <view class="u-flex u-flex-1">
+            <view class="item " @click="pirckerShow(startValue, 'startValue')">
+        <text class="u-m-r-12" v-if="!startValue">开始时间</text>
+        <text class="u-m-r-12" v-else>{{ startValue }}</text>
+      </view>
+      <view class="u-m-l-8 u-m-r-8" style="padding: 0 30rpx;">—</view>
+      <view class="item " @click="pirckerShow(endValue, 'endValue')">
+        <text class="u-m-r-12" v-if="!endValue">结束时间</text>
+        <text class="u-m-r-12" v-else>{{ endValue }}</text>
+      </view>
+        </view>
+
+      <up-icon name="clock"></up-icon>
+    </view>
+
+    <up-datetime-picker
+      :show="show"
+      v-model="value1"
+      closeOnClickOverlay
+      @close="close"
+      @cancel="close"
+      @confirm="confirm"
+      mode="time"
+    ></up-datetime-picker>
+  </view>
+</template>
+  
+  <script setup>
+import { computed, ref } from "vue";
+const useTimeType = defineModel("useTimeType", {
+  type: String,
+  default: "all",
+});
+const useTimeTypeList = [
+  {
+    value: "all",
+    label: "全时段可用",
+  },
+  {
+    value: "custom",
+    label: "指定时间段可用",
+  },
+];
+import dayjs from "dayjs";
+const startValue = defineModel("startValue", {
+  type: String,
+  default: "",
+});
+const endValue = defineModel("endValue", {
+  type: String,
+  default: "",
+});
+
+function close() {
+  show.value = false;
+}
+const value1 = ref('');
+const show = ref(false);
+const nowKey = ref("");
+
+function pirckerShow(date, key) {
+  nowKey.value = key;
+  show.value = true;
+  value1.value = date||''
+}
+
+function confirm(e) {
+  console.log(e);
+
+  if (nowKey.value == "startValue") {
+    startValue.value=e.value
+  } else if (nowKey.value == "endValue") {
+    endValue.value = e.value;
+  }
+  value1.value = e.value;
+  show.value = false;
+}
+</script>
+  
+  <style lang="scss" scoped>
+.item {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 48rpx;
+  padding: 0 12rpx;
+  display: flex;
+  
+}
+.box{
+    border: 2rpx solid #dddfe6;
+    padding: 16rpx 30rpx;
+    box-sizing: border-box;
+    width: 564rpx;
+    border-radius: 4rpx;
+    overflow: hidden;
+}
+</style>
+  

components/my-components/my-time-area.vue

@@ -0,0 +1,79 @@
+<template>
+  <view>
+    <view class="u-flex">
+      <view class="item" @click="pirckerShow(startDate, 'startDate')">
+        <text class="u-m-r-12" v-if="!startDate">请选择日期范围</text>
+        <text class="u-m-r-12" v-else>{{ startDate }}</text>
+        <up-icon name="arrow-down" size="14"></up-icon>
+      </view>
+      <view class="u-m-l-8 u-m-r-8">—</view>
+      <view class="item" @click="pirckerShow(endDate, 'endDate')">
+        <text class="u-m-r-12" v-if="!endDate">请选择日期范围</text>
+        <text class="u-m-r-12" v-else>{{ endDate }}</text>
+        <up-icon name="arrow-down" size="14"></up-icon>
+      </view>
+    </view>
+
+    <up-datetime-picker
+      :show="show"
+      v-model="value1"
+      closeOnClickOverlay
+      @close="close"
+      @cancel="close"
+      @confirm="confirm"
+      mode="date"
+    ></up-datetime-picker>
+  </view>
+</template>
+
+<script setup>
+import { computed, ref } from "vue";
+import dayjs from "dayjs";
+const startDate = defineModel("startDate", {
+  type: String,
+  default: "",
+});
+const endDate = defineModel("endDate", {
+  type: String,
+  default: "",
+});
+
+const minDate = ref(0);
+const maxDate = ref(dayjs().add(80, "year").valueOf());
+function close() {
+  show.value = false;
+}
+const value1 = ref(Date.now());
+const show = ref(false);
+const nowKey = ref("");
+
+function pirckerShow(date, key) {
+  nowKey.value = key;
+  console.log(date);
+  show.value = true;
+}
+
+function confirm(e) {
+  console.log(e);
+
+  if (nowKey.value == "startDate") {
+    startDate.value = dayjs(e.value).format("YYYY-MM-DD");
+  } else if (nowKey.value == "endDate") {
+    endDate.value = dayjs(e.value).format("YYYY-MM-DD");
+  }
+  value1.value = e.value
+  show.value = false;
+
+}
+</script>
+
+<style lang="scss" scoped>
+.item {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 64rpx;
+  border: 2rpx solid #dddfe6;
+  padding: 0 12rpx;
+  display: flex;
+}
+</style>

components/my-components/my-week-sel.vue

@@ -0,0 +1,57 @@
+<template>
+  <view>
+    <up-checkbox-group v-model="selectedWeek" :options="week">
+      <up-checkbox
+      :customStyle="customStyle"
+        v-for="item in week"
+        :key="item.value"
+        :value="item.value"
+        :name="item.value"
+        :label="item.value"
+        >{{ item.name }}</up-checkbox>
+    </up-checkbox-group>
+  </view>
+</template>
+<script setup>
+import { ref } from "vue";
+
+const customStyle={
+  marginRight: '40rpx',
+  marginBottom: '16rpx',
+}
+
+const selectedWeek=defineModel({
+  type: Array,
+  default: () => [],
+});
+const week = ref([
+  {
+    name: "周一",
+    value:"周一",
+  },
+  {
+    name: "周二",
+    value:"周二",
+  },
+  {
+    name: "周三",
+    value:"周三",
+  },
+  {
+    name: "周四",
+    value:"周四",
+  },
+  {
+    name: "周五",
+    value:"周五",
+  },
+  {
+    name: "周六",
+    value:"周六",
+  },
+  {
+    name: "周日",
+    value:"周日",
+  },
+]);
+</script>