ct-component-plus 0.0.18 → 0.0.20

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ct-component-plus",
   "private": false,
-  "version": "0.0.18",
+  "version": "0.0.20",
   "type": "module",
   "main": "packages/components/index.js",
   "files": [

package/packages/components/cascader/src/cascader.vue

@@ -22,7 +22,15 @@
 </template>
 
 <script setup>
-import { onMounted, computed, ref, watch, inject, watchEffect } from "vue";
+import {
+  onMounted,
+  computed,
+  ref,
+  watch,
+  inject,
+  watchEffect,
+  nextTick,
+} from "vue";
 import { cascaderEmits, cascaderProps } from "./index";
 import { useNamespace, useBuriedParams } from "../../../hooks";
 import { isArray, isFunction } from "../../../utils";
@@ -54,15 +62,18 @@ const showValue = computed({
   },
   set(newValue) {
     emit("update:modelValue", newValue);
-    if (isFunction(props.cbs.change)) {
-      const checkedNodes = cascaderRef.value?.getCheckedNodes() || [];
-      const dataList = checkedNodes.map((item) => {
-        return item.data;
-      });
-      props.cbs.change(dataList, cascaderRef.value);
-    }
   },
 });
+watch(showValue, async (newValue) => {
+  if (isFunction(props.cbs.change)) {
+    await nextTick(); //这里得等一个nextTick，否则会拿不到最新选中的值
+    const checkedNodes = cascaderRef.value?.getCheckedNodes() || [];
+    const dataList = checkedNodes.map((item) => {
+      return item.data;
+    });
+    props.cbs.change(dataList, cascaderRef.value);
+  }
+});
 const popperClassShow = computed(() => {
   let popperClass = ns.e("dropdown");
   popperClass += props.popperClass || "";

package/packages/components/select/src/select.vue

@@ -222,7 +222,14 @@ watchEffect(async () => {
     } catch (error) {}
   }
 });
-const checkedAll = useCheckedAll(filterOptions, valueModel).checkedAll;
+const checkedAll = useCheckedAll(filterOptions, valueModel, {
+  onCheckedAll: (falg) => {
+    if (!keyword.value && !falg) {
+      // 没有搜索，去掉全选就置空
+      valueModel.value = [];
+    }
+  },
+}).checkedAll;
 
 const focusFilter = () => {
   if (filterInput.value && filterInput.value.focus) {

package/packages/components/table/src/TableSort.vue

@@ -124,9 +124,8 @@ const handleProp = (item) => {
   }
   &__content {
     @{R}__item{
-      height: 30px;
-      line-height: 30px;
-      padding: 0 16px;
+      line-height: 20px;
+      padding: 5px 16px;
       border-radius: 4px;
       cursor: pointer;
       display: flex;
@@ -161,6 +160,8 @@ const handleProp = (item) => {
     }
     @{R}__list{
       margin-top: 8px;
+      max-height: 300px;
+      overflow-y: auto;
     }
     @{R}__list--item{
 
@@ -170,7 +171,7 @@ const handleProp = (item) => {
 </style>
 
 <style lang="less">
-.el-popover.ct-table-sort__popover {
+.el-popover.el-popper.ct-table-sort__popover {
   padding: 11px 6px;
   min-width: 134px;
   box-shadow: 0px 4px 14px 0px rgba(102, 114, 144, 0.1);

package/packages/components/tabs/src/tabs.vue

@@ -10,7 +10,7 @@
       ]"
       @click="handleClick(item, index)"
     >
-      <slot>
+      <slot :index="index" :item="item">
         <span :class="ns.e('item-text')">{{ item.label }}</span>
       </slot>
     </div>

package/packages/hooks/use-checked-all/index.js

@@ -2,7 +2,7 @@ import { computed } from "vue"
 import { isArray, isObject } from '../../utils';
 
 export const useCheckedAll = (list, selects, options = {}) => {
-  const { key = 'value' } = (isObject(options) ? options : {})
+  const { key = 'value', onCheckedAll } = (isObject(options) ? options : {})
   const listKeys = computed(() => {
     if (isArray(list.value)) return list.value.map(item => item[key])
     return []
@@ -25,6 +25,7 @@ export const useCheckedAll = (list, selects, options = {}) => {
       if (!newValue) {
         // 去掉全选
         selects.value = selects.value.filter(item => !listKeys.value.includes(item))
+        if (typeof onCheckedAll === 'function') onCheckedAll(false)
       } else {
         // 全选
         selects.value = selects.value.concat(listKeys.value.filter(item => !selects.value.includes(item)))

package/packages/style/element.less

@@ -14,6 +14,7 @@
   --el-fill-color-light: var(--ct-component-hover-color);
 
   --ct-cascader-node-height: 30px;
+  --el-disabled-text-color: var(--ct-font-color);
 }
 
 .el {
@@ -105,6 +106,11 @@
         line-height: calc(var(--el-input-height) - 2px);
       }
     }
+    &.is-disabled {
+      .el-input__inner {
+        -webkit-text-fill-color: unset;
+      }
+    }
   }
 
   &-select {

package/packages/style/init.less

@@ -86,21 +86,19 @@ body {
   -webkit-font-smoothing: antialiased;
   
 }
-input::placeholder,
-input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
-  color: var(--ct-color-placeholder);
-}
 :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: var(--ct-color-placeholder);
 }
 ::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: var(--ct-color-placeholder);
 }
-input:-ms-input-placeholder { /* Internet Explorer 10-11 */
- color:var(--ct-color-placeholder);
-}
-input::-ms-input-placeholder { /* Microsoft Edge */
- color: var(--ct-color-placeholder);
+input {
+  &::placeholder,
+  &::-webkit-input-placeholder,
+  &:-ms-input-placeholder,
+  &::-ms-input-placeholder {
+    color: var(--ct-color-placeholder);
+  }
 }
 ::-webkit-scrollbar {
   width: 7px;