修复周视图显示错误问题

2025-12-10 07:58:13 +08:00 · 2021-12-11 22:23:36 +08:00
parent d4173f35be
commit 7226257007
8 changed files with 92 additions and 36 deletions
--- a/examples/components/PreCode.vue
+++ b/examples/components/PreCode.vue
@@ -5,7 +5,7 @@
 </template>

 <script lang="ts">
-import { defineComponent, nextTick, ref, Ref } from 'vue'
+import { defineComponent } from 'vue'

 export default defineComponent({
  name: 'PreCode',
--- a/examples/views/icon/Icon.vue
+++ b/examples/views/icon/Icon.vue
@@ -28,7 +28,7 @@ interface ItemVO {

 export default defineComponent({
  setup () {
-    const copyEvent = ({ icon }: ItemVO) => {
+    const copyEvent = () => {
      VXETable.modal.message({ content: '已复制到剪贴板！', status: 'success' })
    }
    return {
--- a/examples/views/input/Input.vue
+++ b/examples/views/input/Input.vue
@@ -40,6 +40,16 @@
      <vxe-input v-model="demo1.value409" placeholder="农历节日" type="date" :festival-method="festivalCalendarMethod" transfer></vxe-input>
    </p>

+    <p>
+      <vxe-input v-model="demo1.value701" placeholder="周选择" type="week" :start-day="0" clearable></vxe-input>
+      <vxe-input v-model="demo1.value702" placeholder="周选择" type="week" :start-day="1" clearable></vxe-input>
+      <vxe-input v-model="demo1.value703" placeholder="周选择" type="week" :start-day="2" clearable></vxe-input>
+      <vxe-input v-model="demo1.value704" placeholder="周选择" type="week" :start-day="3" clearable></vxe-input>
+      <vxe-input v-model="demo1.value705" placeholder="周选择" type="week" :start-day="4" clearable></vxe-input>
+      <vxe-input v-model="demo1.value706" placeholder="周选择" type="week" :start-day="5" clearable></vxe-input>
+      <vxe-input v-model="demo1.value707" placeholder="周选择" type="week" :start-day="6" clearable></vxe-input>
+    </p>
+
    <p>
      <vxe-input v-model="demo1.value500" placeholder="数值类型" type="number"></vxe-input>
      <vxe-input v-model="demo1.value501" placeholder="数值间隔 1.4" type="number" step="1.4" clearable></vxe-input>
@@ -143,7 +153,14 @@ export default defineComponent({
      value600: '',
      value601: '',
      value602: '',
-      value603: ''
+      value603: '',
+      value701: '2017-12-18',
+      value702: '2017-12-18',
+      value703: '2017-12-18',
+      value704: '2017-12-18',
+      value705: '2017-12-18',
+      value706: '2017-12-18',
+      value707: '2017-12-18'
    })

    const disabledDateMethod: VxeInputPropTypes.DisabledMethod = (params) => {
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "vxe-table",
-  "version": "4.1.17-beta.0",
+  "version": "4.1.17-beta.2",
  "description": "一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、贼灵活的配置项、扩展接口等...",
  "scripts": {
    "serve": "vue-cli-service serve",
@@ -66,11 +66,11 @@
    "vue-router": "^4.0.11",
    "vuex": "^4.0.2",
    "xe-ajax": "^4.0.5",
-    "xe-utils": "^3.4.3"
+    "xe-utils": "^3.5.0"
  },
  "peerDependencies": {
    "vue": "^3.2.2",
-    "xe-utils": "^3.4.2"
+    "xe-utils": "^3.5.0"
  },
  "vetur": {
    "tags": "helper/vetur/tags.json",
--- a/packages/input/src/input.ts
+++ b/packages/input/src/input.ts
@@ -195,6 +195,14 @@ export default defineComponent({

    let inputMethods = {} as InputMethods

+    const parseDate = (value: VxeInputPropTypes.ModelValue, format: string) => {
+      const { type } = props
+      if (type === 'time') {
+        return toStringTimeDate(value)
+      }
+      return XEUtils.toStringDate(value, format)
+    }
+
    const computeIsDateTimeType = computed(() => {
      const { type } = props
      return type === 'time' || type === 'datetime'
@@ -255,17 +263,12 @@ export default defineComponent({
    })

    const computeDateValue = computed(() => {
-      const { modelValue, type } = props
+      const { modelValue } = props
      const isDatePickerType = computeIsDatePickerType.value
      const dateValueFormat = computeDateValueFormat.value
      let val = null
      if (modelValue && isDatePickerType) {
-        let date
-        if (type === 'time') {
-          date = toStringTimeDate(modelValue)
-        } else {
-          date = XEUtils.toStringDate(modelValue, dateValueFormat)
-        }
+        const date = parseDate(modelValue, dateValueFormat)
        if (XEUtils.isValidDate(date)) {
          val = date
        }
@@ -356,12 +359,16 @@ export default defineComponent({
      return ''
    })

+    const computeFirstDayOfWeek = computed(() => {
+      const { startDay, startWeek } = props
+      return XEUtils.toNumber(XEUtils.isNumber(startDay) || XEUtils.isString(startDay) ? startDay : startWeek) as VxeInputPropTypes.StartDay
+    })
+
    const computeWeekDatas = computed(() => {
      const weeks = []
      const isDatePickerType = computeIsDatePickerType.value
      if (isDatePickerType) {
-        const { startDay, startWeek } = props
-        let sWeek = XEUtils.toNumber(XEUtils.isNumber(startDay) || XEUtils.isString(startDay) ? startDay : startWeek)
+        let sWeek = computeFirstDayOfWeek.value
        weeks.push(sWeek)
        for (let index = 0; index < 6; index++) {
          if (sWeek >= 6) {
@@ -516,6 +523,7 @@ export default defineComponent({

    const computeWeekDates = computed(() => {
      const dayDatas = computeDayDatas.value
+      const firstDayOfWeek = computeFirstDayOfWeek.value
      return dayDatas.map((list) => {
        const firstItem = list[0]
        const item: DateDayItem = {
@@ -525,7 +533,7 @@ export default defineComponent({
          isCurrent: false,
          isNow: false,
          isNext: false,
-          label: XEUtils.getYearWeek(firstItem.date)
+          label: XEUtils.getYearWeek(firstItem.date, firstDayOfWeek)
        }
        return [item].concat(list)
      })
@@ -711,17 +719,27 @@ export default defineComponent({
      const { type } = props
      const { valueFormat } = props
      const dateLabelFormat = computeDateLabelFormat.value
+      const firstDayOfWeek = computeFirstDayOfWeek.value
      let dValue: Date | null = null
      let dLabel = ''
      if (value) {
-        if (type === 'time') {
-          dValue = toStringTimeDate(value)
-        } else {
-          dValue = XEUtils.toStringDate(value, valueFormat)
-        }
+        dValue = parseDate(value, valueFormat)
      }
      if (XEUtils.isValidDate(dValue)) {
-        dLabel = XEUtils.toDateString(dValue, dateLabelFormat)
+        dLabel = XEUtils.toDateString(dValue, dateLabelFormat, { firstDay: firstDayOfWeek })
+        // 由于年份和第几周是冲突的行为，所以需要特殊处理，判断是否跨年
+        if (dateLabelFormat && type === 'week') {
+          const firstWeekDate = XEUtils.getWhatWeek(dValue, 0, firstDayOfWeek, firstDayOfWeek)
+          if (firstWeekDate.getFullYear() < dValue.getFullYear()) {
+            const yyIndex = dateLabelFormat.indexOf('yyyy')
+            if (yyIndex > -1) {
+              const yyNum = Number(dLabel.substring(yyIndex, yyIndex + 4))
+              if (yyNum && !isNaN(yyNum)) {
+                dLabel = dLabel.replace(`${yyNum}`, `${yyNum - 1}`)
+              }
+            }
+          }
+        }
      } else {
        dValue = null
      }
@@ -785,15 +803,16 @@ export default defineComponent({
      const { datetimePanelValue } = reactData
      const isDateTimeType = computeIsDateTimeType.value
      const dateValueFormat = computeDateValueFormat.value
+      const firstDayOfWeek = computeFirstDayOfWeek.value
      if (props.type === 'week') {
-        const sWeek = XEUtils.toNumber(props.selectDay)
-        date = XEUtils.getWhatWeek(date, 0, sWeek)
+        const sWeek = XEUtils.toNumber(props.selectDay) as VxeInputPropTypes.SelectDay
+        date = XEUtils.getWhatWeek(date, 0, sWeek, firstDayOfWeek)
      } else if (isDateTimeType) {
        date.setHours(datetimePanelValue.getHours())
        date.setMinutes(datetimePanelValue.getMinutes())
        date.setSeconds(datetimePanelValue.getSeconds())
      }
-      const inpVal = XEUtils.toDateString(date, dateValueFormat)
+      const inpVal = XEUtils.toDateString(date, dateValueFormat, { firstDay: firstDayOfWeek })
      dateCheckMonth(date)
      if (!XEUtils.isEqual(modelValue, inpVal)) {
        emitModel(inpVal, { type: 'update' })
@@ -826,12 +845,7 @@ export default defineComponent({
          }
        } else if (isDatePickerType) {
          if (inputValue) {
-            let inpDateVal: VxeInputPropTypes.ModelValue
-            if (type === 'time') {
-              inpDateVal = toStringTimeDate(inputValue)
-            } else {
-              inpDateVal = XEUtils.toStringDate(inputValue, dateLabelFormat)
-            }
+            let inpDateVal: VxeInputPropTypes.ModelValue = parseDate(inputValue, dateLabelFormat as string)
            if (XEUtils.isValidDate(inpDateVal)) {
              if (type === 'time') {
                inpDateVal = XEUtils.toDateString(inpDateVal, dateLabelFormat)
@@ -841,6 +855,7 @@ export default defineComponent({
                reactData.inputValue = inpDateVal
              } else {
                let isChange = false
+                const firstDayOfWeek = computeFirstDayOfWeek.value
                if (type === 'datetime') {
                  const dateValue = computeDateValue.value
                  if (inputValue !== XEUtils.toDateString(dateValue, dateLabelFormat) || inputValue !== XEUtils.toDateString(inpDateVal, dateLabelFormat)) {
@@ -852,7 +867,7 @@ export default defineComponent({
                } else {
                  isChange = true
                }
-                reactData.inputValue = XEUtils.toDateString(inpDateVal, dateLabelFormat)
+                reactData.inputValue = XEUtils.toDateString(inpDateVal, dateLabelFormat, { firstDay: firstDayOfWeek })
                if (isChange) {
                  dateChange(inpDateVal)
                }
@@ -1291,14 +1306,15 @@ export default defineComponent({
          dateMoveMonth(offsetMonth)
        } else {
          let offsetDay = datePanelValue || XEUtils.getWhatDay(Date.now(), 0, 'first')
+          const firstDayOfWeek = computeFirstDayOfWeek.value
          if (isLeftArrow) {
            offsetDay = XEUtils.getWhatDay(offsetDay, -1)
          } else if (isUpArrow) {
-            offsetDay = XEUtils.getWhatWeek(offsetDay, -1)
+            offsetDay = XEUtils.getWhatWeek(offsetDay, -1, firstDayOfWeek)
          } else if (isRightArrow) {
            offsetDay = XEUtils.getWhatDay(offsetDay, 1)
          } else if (isDwArrow) {
-            offsetDay = XEUtils.getWhatWeek(offsetDay, 1)
+            offsetDay = XEUtils.getWhatWeek(offsetDay, 1, firstDayOfWeek)
          }
          dateMoveDay(offsetDay)
        }
--- a/packages/table/src/table.ts
+++ b/packages/table/src/table.ts
@@ -2806,6 +2806,25 @@ export default defineComponent({
        }
        return rowList
      },
+      /**
+       * 只对 tree-config 有效，获取行的父级
+       */
+      getParentRow (rowOrRowid) {
+        const { treeConfig } = props
+        const { fullDataRowIdData } = internalData
+        if (rowOrRowid && treeConfig) {
+          let rowid
+          if (XEUtils.isString(rowOrRowid)) {
+            rowid = rowOrRowid
+          } else {
+            rowid = getRowid($xetable, rowOrRowid)
+          }
+          if (rowid) {
+            return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].parent : null
+          }
+        }
+        return null
+      },
      /**
       * 根据行的唯一主键获取行
       * @param {String/Number} rowid 行主键
--- a/types/input.d.ts
+++ b/types/input.d.ts
@@ -66,8 +66,8 @@ export namespace VxeInputPropTypes {
  export type Digits = string | number;
  export type MinDate = string | number | Date;
  export type MaxDate = string | number | Date;
-  export type StartDay = number;
-  export type SelectDay = number;
+  export type StartDay = 0 | 1 | 2 | 3 | 4 | 5 | 6;
+  export type SelectDay = 0 | 1 | 2 | 3 | 4 | 5 | 6;
  export type LabelFormat = string;
  export type ValueFormat = string;
  export type Editable = boolean;
--- a/types/table.d.ts
+++ b/types/table.d.ts
@@ -272,6 +272,10 @@ export interface TablePublicMethods {
   * 用于 type=checkbox，获取已选中的行数据
   */
  getCheckboxRecords(isFull?: boolean): any[];
+  /**
+   * 只对 tree-config 有效，获取行的父级
+   */
+  getParentRow (rowOrRowid: any): any | null;
  /**
   * 根据行的唯一主键获取行
   * @param rowid 行主键