wl-design-mobile 0.6.9 → 0.7.1

package/edit/select/lambo-edit-date.vue

@@ -52,11 +52,11 @@ export default {
     },
     minDate: {
       type: Date,
-      default: () => new Date((new Date()).getFullYear() - 3, (new Date()).getMonth(), (new Date()).getDate())
+      default: () => moment().subtract(3, 'years').toDate(),
     },
     maxDate: {
       type: Date,
-      default: () => new Date((new Date()).getFullYear() + 3, (new Date()).getMonth(), (new Date()).getDate())
+      default: () => moment().add(3, 'years').toDate(),
     },
     allowSameDay: {
       type: Boolean,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wl-design-mobile",
-  "version": "0.6.9",
+  "version": "0.7.1",
   "description": "",
   "main": "index.js",
   "author": "finch",

package/search/lambo-week-select.vue

@@ -0,0 +1,326 @@
+<template>
+  <div
+      class="week-date-picker"
+      @touchstart="handleTouchStart"
+      @touchmove="handleTouchMove"
+      @touchend="handleTouchEnd"
+      @mousedown="handleMouseDown"
+      @mousemove="handleMouseMove"
+      @mouseup="handleMouseUp"
+      @mouseleave="handleMouseLeave"
+  >
+    <div class="week-days">
+      <div
+          v-for="day in weekDays"
+          :key="day.date.getTime()"
+          class="day-item"
+          :class="{
+          'today': day.isToday,
+          'active': day.isSelected,
+        }"
+          @click="selectDay(day)"
+      >
+        <div class="day-week">{{ day.weekDay }}</div>
+        <div class="day-month">{{ day.month }}月</div>
+        <div class="day-date">{{ day.date.getDate() }}</div>
+        <div v-if="day.isToday" class="today-dot"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+const WEEK_DAYS = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
+
+export default {
+  name: "LamboWeekSelect",
+
+  data() {
+    return {
+      selectedDate: new Date(),
+      weekStart: null,
+      startX: 0,
+      endX: 0,
+      isDragging: false,
+      swipeThreshold: 50,
+      clickDisabled: false
+    }
+  },
+  props: {
+    weekDate: {
+      type: String,
+      default: null
+    },
+  },
+
+  created() {
+    if (this.weekDate) {
+      this.initWithWeekDate(this.weekDate);
+    } else {
+      const today = new Date();
+      const todayStr = this.formatDateToYYYYMMDD(today);
+      this.initWithWeekDate(todayStr);
+    }
+  },
+
+  computed: {
+    weekDays() {
+      if (!this.weekStart) return [];
+      return Array.from({length: 7}, (_, i) => {
+        const date = new Date(this.weekStart);
+        date.setDate(this.weekStart.getDate() + i);
+        const today = new Date();
+        return {
+          date,
+          month: date.getMonth() + 1,
+          weekDay: WEEK_DAYS[date.getDay()],
+          isToday: this.isSameDay(date, today),
+          isSelected: this.isSameDay(date, this.selectedDate)
+        };
+      });
+    }
+  },
+
+  methods: {
+    /**
+     * 根据YYYYMMDD格式的字符串初始化组件
+     * @param {string} dateFormat- 格式如："20251205"
+     */
+    initWithWeekDate(dateFormat) {
+      // 解析YYYYMMDD格式字符串为Date对象
+      const date = this.parseYYYYMMDD(dateFormat);
+
+      if (date) {
+        console.log("根据传入日期初始化:", dateFormat);
+        this.setWeekStart(date);
+        this.selectedDate = new Date(date);
+      } else {
+        console.log("日期解析失败，使用今天");
+        const today = new Date();
+        this.setWeekStart(today);
+        this.selectedDate = new Date(today);
+      }
+    },
+
+    /**
+     * 解析YYYYMMDD格式字符串为Date对象
+     * @param {string} yyyymmdd - 格式如："20251205"
+     * @returns {Date|null} Date对象或null
+     */
+    parseYYYYMMDD(dateFormat) {
+      if (!dateFormat || typeof dateFormat !== 'string' || dateFormat.length !== 8) {
+        return null;
+      }
+
+      try {
+        const year = parseInt(dateFormat.substring(0, 4));
+        const month = parseInt(dateFormat.substring(4, 6)) - 1;
+        const day = parseInt(dateFormat.substring(6, 8));
+
+        const date = new Date(year, month, day);
+
+        // 验证日期是否有效
+        if (isNaN(date.getTime()) ||
+            date.getFullYear() !== year ||
+            date.getMonth() !== month ||
+            date.getDate() !== day) {
+          return null;
+        }
+
+        return date;
+      } catch (error) {
+        console.error("日期解析错误:", error);
+        return null;
+      }
+    },
+
+    setWeekStart(date) {
+      const d = new Date(date);
+      const day = d.getDay();
+      const diff = d.getDate() - (day === 0 ? 6 : day - 1);
+      d.setDate(diff);
+      d.setHours(0, 0, 0, 0);
+      this.weekStart = d;
+    },
+
+    isSameDay(d1, d2) {
+      if (!d1 || !d2) return false;
+      return d1.toDateString() === d2.toDateString();
+    },
+
+    formatDateToYYYYMMDD(date) {
+      const year = date.getFullYear();
+      const month = (date.getMonth() + 1).toString().padStart(2, '0');
+      const day = date.getDate().toString().padStart(2, '0');
+      return `${year}${month}${day}`;
+    },
+
+    selectDay(day) {
+      if (this.clickDisabled) {
+        this.clickDisabled = false;
+        return;
+      }
+      this.selectedDate = new Date(day.date);
+      const clickDate = this.formatDateToYYYYMMDD(this.selectedDate);
+      console.log('选中的日期:', clickDate);
+      // 触发自定义事件，传递YYYYMMDD格式的日期
+      this.$emit('click', clickDate);
+    },
+
+    goPrevWeek() {
+      const newWeekStart = new Date(this.weekStart);
+      newWeekStart.setDate(this.weekStart.getDate() - 7);
+      this.setWeekStart(newWeekStart);
+    },
+
+    goNextWeek() {
+      const newWeekStart = new Date(this.weekStart);
+      newWeekStart.setDate(this.weekStart.getDate() + 7);
+      this.setWeekStart(newWeekStart);
+    },
+
+    handleTouchStart(e) {
+      this.startX = e.touches[0].clientX;
+      this.endX = this.startX;
+      this.isDragging = true;
+      this.clickDisabled = false;
+    },
+
+    handleTouchMove(e) {
+      if (!this.isDragging) return;
+      this.endX = e.touches[0].clientX;
+    },
+
+    handleTouchEnd() {
+      if (!this.isDragging) return;
+
+      const deltaX = this.endX - this.startX;
+      this.handleSwipe(deltaX);
+
+      this.isDragging = false;
+    },
+
+    handleMouseDown(e) {
+      this.startX = e.clientX;
+      this.endX = this.startX;
+      this.isDragging = true;
+      this.clickDisabled = false;
+    },
+
+    handleMouseMove(e) {
+      if (!this.isDragging) return;
+      this.endX = e.clientX;
+    },
+
+    handleMouseUp() {
+      if (!this.isDragging) return;
+
+      const deltaX = this.endX - this.startX;
+      this.handleSwipe(deltaX);
+
+      this.isDragging = false;
+    },
+
+    handleMouseLeave() {
+      this.isDragging = false;
+    },
+
+    handleSwipe(deltaX) {
+      if (Math.abs(deltaX) > this.swipeThreshold) {
+        this.clickDisabled = true;
+        if (deltaX > 0) {
+          this.goPrevWeek();
+        } else {
+          this.goNextWeek();
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.week-date-picker {
+  width: 100%;
+  background: white;
+  padding: 16px 0;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+  user-select: none;
+  border-radius: 8px;
+  overflow: hidden;
+  cursor: grab;
+}
+
+.week-date-picker:active {
+  cursor: grabbing;
+}
+
+.week-days {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  padding: 0 8px;
+}
+
+.day-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 44px;
+  height: 64px;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  position: relative;
+  flex-shrink: 0;
+}
+
+.day-item:hover {
+  background-color: #f5f5f5;
+  transform: translateY(-2px);
+}
+
+.day-item.active {
+  background-color: #1677ff;
+  box-shadow: 0 4px 12px rgba(22, 119, 255, 0.3);
+  transform: translateY(-2px);
+}
+
+.day-item.active .day-week,
+.day-item.active .day-month,
+.day-item.active .day-date {
+  color: white;
+}
+
+.day-week {
+  font-size: 12px;
+  color: #666;
+  margin-bottom: 4px;
+}
+
+.day-month {
+  font-size: 10px;
+  color: #999;
+  margin-bottom: 2px;
+}
+
+.day-date {
+  font-size: 20px;
+  font-weight: 500;
+  color: #333;
+}
+
+.today-dot {
+  position: absolute;
+  bottom: -4px;
+  width: 4px;
+  height: 4px;
+  background-color: #1677ff;
+  border-radius: 50%;
+}
+
+.day-item.active .today-dot {
+  background-color: white;
+}
+</style>

package/util/jssdk.js

@@ -250,39 +250,67 @@ let JsSDK = (function () {
       }
     })
   }
-  function takePhoto(){
+  function takePhoto({count = 1} = {}){
     return new Promise((resolve, reject) =>{
       if(getAppType() === '30'){
         reject('钉钉不支持此方式拍照')
       }else{
         configWx().then(()=>{
           wx.chooseImage({
-            count: 1, // 默认1
+            count: count, // 默认1
             sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有
             sourceType: ['camera'], // 可以指定来源是相册还是相机，默认二者都有
-            success: function (res) {
+            success: async function (res) {
               let localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
-              let localId = localIds[0];
               Toast.loading({
                 duration: 0, // 持续展示 toast
                 forbidClick: false,
                 message: '正在上传',
               });
-              setTimeout(() => {
-                wx.uploadImage({
-                  localId: localId, // 需要上传的图片的本地ID，由chooseImage接口获得
-                  isShowProgressTips: 0, // 默认为1，显示进度提示
-                  success: function (res) {
-                    Toast.clear()
-                    let serverId = res.serverId; // 返回图片的服务器端ID
-                    resolve({
-                      appId:sessionStorage.getItem(APP_ID),
-                      agentId:sessionStorage.getItem(AGENT_ID),
-                      serverId:serverId
-                    })
-                  }
-                })
-              }, 200);
+              let uploadPromises = localIds.map(localId => {
+                return new Promise((resolve, reject) => {
+                  wx.uploadImage({
+                    localId: localId, // 需要上传的图片的本地ID，由chooseImage接口获得
+                    isShowProgressTips: 0, // 默认为1，显示进度提示
+                    success: function (res) {
+                      let serverId = res.serverId; // 返回图片的服务器端ID
+                      resolve(serverId);
+                    },
+                    fail: function (error) {
+                      reject(error);
+                    }
+                  });
+                });
+              });
+              try {
+                let serverIds = await Promise.all(uploadPromises);
+                console.log('choosePhoto', serverIds)
+                Toast.clear()
+                resolve({
+                  appId: sessionStorage.getItem(APP_ID),
+                  agentId: sessionStorage.getItem(AGENT_ID),
+                  serverId: serverIds[0],
+                  serverIds: serverIds
+                });
+              } catch (error) {
+                Toast.clear()
+                reject('上传图片失败：' + error);
+              }
+              // setTimeout(() => {
+              //   wx.uploadImage({
+              //     localId: localId, // 需要上传的图片的本地ID，由chooseImage接口获得
+              //     isShowProgressTips: 0, // 默认为1，显示进度提示
+              //     success: function (res) {
+              //       Toast.clear()
+              //       let serverId = res.serverId; // 返回图片的服务器端ID
+              //       resolve({
+              //         appId:sessionStorage.getItem(APP_ID),
+              //         agentId:sessionStorage.getItem(AGENT_ID),
+              //         serverId:serverId
+              //       })
+              //     }
+              //   })
+              // }, 200);
             },
             cancel:function (){
               reject('取消拍照')