更新组件

src/components/AiAreaPicker/AiAreaPicker.vue

@@ -49,7 +49,7 @@ export default {
     name: {default: ''},
     value: String,
     all: Boolean,
-    icon: {default: "location.svg"},
+    icon: {default: "/dvpc/h5/location.svg"},
     isHideTown: {
       type: Boolean,
       default: false

src/components/AiDate/AiDate.vue

@@ -0,0 +1,68 @@
+<template>
+  <section class="AiDate">
+    <u-calendar v-model="show" :maxDate="maxDate"
+                @change="handleSelect" :mode="mode" @close="show=false"/>
+    <div flex @click="show=true">
+      <div class="label" v-if="label" v-html="label"/>
+      <div class="placeholder" v-else v-html="placeholder"/>
+      <u-icon name="arrow-right" color="#ddd"/>
+    </div>
+  </section>
+</template>
+
+<script>
+import dayjs from 'dayjs'
+
+export default {
+  name: "AiDate",
+  computed: {
+    label() {
+      let arr = (this.selected || this.value)?.toString()?.split(",") || []
+      arr = arr.map(e => dayjs(e).format("YYYY-MM-DD").replace("Invalid Date", ''))
+      return arr.join('至')
+    }
+  },
+  data() {
+    return {
+      show: false,
+      selected: ""
+    }
+  },
+  props: {
+    value: {default: ""},
+    placeholder: {default: "请选择"},
+    mode: {default: "date"},//date 单个日期|range 日期范围
+    maxDate: String
+  },
+  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;
+  font-size: 30px;
+
+  .label {
+    font-size: 30px;
+  }
+
+  ::v-deep .u-icon {
+    margin-left: 8px;
+  }
+
+  .placeholder {
+    color: $uni-text-color-grey;
+  }
+}
+</style>