@weitutech/by-components 1.0.31 → 1.1.0

package/package.json

@@ -1,13 +1,19 @@
 {
   "name": "@weitutech/by-components",
-  "version": "1.0.31",
+  "version": "1.1.0",
   "private": false,
   "main": "src/index",
+  "sideEffects": [
+    "*.vue",
+    "*.scss"
+  ],
   "scripts": {
     "dev": "vue-cli-service serve",
     "build": "npm run build:js && npm run build:css",
     "build:js": "vue-cli-service build --target lib --name by-components src/index.js",
-    "build:css": "sass src/style/index.scss lib/index.css --no-source-map --style=compressed"
+    "build:css": "sass src/style/index.scss lib/index.css --no-source-map --style=compressed",
+    "lint:fix": "eslint --ext .js,.vue src --fix",
+    "format": "prettier --write \"src/**/*.{js,vue,json,scss}\""
   },
   "dependencies": {
     "axios": "^1.7.7",
@@ -18,15 +24,23 @@
     "moment": "^2.30.1",
     "vue": "^2.6.14",
     "vuedraggable": "^2.24.3",
-    "vxe-table": "3.8.24"
+    "vxe-table": "^3.8.24"
   },
   "devDependencies": {
+    "@babel/core": "^7.19.1",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
     "@babel/plugin-proposal-optional-chaining": "^7.21.0",
+    "@babel/preset-env": "^7.27.2",
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "eslint": "^8.57.1",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-vue": "^9.3.0",
+    "prettier": "^3.5.3",
     "sass": "^1.79.4",
     "sass-loader": "^16.0.2",
     "vue-template-compiler": "^2.6.14"
   }
-}
+}

package/src/components/custom-column/index.vue

@@ -14,7 +14,7 @@
         <!-- 数据指标 -->
         <div class="left_box">
           <div class="box_title">数据指标</div>
-          <div class="row" style="padding-right: 20px;">
+          <div class="row" style="padding-right: 20px">
             <div class="cell">
               <el-input
                 v-model="search"
@@ -40,7 +40,11 @@
               </ul>
             </div>
             <div class="left_menu">
-              <div v-for="(item, index) in checkBoxMenuBySearch" :key="index" ref="tagItem">
+              <div
+                v-for="(item, index) in checkBoxMenuBySearch"
+                :key="index"
+                ref="tagItem"
+              >
                 <div class="checkbox_title">
                   {{ item.label }}
                 </div>
@@ -49,11 +53,11 @@
                     v-for="(each, idx) in item.data"
                     :key="idx"
                     :span="12"
-                    style="margin-bottom:3px"
+                    style="margin-bottom: 3px"
                   >
                     <el-checkbox
                       v-model="each.type"
-                      @change="changeCheckbox(each.key,each.type)"
+                      @change="changeCheckbox(each.key, each.type)"
                     >
                       {{ each.label }}
                     </el-checkbox>
@@ -68,7 +72,7 @@
           <div class="drag_box">
             <el-row>
               <div class="drag_text_box">
-                <span class="drag_title">{{`已选指标(${number})`}}</span>
+                <span class="drag_title">{{ `已选指标(${number})` }}</span>
                 <span class="recover" @click="recoverDefault">恢复默认</span>
               </div>
             </el-row>
@@ -82,9 +86,11 @@
               >
                 <transition-group>
                   <div
-                    v-for="(col) in draggableMenu"
+                    v-for="col in draggableMenu"
                     v-show="col.type"
-                    :class="col.key === 'sort-cut-off' ? 'fixedClass' : 'drag_li_box'"
+                    :class="
+                      col.key === 'sort-cut-off' ? 'fixedClass' : 'drag_li_box'
+                    "
                     :key="col.key"
                   >
                     <div v-if="col.key !== 'sort-cut-off'">
@@ -105,17 +111,16 @@
       </div>
       <template #footer>
         <el-row style="margin-top: 7px">
-          <el-button
-            size="small"
-            style="width: 96px"
-            @click="closeDialog"
-          >取消</el-button>
+          <el-button size="small" style="width: 96px" @click="closeDialog"
+            >取消</el-button
+          >
           <el-button
             size="small"
             style="width: 96px"
             type="primary"
             @click="submit"
-          >确定</el-button>
+            >确定</el-button
+          >
         </el-row>
       </template>
     </el-dialog>
@@ -123,10 +128,10 @@
 </template>
 
 <script>
-import draggable from "vuedraggable"
-import { deepClone } from "../../utils/index"
+import draggable from 'vuedraggable'
+import { deepClone } from '../../utils/index'
 export default {
-  name: "CustomColumn",
+  name: 'CustomColumn',
   components: {
     draggable
   },
@@ -156,28 +161,33 @@ export default {
       /** 表头id */
       id: undefined,
       /** 表格列接口路径 */
-      page: "",
+      page: '',
       /** 搜索字段 */
-      search: "",
+      search: ''
     }
   },
   computed: {
     number() {
-      return this.draggableMenu.filter(item => item.type && item.key !== "sort-cut-off").length
+      return this.draggableMenu.filter(
+        item => item.type && item.key !== 'sort-cut-off'
+      ).length
     },
     checkBoxMenuBySearch() {
       if (this.search) {
-        return this.checkBoxMenu.map(group => {
-          const filteredItems = group.data.filter(item => item.label.includes(this.search))
+        return this.checkBoxMenu
+          .map(group => {
+            const filteredItems = group.data.filter(item =>
+              item.label.includes(this.search)
+            )
             return {
-                label: group.label,
-                data: filteredItems
-            };
-        }).filter(group => group.data.length > 0)
+              label: group.label,
+              data: filteredItems
+            }
+          })
+          .filter(group => group.data.length > 0)
       } else {
         return this.checkBoxMenu
       }
-      
     }
   },
   methods: {
@@ -189,14 +199,14 @@ export default {
      */
     async getCustomTableList(page, column) {
       if (!page) {
-        throw new Error("缺少表格列接口路径");
+        throw new Error('缺少表格列接口路径')
       } else {
         // 克隆一份
         this.columnList = this.deepClone(column)
-        this.page = page || ""
+        this.page = page || ''
         const bePreservedColumn = []
         const res = await this.infoMethod({ page: page })
-        if (JSON.stringify(res.data) !== "[]") {
+        if (JSON.stringify(res.data) !== '[]') {
           this.id = res.data.id || undefined
           res.data.column.forEach(col => bePreservedColumn.push(...col.data))
         }
@@ -209,38 +219,42 @@ export default {
      * @param { object[] } bePreservedColumn 被保存过的列数据
      */
     initTableList(initColumn, bePreservedColumn = []) {
-      const setDraggableMenu = (arr) => {
+      const setDraggableMenu = arr => {
         const cols = []
         arr.forEach(item => cols.push(...item.data))
         cols.sort((a, b) => a.sort - b.sort)
-        if(cols.some(item=> item.fixed)) {
+        if (cols.some(item => item.fixed)) {
           let cutOffIndex = 0
-          for(let index = 0; index <= cols.length; index++) {
+          for (let index = 0; index <= cols.length; index++) {
             const col = cols[index]
             const nextCol = cols[index + 1]
-            if (col.fixed === "left" && (!nextCol || !nextCol.fixed)) {
+            if (col.fixed === 'left' && (!nextCol || !nextCol.fixed)) {
               cutOffIndex = index + 1
               break
             }
           }
           cols.splice(cutOffIndex, 0, {
             type: true,
-            label: "",
-            key: "sort-cut-off",
-            parent: ""
+            label: '',
+            key: 'sort-cut-off',
+            parent: ''
           })
         }
         return cols
       }
       if (bePreservedColumn && bePreservedColumn.length > 0) {
         // 需要处理被保存过的进行回显
-        initColumn.forEach((cols) => {
-          cols.data.forEach((col) => {
-            const beSaveCol = bePreservedColumn.find(item => item.key === col.key) || {}
-            col.type = (beSaveCol.type === "true" || beSaveCol.type === true) ? true : false
+        initColumn.forEach(cols => {
+          cols.data.forEach(col => {
+            const beSaveCol =
+              bePreservedColumn.find(item => item.key === col.key) || {}
+            col.type =
+              beSaveCol.type === 'true' || beSaveCol.type === true
+                ? true
+                : false
             col.sort = beSaveCol.sort
-            col.fixed = beSaveCol.fixed ? beSaveCol.fixed : col.fixed,
-            col.parent = { label: cols.label }
+            ;(col.fixed = beSaveCol.fixed ? beSaveCol.fixed : col.fixed),
+              (col.parent = { label: cols.label })
           })
         })
         // 需要显示的列的数据
@@ -249,26 +263,32 @@ export default {
       } else {
         // 从未被保存过
         let num = 0
-        initColumn.forEach((cols) => {
-          cols.data.forEach((col) => {
+        initColumn.forEach(cols => {
+          cols.data.forEach(col => {
             num++
             col.type = true
-            col.width = col.width ? +col.width : 0,
-            col.sort = num
+            ;(col.width = col.width ? +col.width : 0), (col.sort = num)
             col.parent = { label: cols.label }
           })
         })
         this.checkBoxMenu = this.deepClone(initColumn)
         this.draggableMenu = setDraggableMenu(this.checkBoxMenu)
       }
-      this.$emit("changeTable", this.draggableMenu.filter(item => item.key !== "sort-cut-off").sort((a, b) => a.sort - b.sort))
-      this.$emit("changeTableGroup", this.checkBoxMenu)
+      this.$emit(
+        'changeTable',
+        this.draggableMenu
+          .filter(item => item.key !== 'sort-cut-off')
+          .sort((a, b) => a.sort - b.sort)
+      )
+      this.$emit('changeTableGroup', this.checkBoxMenu)
     },
     // 全不选
     selectNone() {
-      this.checkBoxMenu.forEach(cols => cols.data.forEach(col => col.type = false))
+      this.checkBoxMenu.forEach(cols =>
+        cols.data.forEach(col => (col.type = false))
+      )
       this.draggableMenu.forEach(item => {
-        if (item.key === "sort-cut-off") {
+        if (item.key === 'sort-cut-off') {
           item.type = true
         } else {
           item.type = false
@@ -282,7 +302,7 @@ export default {
     setHighlight(index) {
       this.activeId = index
       if (this.$refs.tagItem) {
-        this.$refs.tagItem[index].scrollIntoView({ behavior: "smooth" })
+        this.$refs.tagItem[index].scrollIntoView({ behavior: 'smooth' })
       }
     },
     /**
@@ -312,10 +332,12 @@ export default {
     onEnd() {
       let isFixed = true
       this.draggableMenu.forEach((item, index) => {
-        if (item.key === "sort-cut-off") { isFixed = false }
+        if (item.key === 'sort-cut-off') {
+          isFixed = false
+        }
         if (isFixed) {
           item.sort = index + 1
-          item.fixed = "left"
+          item.fixed = 'left'
         } else {
           item.sort = index
           delete item.fixed
@@ -330,7 +352,7 @@ export default {
         page: this.page
       }
       this.draggableMenu.forEach(item => {
-        if (item.key !== "sort-cut-off") {
+        if (item.key !== 'sort-cut-off') {
           const { parent, ...other } = item
           // 是否存在
           const isExit = params.column.some(col => col.label === parent.label)
@@ -353,16 +375,19 @@ export default {
       params.column.forEach(item => {
         cols.push(...item.data)
       })
-      this.$emit("changeTable", cols.sort((a, b) => a.sort - b.sort))
-      this.$emit("changeTableGroup", params.column)
+      this.$emit(
+        'changeTable',
+        cols.sort((a, b) => a.sort - b.sort)
+      )
+      this.$emit('changeTableGroup', params.column)
       this.closeDialog()
     },
     // 关闭弹窗
     closeDialog() {
       // 重置数据
-      this.search = ""
+      this.search = ''
       this.activeId = 0
-      this.$emit("closeDialog")
+      this.$emit('closeDialog')
     }
   }
 }

package/src/components/fold-search/index.vue

@@ -2,10 +2,22 @@
   <div class="drawer_query_btn b-fold-search">
     <div @click="drawer">
       <template v-if="show == true">
-        <span style="color: #3aa1ff; vertical-align:middle;">收起</span>&nbsp;&nbsp;<img style="vertical-align:middle;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyBjbGFzcz0iaWNvbiIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjIwMC4wMHB4IiB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzVjYWRmZiIgZD0iTTg3Ny41IDU2NS45bC0zNjcuNi0zNDAtMzY3LjYgMzQwYy0yMi41IDE0LjUtNTIuNSAxNC41LTY3LjUgMC0xNS0yMS43LTE1LTUwLjcgMC02NS4xTDQ5NSAxMTcuNWMwLTcuMiA3LjUtNy4yIDE1LTcuMnM3LjUgMCAxNSA3LjJsNDIwLjIgMzgzLjNjMjIuNSAyMS43IDE1IDUwLjYgMCA2NS4xLTIyLjcgMTQuNS01Mi43IDE0LjUtNjcuNyAwek00OTQuOCA0NTAuMWMwLTcuMiA3LjUtNy4yIDE1LTcuMnMxNSAwIDE1IDcuMkw5NDUgODMzLjRjMjIuNSAyMS43IDE1IDUwLjYgMCA2NS4xLTIyLjUgMTQuNC01Mi41IDE0LjQtNjcuNSAwTDUwOS44IDU1OC42IDE0Mi4yIDkwNS44Yy0yMi41IDE0LjUtNTIuNSAxNC41LTY3LjUgMC0xNS0yMS43LTE1LTUwLjcgMC02NS4xbDQyMC4xLTM5MC42eiBtMCAwIiAvPjwvc3ZnPg==" alt="收起">
+        <span style="color: #3aa1ff; vertical-align: middle">收起</span>
+        &nbsp;&nbsp;
+        <img
+          style="vertical-align: middle"
+          src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyBjbGFzcz0iaWNvbiIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjIwMC4wMHB4IiB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzVjYWRmZiIgZD0iTTg3Ny41IDU2NS45bC0zNjcuNi0zNDAtMzY3LjYgMzQwYy0yMi41IDE0LjUtNTIuNSAxNC41LTY3LjUgMC0xNS0yMS43LTE1LTUwLjcgMC02NS4xTDQ5NSAxMTcuNWMwLTcuMiA3LjUtNy4yIDE1LTcuMnM3LjUgMCAxNSA3LjJsNDIwLjIgMzgzLjNjMjIuNSAyMS43IDE1IDUwLjYgMCA2NS4xLTIyLjcgMTQuNS01Mi43IDE0LjUtNjcuNyAwek00OTQuOCA0NTAuMWMwLTcuMiA3LjUtNy4yIDE1LTcuMnMxNSAwIDE1IDcuMkw5NDUgODMzLjRjMjIuNSAyMS43IDE1IDUwLjYgMCA2NS4xLTIyLjUgMTQuNC01Mi41IDE0LjQtNjcuNSAwTDUwOS44IDU1OC42IDE0Mi4yIDkwNS44Yy0yMi41IDE0LjUtNTIuNSAxNC41LTY3LjUgMC0xNS0yMS43LTE1LTUwLjcgMC02NS4xbDQyMC4xLTM5MC42eiBtMCAwIiAvPjwvc3ZnPg=="
+          alt="收起"
+        />
       </template>
       <template v-else>
-        <span style="color: #3aa1ff; vertical-align:middle;">展开更多</span>&nbsp;&nbsp;<img style="vertical-align:middle;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyBjbGFzcz0iaWNvbiIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjIwMC4wMHB4IiB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzVjYWRmZiIgZD0iTTE0NS40IDQ2MS4xbDM2Ny42IDM0MCAzNjcuNi0zNDBjMjIuNS0xNC41IDUyLjUtMTQuNSA2Ny41IDAgMTUgMjEuNyAxNSA1MC43IDAgNjUuMUw1MjcuOSA5MDkuNWMwIDcuMi03LjUgNy4yLTE1IDcuMnMtNy41IDAtMTUtNy4yTDc3LjcgNTI2LjJjLTIyLjUtMjEuNy0xNS01MC42IDAtNjUuMSAyMi42LTE0LjUgNTIuNi0xNC41IDY3LjcgMHpNNTI4IDU3Ni45YzAgNy4yLTcuNSA3LjItMTUgNy4ycy0xNSAwLTE1LTcuMkw3Ny44IDE5My42Yy0yMi41LTIxLjctMTUtNTAuNiAwLTY1LjEgMjIuNS0xNC40IDUyLjUtMTQuNCA2Ny41IDBMNTEzIDQ2OC40bDM2Ny42LTM0Ny4yYzIyLjUtMTQuNSA1Mi41LTE0LjUgNjcuNSAwIDE1IDIxLjcgMTUgNTAuNyAwIDY1LjFMNTI4IDU3Ni45eiBtMCAwIiAvPjwvc3ZnPg==" alt="展开更多">
+        <span style="color: #3aa1ff; vertical-align: middle">展开更多</span>
+        &nbsp;&nbsp;
+        <img
+          style="vertical-align: middle"
+          src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyBjbGFzcz0iaWNvbiIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjIwMC4wMHB4IiB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzVjYWRmZiIgZD0iTTE0NS40IDQ2MS4xbDM2Ny42IDM0MCAzNjcuNi0zNDBjMjIuNS0xNC41IDUyLjUtMTQuNSA2Ny41IDAgMTUgMjEuNyAxNSA1MC43IDAgNjUuMUw1MjcuOSA5MDkuNWMwIDcuMi03LjUgNy4yLTE1IDcuMnMtNy41IDAtMTUtNy4yTDc3LjcgNTI2LjJjLTIyLjUtMjEuNy0xNS01MC42IDAtNjUuMSAyMi42LTE0LjUgNTIuNi0xNC41IDY3LjcgMHpNNTI4IDU3Ni45YzAgNy4yLTcuNSA3LjItMTUgNy4ycy0xNSAwLTE1LTcuMkw3Ny44IDE5My42Yy0yMi41LTIxLjctMTUtNTAuNiAwLTY1LjEgMjIuNS0xNC40IDUyLjUtMTQuNCA2Ny41IDBMNTEzIDQ2OC40bDM2Ny42LTM0Ny4yYzIyLjUtMTQuNSA1Mi41LTE0LjUgNjcuNSAwIDE1IDIxLjcgMTUgNTAuNyAwIDY1LjFMNTI4IDU3Ni45eiBtMCAwIiAvPjwvc3ZnPg=="
+          alt="展开更多"
+        />
       </template>
     </div>
   </div>
@@ -20,10 +32,8 @@ export default {
   methods: {
     drawer(value) {
       this.show = !this.show
-      this.$emit("change", this.show)
+      this.$emit('change', this.show)
     }
-
   }
 }
 </script>
-

package/src/components/form/comps/custom-date-picker.vue

@@ -21,7 +21,7 @@
 </template>
 
 <script>
-import moment from "moment"
+import moment from 'moment'
 export default {
   props: {
     value: {
@@ -32,46 +32,77 @@ export default {
     otherOption: {
       type: Object,
       default: () => ({
-        startPlaceholder: "开始时间",
-        endPlaceholder: "结束时间",
-        type: "daterange",
-        rangeSeparator: "-",
-        size: "mini",
-        active: ""
+        startPlaceholder: '开始时间',
+        endPlaceholder: '结束时间',
+        type: 'daterange',
+        rangeSeparator: '-',
+        size: 'mini',
+        active: ''
       })
     },
     startTimeField: {
       type: String,
-      default: ""
+      default: ''
     },
     endTimeField: {
       type: String,
-      default: ""
+      default: ''
     }
   },
 
   data() {
     return {
       shortcuts: [
-        { label: "上月", start_time: moment().subtract(1, "months").startOf("month").format("YYYY-MM-DD"), end_time: moment().subtract(1, "months").endOf("month").format("YYYY-MM-DD"), key: "last_month" },
-        { label: "昨天", start_time: moment().subtract(1, "days").format("YYYY-MM-DD"), end_time: moment().subtract(1, "days").format("YYYY-MM-DD"), key: "yesterday" },
-        { label: "今天", start_time: moment().startOf("day").format("YYYY-MM-DD"), end_time: moment().startOf("day").format("YYYY-MM-DD"), key: "today" },
-        { label: "本周", start_time: moment().startOf("week").format("YYYY-MM-DD"), end_time: moment().endOf("week").format("YYYY-MM-DD"), key: "week" },
-        { label: "本月", start_time: moment().startOf("month").format("YYYY-MM-DD"), end_time: moment().endOf("month").format("YYYY-MM-DD"), key: "month" }
+        {
+          label: '上月',
+          start_time: moment()
+            .subtract(1, 'months')
+            .startOf('month')
+            .format('YYYY-MM-DD'),
+          end_time: moment()
+            .subtract(1, 'months')
+            .endOf('month')
+            .format('YYYY-MM-DD'),
+          key: 'last_month'
+        },
+        {
+          label: '昨天',
+          start_time: moment().subtract(1, 'days').format('YYYY-MM-DD'),
+          end_time: moment().subtract(1, 'days').format('YYYY-MM-DD'),
+          key: 'yesterday'
+        },
+        {
+          label: '今天',
+          start_time: moment().startOf('day').format('YYYY-MM-DD'),
+          end_time: moment().startOf('day').format('YYYY-MM-DD'),
+          key: 'today'
+        },
+        {
+          label: '本周',
+          start_time: moment().startOf('week').format('YYYY-MM-DD'),
+          end_time: moment().endOf('week').format('YYYY-MM-DD'),
+          key: 'week'
+        },
+        {
+          label: '本月',
+          start_time: moment().startOf('month').format('YYYY-MM-DD'),
+          end_time: moment().endOf('month').format('YYYY-MM-DD'),
+          key: 'month'
+        }
       ],
-      active: ""
+      active: ''
     }
   },
 
   computed: {
     dateOptions() {
       return {
-        startPlaceholder: "开始时间",
-        endPlaceholder: "结束时间",
-        type: "daterange",
-        rangeSeparator: "至",
-        size: "mini",
-        active: "",
+        startPlaceholder: '开始时间',
+        endPlaceholder: '结束时间',
+        type: 'daterange',
+        rangeSeparator: '至',
+        size: 'mini',
+        active: '',
         ...this.otherOption
       }
     }
@@ -81,15 +112,20 @@ export default {
     value: {
       handler(newValue, oldValue) {
         if (newValue && newValue.length) {
-          this.active = ""
+          this.active = ''
           this.shortcuts.forEach(item => {
-            if (item.start_time === newValue[0] && item.end_time === newValue[1]) {
+            if (
+              item.start_time === newValue[0] &&
+              item.end_time === newValue[1]
+            ) {
               this.active = item.key
             }
           })
         } else {
           this.active = this.dateOptions.active
-          const item = this.shortcuts.find(item => item.key === this.dateOptions.active) || {}
+          const item =
+            this.shortcuts.find(item => item.key === this.dateOptions.active) ||
+            {}
           if (item.start_time && item.end_time) {
             this.handleClick(item)
           }
@@ -98,35 +134,35 @@ export default {
       immediate: true
     }
   },
-  
+
   methods: {
     handleChange(e) {
       if (!e) {
-        this.$emit("input", [])
+        this.$emit('input', [])
         if (this.startTimeField && this.endTimeField) {
-          this.$emit("range-change", { startTime: "", endTime: "" })
+          this.$emit('range-change', { startTime: '', endTime: '' })
         }
       } else {
-        const formattedDates = e.map(item => moment(item).format("YYYY-MM-DD"))
-        this.$emit("input", formattedDates)
-        
+        const formattedDates = e.map(item => moment(item).format('YYYY-MM-DD'))
+        this.$emit('input', formattedDates)
+
         if (this.startTimeField && this.endTimeField) {
-          this.$emit("range-change", { 
-            startTime: formattedDates[0], 
-            endTime: formattedDates[1] 
+          this.$emit('range-change', {
+            startTime: formattedDates[0],
+            endTime: formattedDates[1]
           })
         }
       }
-      this.active = ""
+      this.active = ''
     },
     handleClick(item) {
       this.active = item.key
-      this.$emit("input", [item.start_time, item.end_time])
-      
+      this.$emit('input', [item.start_time, item.end_time])
+
       if (this.startTimeField && this.endTimeField) {
-        this.$emit("range-change", { 
-          startTime: item.start_time, 
-          endTime: item.end_time 
+        this.$emit('range-change', {
+          startTime: item.start_time,
+          endTime: item.end_time
         })
       }
     }