xt-element-ui 2.2.1 → 2.2.2

package/docs/components/base/xt-date-picker.md

@@ -45,12 +45,12 @@ export default {
 
 ## 示例
 
-### 日期范围选择
+### 范围选择
 
-::: demo 日期范围选择
+::: demo 日期选择
 ```vue
 <template>
-  <XtDatePicker v-model="dateRange" rangeMode="true" />
+  <XtDatePicker v-model="dateRange" :rangeMode="true" />
 </template>
 
 <script>
@@ -65,9 +65,9 @@ export default {
 ```
 :::
 
-### 月份范围选择
+### 月份选择
 
-::: demo 月份范围选择
+::: demo 月份选择
 ```vue
 <template>
   <XtDatePicker v-model="monthRange" dateType="month" />
@@ -85,9 +85,9 @@ export default {
 ```
 :::
 
-### 年份范围选择
+### 年份选择
 
-::: demo 年份范围选择
+::: demo 年份选择
 ```vue
 <template>
   <XtDatePicker v-model="yearRange" dateType="year" />
@@ -125,25 +125,6 @@ export default {
 ```
 :::
 
-### 单选模式
-
-::: demo 单选模式
-```vue
-<template>
-  <XtDatePicker v-model="singleDate" :range-mode="false" />
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      singleDate: null
-    }
-  }
-}
-</script>
-```
-:::
 
 ### 时间维度选择（统计分析）
 

package/docs/components/base/xt-grid-box.md

@@ -6,12 +6,12 @@
 ```vue
 <template>
   <XtGridBox :columns="3" gap="16px">
-    <div style="padding: 16px; background: #f0f0f0; border-radius: 8px;">项目1</div>
-    <div style="padding: 16px; background: #f0f0f0; border-radius: 8px;">项目2</div>
-    <div style="padding: 16px; background: #f0f0f0; border-radius: 8px;">项目3</div>
-    <div style="padding: 16px; background: #f0f0f0; border-radius: 8px;">项目4</div>
-    <div style="padding: 16px; background: #f0f0f0; border-radius: 8px;">项目5</div>
-    <div style="padding: 16px; background: #f0f0f0; border-radius: 8px;">项目6</div>
+    <div style="padding: 16px; background: #1890ff; color: white; border-radius: 8px;">元素1</div>
+    <div style="padding: 16px; background: #52c41a; color: white; border-radius: 8px;">元素2</div>
+    <div style="padding: 16px; background: #faad14; color: white; border-radius: 8px;">元素3</div>
+    <div style="padding: 16px; background: #f56c6c; color: white; border-radius: 8px;">元素4</div>
+    <div style="padding: 16px; background: #9adbbe; color: white; border-radius: 8px;">元素5</div>
+    <div style="padding: 16px; background: #40ffef; color: white; border-radius: 8px;">元素6</div>
   </XtGridBox>
 </template>
 ```
@@ -56,7 +56,7 @@
 ```vue
 <template>
   <XtGridBox :columns="4" gap="12px">
-    <div v-for="i in 8" :key="i" style="padding: 12px; background: #e6f7ff; border-radius: 4px; text-align: center;">{{ i }}</div>
+    <div v-for="i in 8" :key="i" style="padding: 12px; background: #1890ff; border-radius: 4px; text-align: center;">{{ i }}</div>
   </XtGridBox>
 </template>
 ```
@@ -70,21 +70,21 @@
   <div>
     <!-- 数字方式：自动 repeat -->
     <XtGridBox :columns="3" gap="8px" style="margin-bottom: 16px;">
-      <div v-for="i in 3" :key="i" style="padding: 12px; background: #f0f0f0;">{{ i }}</div>
+      <div v-for="i in 3" :key="i" style="padding: 12px; background: #1890ff;">{{ i }}</div>
     </XtGridBox>
     
     <!-- 字符串方式 -->
     <XtGridBox columns="200px 1fr 1fr" gap="8px" style="margin-bottom: 16px;">
-      <div style="padding: 12px; background: #e6f7ff;">固定宽度</div>
-      <div style="padding: 12px; background: #f6ffed;">弹性1</div>
-      <div style="padding: 12px; background: #fff7e6;">弹性2</div>
+      <div style="padding: 12px; background: #52c41a;">固定宽度</div>
+      <div style="padding: 12px; background: #faad14;">弹性1</div>
+      <div style="padding: 12px; background: #f5222d;">弹性2</div>
     </XtGridBox>
     
     <!-- 数组方式 -->
     <XtGridBox :columns="['100px', '1fr', '2fr']" gap="8px">
-      <div style="padding: 12px; background: #f9f0ff;">固定</div>
-      <div style="padding: 12px; background: #e6fffb;">1份</div>
-      <div style="padding: 12px; background: #fff7e6;">2份</div>
+      <div style="padding: 12px; background: #52c41a;">固定</div>
+      <div style="padding: 12px; background: #faad14;">1份</div>
+      <div style="padding: 12px; background: #f5222d;">2份</div>
     </XtGridBox>
   </div>
 </template>
@@ -97,13 +97,13 @@
 ```vue
 <template>
   <XtGridBox :columns="4" gap="12px">
-    <XtGridItem :span="2" style="padding: 24px; background: #1890ff; color: white; border-radius: 8px;">跨2列</XtGridItem>
+    <XtGridItem :span="2" style="padding: 24px; background: #52c41a; color: white; border-radius: 8px;">跨2列</XtGridItem>
     <XtGridItem style="padding: 24px; background: #52c41a; color: white; border-radius: 8px;">普通</XtGridItem>
     <XtGridItem style="padding: 24px; background: #52c41a; color: white; border-radius: 8px;">普通</XtGridItem>
     <XtGridItem :rowSpan="2" style="padding: 48px 16px; background: #faad14; color: white; border-radius: 8px;">跨2行</XtGridItem>
-    <XtGridItem style="padding: 24px; background: #f5222d; color: white; border-radius: 8px;">普通</XtGridItem>
-    <XtGridItem style="padding: 24px; background: #f5222d; color: white; border-radius: 8px;">普通</XtGridItem>
-    <XtGridItem style="padding: 24px; background: #f5222d; color: white; border-radius: 8px;">普通</XtGridItem>
+    <XtGridItem style="padding: 24px; background: #52c41a; color: white; border-radius: 8px;">普通</XtGridItem>
+    <XtGridItem style="padding: 24px; background: #52c41a; color: white; border-radius: 8px;">普通</XtGridItem>
+    <XtGridItem style="padding: 24px; background: #52c41a; color: white; border-radius: 8px;">普通</XtGridItem>
   </XtGridBox>
 </template>
 ```
@@ -139,16 +139,16 @@
   <div>
     <!-- 子项居中对齐 -->
     <XtGridBox :columns="3" gap="8px" align="center" style="height: 120px; background: #f0f0f0; margin-bottom: 16px;">
-      <div style="padding: 8px 16px; background: white;">居中</div>
-      <div style="padding: 8px 16px; background: white;">居中</div>
-      <div style="padding: 8px 16px; background: white;">居中</div>
+      <div style="padding: 8px 16px; background: #1890ff; color: white;">居中</div>
+      <div style="padding: 8px 16px; background: #1890ff; color: white;">居中</div>
+      <div style="padding: 8px 16px; background: #1890ff; color: white;">居中</div>
     </XtGridBox>
     
     <!-- 内容两端对齐 -->
     <XtGridBox :columns="3" gap="8px" justify="space-between" style="background: #f0f0f0;">
-      <div style="padding: 8px 16px; background: white;">左</div>
-      <div style="padding: 8px 16px; background: white;">中</div>
-      <div style="padding: 8px 16px; background: white;">右</div>
+      <div style="padding: 8px 16px;background: #1890ff; color: white;">左</div>
+      <div style="padding: 8px 16px;background: #1890ff; color: white;">中</div>
+      <div style="padding: 8px 16px;background: #1890ff; color: white;">右</div>
     </XtGridBox>
   </div>
 </template>
@@ -161,7 +161,7 @@
 ```vue
 <template>
   <XtGridBox :columns="3" rowGap="24px" colGap="8px">
-    <div v-for="i in 6" :key="i" style="padding: 12px; background: #e6f7ff; text-align: center;">{{ i }}</div>
+    <div v-for="i in 6" :key="i" style="padding: 12px; background: #1890ff; text-align: center;">{{ i }}</div>
   </XtGridBox>
 </template>
 ```
@@ -173,7 +173,7 @@
 ```vue
 <template>
   <XtGridBox columns="repeat(auto-fill, minmax(150px, 1fr))" gap="12px">
-    <div v-for="i in 8" :key="i" style="padding: 16px; background: #f0f0f0; text-align: center;">项目{{ i }}</div>
+    <div v-for="i in 8" :key="i" style="padding: 16px; background: #1890ff; text-align: center;">项目{{ i }}</div>
   </XtGridBox>
 </template>
 ```
@@ -186,22 +186,22 @@
 <template>
   <XtGridBox :columns="2" gap="16px">
     <!-- 左侧 -->
-    <div style="padding: 16px; background: #e6f7ff;">
+    <div style="padding: 16px; background: #f5222d;">
       <h4>左侧面板</h4>
       <XtGridBox :columns="1" gap="8px">
-        <div style="padding: 8px; background: white;">子项1</div>
-        <div style="padding: 8px; background: white;">子项2</div>
+        <div style="padding: 8px; background: #1890ff;">子项1</div>
+        <div style="padding: 8px; background: #1890ff;">子项2</div>
       </XtGridBox>
     </div>
     
     <!-- 右侧 -->
-    <div style="padding: 16px; background: #f6ffed;">
+    <div style="padding: 16px; background: #faad14;">
       <h4>右侧面板</h4>
       <XtGridBox :columns="2" gap="8px">
-        <div style="padding: 8px; background: white;">A</div>
-        <div style="padding: 8px; background: white;">B</div>
-        <div style="padding: 8px; background: white;">C</div>
-        <div style="padding: 8px; background: white;">D</div>
+        <div style="padding: 8px; background: #1890ff;">A</div>
+        <div style="padding: 8px; background: #1890ff;">B</div>
+        <div style="padding: 8px; background: #1890ff;">C</div>
+        <div style="padding: 8px; background: #1890ff;">D</div>
       </XtGridBox>
     </div>
   </XtGridBox>

package/docs/components/base/xt-tabs.md

@@ -61,7 +61,7 @@ export default {
 ```vue
 <template>
   <div style="display: flex; flex-direction: column; gap: 16px;">
-    <XtTabs v-model="activeName">
+    <XtTabs v-model="activeName" type="card">
       <XtTabPane label="卡片式" name="first">卡片式标签页</XtTabPane>
       <XtTabPane label="配置管理" name="second">配置管理内容</XtTabPane>
     </XtTabs>
@@ -89,10 +89,15 @@ export default {
 ::: demo 标签位置
 ```vue
 <template>
-  <XtTabs v-model="activeName" tab-position="left">
-    <XtTabPane label="用户管理" name="first">用户管理内容</XtTabPane>
-    <XtTabPane label="配置管理" name="second">配置管理内容</XtTabPane>
-    <XtTabPane label="角色管理" name="third">角色管理内容</XtTabPane>
+  <XtTabs v-model="activeName" tab-position="top" closable addable @edit="handleTabsEdit">
+    <XtTabPane
+    :key="item.name"
+    v-for="(item, index) in editableTabs"
+    :label="item.title"
+    :name="item.name"
+  >
+    {{item.content}}
+  </XtTabPane>
   </XtTabs>
 </template>
 
@@ -100,7 +105,47 @@ export default {
 export default {
   data() {
     return {
-      activeName: 'first'
+      editableTabsValue: '2',
+      editableTabs: [{
+        title: 'Tab 1',
+        name: '1',
+        content: 'Tab 1 content'
+      }, {
+        title: 'Tab 2',
+        name: '2',
+        content: 'Tab 2 content'
+      }],
+      tabIndex: 2
+    }
+  },
+  methods: {
+    handleTabsEdit(targetName, action) {
+      if (action === 'add') {
+        let newTabName = ++this.tabIndex + '';
+        this.editableTabs.push({
+          title: 'New Tab',
+          name: newTabName,
+          content: 'New Tab content'
+        });
+        this.editableTabsValue = newTabName;
+      }
+      if (action === 'remove') {
+        let tabs = this.editableTabs;
+        let activeName = this.editableTabsValue;
+        if (activeName === targetName) {
+          tabs.forEach((tab, index) => {
+            if (tab.name === targetName) {
+              let nextTab = tabs[index + 1] || tabs[index - 1];
+              if (nextTab) {
+                activeName = nextTab.name;
+              }
+            }
+          });
+        }
+        
+        this.editableTabsValue = activeName;
+        this.editableTabs = tabs.filter(tab => tab.name !== targetName);
+      }
     }
   }
 }

package/docs/components/base/xt-text.md

@@ -6,7 +6,6 @@
 ```vue
 <template>
   <XtText type="primary">主要文本</XtText>
-  <div style="width: 80px;"><XtText ellipsis>溢出隐藏文本溢出隐藏文本</XtText></div>
 </template>
 ```
 :::
@@ -17,8 +16,12 @@
 | `type` | String | - | `primary`、`success`、`warning`、`danger` | 文本颜色类型 |
 | `size` | String | base | `extra-large`、`large`、`medium`、`base`、`small`、`extra-small` | 字体大小 |
 | `bold` | Boolean | false | - | 是否加粗 |
-| `letterSpacing` | String / Number | - | - | 字间距 |
-| `money` | Boolean | false | - | 是否启用金额格式化 |
+| `ellipsis` | Boolean | false | - | 是否显示省略号 |
+| `ellipsisRows` | Number | 1 | 1至10 | 省略行数 |
+| `showTooltip` | Boolean | true | - | 当文字溢出隐藏时，是否显示悬浮提示 |
+| `tooltipPlacement` | String | `top` | - | 悬浮窗提示位置 |
+| `format` | String | normal | 'normal', 'thousand', 'money' |- | 格式化模式 |
+| `money` | Boolean | false | - | 是否启用金额格式化（使用format替代） |
 | `value` | Number / String | - | - | 金额数值 |
 | `currency` | String | CNY | `CNY`、`USD`、`EUR`、`JPY`、`GBP`、`AUD`、`CAD` | 货币类型 |
 | `decimals` | Number | 2 | 0-10 | 小数位数 |
@@ -85,6 +88,20 @@
 ```
 :::
 
+
+### 溢出隐藏
+::: demo 溢出隐藏
+```vue
+<template>
+  <div style="display: flex; flex-direction: column; gap: 8px;width: 80px;">
+    <XtText ellipsis>溢出隐藏文本溢出隐藏文本</XtText>
+    <XtText ellipsis :ellipsisRows="5">溢出隐藏文本显示5行，溢出隐藏文本显示5行，溢出隐藏文本显示5行，溢出隐藏文本显示5行，</XtText>
+    <XtText ellipsis :showTooltip="false">不显示浮窗提示信息</XtText>
+  </div>
+</template>
+```
+:::
+
 ### 组合使用
 
 ::: demo 组合使用

package/lib/css/1.87a493be.css

@@ -0,0 +1 @@
+.range-picker[data-v-32b85e82]{display:flex;align-items:center;flex-wrap:wrap;gap:8px;width:100%}.range-picker .el-date-editor[data-v-32b85e82]{flex:1;min-width:130px}.split[data-v-32b85e82]{flex-shrink:0;padding:0 4px}@media (max-width:360px){.range-picker[data-v-32b85e82]{flex-direction:column;align-items:stretch}.split[data-v-32b85e82]{text-align:center;margin:4px 0}}

package/lib/index.common.1.js

@@ -0,0 +1,294 @@
+((typeof self !== 'undefined' ? self : this)["webpackJsonpindex"] = (typeof self !== 'undefined' ? self : this)["webpackJsonpindex"] || []).push([[1,2],{
+
+/***/ "0e3e":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_RangeDate_vue_vue_type_style_index_0_id_32b85e82_prod_scoped_true_lang_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("16dd");
+/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_RangeDate_vue_vue_type_style_index_0_id_32b85e82_prod_scoped_true_lang_css__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_RangeDate_vue_vue_type_style_index_0_id_32b85e82_prod_scoped_true_lang_css__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
+/***/ }),
+
+/***/ "16dd":
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+
+/***/ }),
+
+/***/ "1db3":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"b8cd9b04-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/xt-date-picker/component/RangeDate.vue?vue&type=template&id=32b85e82&scoped=true
+var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:"range-picker"},[_c('Picker',{attrs:{"type":_vm.type,"size":"small","placeholder":_vm.startPlaceholder,"disabled":_vm.disabled,"disabled-date":_vm.disabledStart},on:{"change":_vm.handleChange},model:{value:(_vm.startVal),callback:function ($$v) {_vm.startVal=$$v},expression:"startVal"}}),_c('span',{staticClass:"split"},[_vm._v(_vm._s(_vm.separator))]),_c('Picker',{attrs:{"type":_vm.type,"size":"small","placeholder":_vm.endPlaceholder,"disabled":_vm.disabled,"disabled-date":_vm.disabledEnd},on:{"change":_vm.handleChange},model:{value:(_vm.endVal),callback:function ($$v) {_vm.endVal=$$v},expression:"endVal"}})],1)
+}
+var staticRenderFns = []
+
+
+// CONCATENATED MODULE: ./src/components/xt-date-picker/component/RangeDate.vue?vue&type=template&id=32b85e82&scoped=true
+
+// EXTERNAL MODULE: ./src/components/xt-date-picker/component/Picker.vue + 4 modules
+var Picker = __webpack_require__("b0ea");
+
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/xt-date-picker/component/RangeDate.vue?vue&type=script&lang=js
+
+  
+  /* harmony default export */ var RangeDatevue_type_script_lang_js = ({
+    name: 'RangeDate',
+    components: { Picker: Picker["default"] },
+    props: {
+      // 父组件v-model绑定数组 [startStr, endStr]
+      value: {
+        type: Array,
+        default: () => [null, null]
+      },
+      type: {
+        type: String,
+        default: 'date'
+      },
+      separator: {
+        type: String,
+        default: '至'
+      },
+      disabled: { type: Boolean, default: false }
+    },
+    data() {
+      return {
+        startVal: '',
+        endVal: ''
+      }
+    },
+    watch: {
+      // 外部回填回显
+      value: {
+        handler(val) {
+          const [s, e] = val || []
+          this.startVal = s || ''
+          this.endVal = e || ''
+        },
+        immediate: true
+      }
+    },
+    computed: {
+      startDate() {
+        return this.startVal ? new Date(this.startVal) : null
+      },
+      endDate() {
+        return this.endVal ? new Date(this.endVal) : null
+      },
+      startPlaceholder() {
+        const map = {
+          date: '开始日期',
+          month: '开始月份',
+          year: '开始年份',
+          quarter: '开始季度',
+          week: '开始周'
+        }
+        return map[this.type] || '开始日期'
+      },
+      endPlaceholder() {
+        const map = {
+          date: '结束日期',
+          month: '结束月份',
+          year: '结束年份',
+          quarter: '结束季度',
+          week: '结束周'
+        }
+        return map[this.type] || '结束日期'
+      }
+    },
+    methods: {
+      // 禁用开始：不能晚于已选结束
+      disabledStart(time) {
+        if (!this.endDate) return false
+        return time.getTime() > this.endDate.getTime()
+      },
+      // 禁用结束：不能早于已选开始
+      disabledEnd(time) {
+        if (!this.startDate) return false
+        return time.getTime() < this.startDate.getTime()
+      },
+      // 任意日期变更同步抛出数组给父组件
+      handleChange() {
+        this.$emit('input', [this.startVal, this.endVal])
+      }
+    }
+  });
+  
+// CONCATENATED MODULE: ./src/components/xt-date-picker/component/RangeDate.vue?vue&type=script&lang=js
+ /* harmony default export */ var component_RangeDatevue_type_script_lang_js = (RangeDatevue_type_script_lang_js); 
+// EXTERNAL MODULE: ./src/components/xt-date-picker/component/RangeDate.vue?vue&type=style&index=0&id=32b85e82&prod&scoped=true&lang=css
+var RangeDatevue_type_style_index_0_id_32b85e82_prod_scoped_true_lang_css = __webpack_require__("0e3e");
+
+// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
+var componentNormalizer = __webpack_require__("2877");
+
+// CONCATENATED MODULE: ./src/components/xt-date-picker/component/RangeDate.vue
+
+
+
+
+
+
+/* normalize component */
+
+var component = Object(componentNormalizer["a" /* default */])(
+  component_RangeDatevue_type_script_lang_js,
+  render,
+  staticRenderFns,
+  false,
+  null,
+  "32b85e82",
+  null
+  
+)
+
+/* harmony default export */ var RangeDate = __webpack_exports__["default"] = (component.exports);
+
+/***/ }),
+
+/***/ "b0ea":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"b8cd9b04-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/xt-date-picker/component/Picker.vue?vue&type=template&id=4a866a03
+var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:"date-picker"},[(_vm.type !== 'quarter')?_c('el-date-picker',_vm._g(_vm._b({attrs:{"type":_vm.pickerType,"value-format":_vm.valueFormat,"disabled":_vm.disabled,"placeholder":_vm.placeholder,"popper-append-to-body":"","popper-class":"base-date-popper"},model:{value:(_vm.innerValue),callback:function ($$v) {_vm.innerValue=$$v},expression:"innerValue"}},'el-date-picker',_vm.$attrs,false),_vm.$listeners)):_c('el-popover',{attrs:{"trigger":"manual","placement":"bottom-start","width":"240"},model:{value:(_vm.quarterPopVisible),callback:function ($$v) {_vm.quarterPopVisible=$$v},expression:"quarterPopVisible"}},[_c('div',{staticClass:"quarter-panel"},[_c('div',{staticClass:"quarter-header"},[_c('el-button',{attrs:{"icon":"el-icon-d-arrow-left"},on:{"click":function($event){_vm.year--}}}),_c('span',[_vm._v(_vm._s(_vm.year)+" 年")]),_c('el-button',{attrs:{"icon":"el-icon-d-arrow-right"},on:{"click":function($event){_vm.year++}}})],1),_c('div',{staticClass:"quarter-list"},_vm._l((4),function(q){return _c('div',{key:q,staticClass:"quarter-item",class:{ active: _vm.quarterNum === q },on:{"click":function($event){return _vm.selectQuarter(q)}}},[_vm._v(" Q"+_vm._s(q)+" ")])}),0)]),_c('el-input',{ref:"quarterInput",attrs:{"slot":"reference","size":"small","readonly":"","placeholder":_vm.placeholder,"disabled":_vm.disabled,"clearable":""},on:{"clear":_vm.handleClearQuarter},slot:"reference",model:{value:(_vm.quarterShowText),callback:function ($$v) {_vm.quarterShowText=$$v},expression:"quarterShowText"}},[_c('i',{staticClass:"el-icon-date",attrs:{"slot":"affix"},slot:"affix"})])],1)],1)
+}
+var staticRenderFns = []
+
+
+// CONCATENATED MODULE: ./src/components/xt-date-picker/component/Picker.vue?vue&type=template&id=4a866a03
+
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/xt-date-picker/component/Picker.vue?vue&type=script&lang=js
+
+/* harmony default export */ var Pickervue_type_script_lang_js = ({
+  name: 'BaseDatePicker',
+  inheritAttrs: false,
+  props: {
+    value: {
+      type: [String, null],
+      default: null
+    },
+    type: {
+      type: String,
+      default: 'date',
+      validator: val => ['date', 'month', 'year', 'quarter', 'week'].includes(val)
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      quarterPopVisible: false,
+      year: new Date().getFullYear(),
+      quarterNum: null
+    }
+  },
+  computed: {
+    pickerType() {
+      return this.type === 'quarter' ? null : this.type
+    },
+    placeholder() {
+      const map = {
+        date: '请选择日期',
+        month: '请选择月份',
+        year: '请选择年份',
+        quarter: '请选择季度',
+        week: '请选择周'
+      }
+      return map[this.type] || '请选择日期'
+    },
+    valueFormat() {
+      const map = {
+        date: 'yyyy-MM-dd',
+        month: 'yyyy-MM',
+        year: 'yyyy',
+        quarter: 'yyyy-Qq',
+        week: 'yyyy-WW'
+      }
+      return map[this.type] || 'yyyy-MM-dd'
+    },
+    innerValue: {
+      get() { return this.value },
+      set(val) { this.$emit('input', val) }
+    },
+    quarterShowText() {
+      if (!this.value) return ''
+      return `${this.year}-Q${this.quarterNum}`
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        if (this.type !== 'quarter' || !val) {
+          this.quarterNum = null
+          return
+        }
+        const [y, q] = val.split('-Q')
+        this.year = Number(y)
+        this.quarterNum = Number(q)
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    selectQuarter(q) {
+      this.quarterNum = q
+      const val = `${this.year}-Q${q}`
+      this.$emit('input', val)
+      this.quarterPopVisible = false
+    },
+    handleClearQuarter() {
+      this.quarterNum = null
+      this.$emit('input', null)
+    }
+  },
+  mounted() {
+    if (this.type === 'quarter' && this.$refs.quarterInput) {
+      this.$refs.quarterInput.$el.addEventListener('click', () => {
+        if (!this.disabled) this.quarterPopVisible = true
+      })
+    }
+  }
+});
+
+// CONCATENATED MODULE: ./src/components/xt-date-picker/component/Picker.vue?vue&type=script&lang=js
+ /* harmony default export */ var component_Pickervue_type_script_lang_js = (Pickervue_type_script_lang_js); 
+// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
+var componentNormalizer = __webpack_require__("2877");
+
+// CONCATENATED MODULE: ./src/components/xt-date-picker/component/Picker.vue
+
+
+
+
+
+/* normalize component */
+
+var component = Object(componentNormalizer["a" /* default */])(
+  component_Pickervue_type_script_lang_js,
+  render,
+  staticRenderFns,
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* harmony default export */ var Picker = __webpack_exports__["default"] = (component.exports);
+
+/***/ })
+
+}]);