初始化产品库

src/components/AiDate.vue

@@ -0,0 +1,60 @@
+<template>
+  <section class="AiDate">
+    <u-calendar v-model="show" @change="handleSelect" :mode="mode"/>
+    <div flex @click="show=true">
+      <div v-if="label" v-html="label"/>
+      <div v-else v-html="placeholder"/>
+      <i class="iconfont iconfont-iconArrow_Down"/>
+    </div>
+  </section>
+</template>
+
+<script>
+import UCalendar from "../uview/components/u-calendar/u-calendar";
+import dayjs from 'dayjs'
+
+export default {
+  name: "AiDate",
+  components: {UCalendar},
+  computed: {
+    label() {
+      let arr = (this.selected || this.value)?.toString()?.split(",") || []
+      arr = arr.map(e => dayjs(e).format("MM-DD").replace("Invalid Date", ''))
+      return arr.join('至')
+    }
+  },
+  data() {
+    return {
+      show: false,
+      selected: ""
+    }
+  },
+  props: {
+    value: {default: ""},
+    placeholder: {default: "请选择"},
+    mode: {default: "date"},//date 单个日期|range 日期范围
+  },
+  methods: {
+    handleSelect(v) {
+      if (this.mode == 'date') {
+        this.selected = v.result
+        this.$emit('change', v.result)
+      } else if (this.mode == 'range') {
+        this.selected = [v.startDate, v.endDate]
+        this.$emit('change', v)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiDate {
+  color: #333333;
+
+  .iconfont-iconArrow_Down {
+    margin-left: 4px;
+    font-size: 32px;
+  }
+}
+</style>