@netang/quasar 0.0.36 → 0.0.39

package/components/field-tree/index.vue

@@ -81,9 +81,9 @@
             no-refocus
             no-focus
             fit
-            @focus="onPopupFocus"
+            @focus="onFieldFocus"
             @show="onPopupShow"
-            @before-hide="onPopupBeforeHide"
+            @before-hide="showPopup = false"
             v-if="! readonly"
         >
             <q-card>
@@ -96,10 +96,10 @@
                     :nodes="nodes"
                     :node-key="nodeKey"
                     :label-key="labelKey"
+                    :ticked="treeTicked"
+                    @update:ticked="emitModelValue"
                     v-model:expanded="treeExpanded"
                     :tick-strategy="currentTickStrategy"
-                    :ticked="treeTicked"
-                    @update:ticked="onUpdateTicked"
                     :accordion="accordion"
                 >
                     <template v-slot:default-header="{ node }">
@@ -214,15 +214,15 @@ export default {
         // 树节点
         const treeRef = ref(null)
 
-        // 树选择数据
-        const treeTicked = ref(formatModelValue())
-
         // tree all
         let treeAll = getTreeAll()
 
         // 树展开数据
         const treeExpanded = ref(getExpanded())
 
+        // 树选择数据
+        const treeTicked = ref(formatModelValue(props.modelValue))
+
         // ==========【计算属性】=========================================================================================
 
         /**
@@ -260,7 +260,7 @@ export default {
         /**
          * 监听节点数组
          */
-        watch(()=>props.nodes, function () {
+        watch(() => props.nodes, function () {
             // 更新 tree all
             treeAll = getTreeAll()
         })
@@ -268,10 +268,10 @@ export default {
         /**
          * 监听声明值
          */
-        watch(()=>props.modelValue, function() {
+        watch(() => props.modelValue, function(val) {
 
             // 设置选中数据
-            treeTicked.value = formatModelValue()
+            treeTicked.value = formatModelValue(val)
 
             // 设置输入框焦点
             setInputFocus()
@@ -377,25 +377,27 @@ export default {
         /**
          * 格式化传值
          */
-        function formatModelValue() {
+        function formatModelValue(val) {
+
+            // 如果是多选
             if (props.multiple) {
-                if (utils.isValidArray(props.modelValue)) {
-                    return props.modelValue
-                }
-                return []
+                return utils.isValidArray(val) ? val : []
             }
 
-            if (utils.isRequired(props.modelValue)) {
-                return [props.modelValue]
+            // 如果为有效值
+            if (utils.isRequired(val)) {
+                return [ val ]
             }
 
             return []
         }
 
         /**
-         * 更新选择树数据回调
+         * 触发更新值
          */
-        function onUpdateTicked(val) {
+        function emitModelValue(val) {
+
+            // 触发更新值
             emit('update:modelValue', val)
         }
 
@@ -409,23 +411,32 @@ export default {
 
                 // 如果是父节点
                 if (utils.isValidArray(children)) {
+
                     // 则无任何操作
                     return
                 }
 
-                const newTicked = [...treeTicked.value]
+                // 克隆已选树数据
+                const _ticked = [...treeTicked.value]
+
+                // 获取值在树数据中的索引
+                const index = utils.indexOf(_ticked, id)
 
                 // 如果在数据中
-                const index = utils.indexOf(newTicked, id)
                 if (index > -1) {
-                    newTicked.splice(index, 1)
+                    // 则删除
+                    _ticked.splice(index, 1)
+                // 否则
                 } else {
-                    newTicked.push(id)
+                    // 添加
+                    _ticked.push(id)
                 }
 
+                // 触发更新值
                 // 设置树选择数据
-                emit('update:modelValue', newTicked)
+                emitModelValue(_ticked)
 
+            // 否则是单选
             } else {
 
                 if (
@@ -438,8 +449,9 @@ export default {
                     return
                 }
 
+                // 触发更新值
                 // 设置树选择数据
-                emit('update:modelValue', id)
+                emitModelValue(id)
 
                 // 则停止冒泡
                 e.preventDefault()
@@ -451,12 +463,19 @@ export default {
         }
 
         /**
-         * 移除单个
+         * 移除单个节点
          */
         function onRemoveItem(index) {
-            const newValue = [...treeTicked.value]
-            newValue.splice(index, 1)
-            emit('update:modelValue', newValue)
+
+            // 克隆已选树数据
+            const _ticked = [...treeTicked.value]
+
+            // 删除该节点
+            _ticked.splice(index, 1)
+
+            // 触发更新值
+            // 设置树选择数据
+            emitModelValue(_ticked)
         }
 
         /**
@@ -497,27 +516,14 @@ export default {
          */
         function onFieldClear() {
 
-            // 更新值
-            emit('update:modelValue', props.multiple ? [] : null)
+            // 触发更新值
+            // 清空树数据
+            emitModelValue(props.multiple ? [] : null)
 
             // 隐藏弹出层
             popupRef.value.hide()
         }
 
-        /**
-         * 弹出层获取焦点触发
-         */
-        function onPopupFocus(e) {
-
-            // 停止冒泡
-            e.stopPropagation()
-
-            // 设置输入框焦点
-            setInputFocus()
-
-            window.scrollTo(window.pageXOffset || window.scrollX || document.body.scrollLeft || 0, 0)
-        }
-
         /**
          * 弹出层显示回调
          */
@@ -530,15 +536,6 @@ export default {
             setInputFocus()
         }
 
-        /**
-         * 弹出层隐藏前显示回调
-         */
-        function onPopupBeforeHide() {
-
-            // 隐藏弹出层
-            showPopup.value = false
-        }
-
         /**
          * 设置输入框文字选中
          */
@@ -604,8 +601,8 @@ export default {
             // 当前节点选择策略
             currentTickStrategy,
 
-            // 更新选择树数据回调
-            onUpdateTicked,
+            // 触发更新值
+            emitModelValue,
             // 点击节点
             onNode,
             // 移除单个
@@ -618,12 +615,8 @@ export default {
             // 字段清空触发
             onFieldClear,
 
-            // 弹出层获取焦点触发
-            onPopupFocus,
             // 弹出层显示回调
             onPopupShow,
-            // 弹出层隐藏前显示回调
-            onPopupBeforeHide,
         }
     },
 }

package/components/input-format/index.vue

@@ -35,9 +35,9 @@ export default {
         // 值是否为数组
         valueArray: Boolean,
         // 修改前值
-        formatBefore: [Function, Object, Boolean],
+        formatBefore: [ Function, Object, Boolean ],
         // 修改后值
-        formatAfter: [Function, Object, Boolean],
+        formatAfter: [ Function, Object, Boolean ],
     },
 
     /**
@@ -72,8 +72,14 @@ export default {
         /**
          * 监听声明值
          */
-        watch(()=>props.modelValue, function (val) {
+        watch(() => props.modelValue, function (val) {
+
+            // 格式化声明值
             currentValue.value = formatModelValue(val)
+
+        }, {
+            // 深度监听
+            deep: true,
         })
 
         // ==========【方法】=============================================================================================
@@ -160,8 +166,6 @@ export default {
          */
         function formatStringValue(val, params, valueArray) {
 
-            console.log(val, params, valueArray)
-
             const o = Object.assign({
                 // 替换内容
                 replace: /\n|\，|\s+/g,

package/components/input-number/index.vue

@@ -283,7 +283,8 @@ export default {
         // 如果当前值 !== 声明值
         const rawModelValue = formatToModelValue(currentValue.value)
         if (rawModelValue !== props.modelValue) {
-            // 则更新值
+
+            // 触发更新值
             emitModelValue(rawModelValue)
         }
 
@@ -292,7 +293,7 @@ export default {
         /**
          * 监听声明值
          */
-        watch(()=>props.modelValue, function (val) {
+        watch(() => props.modelValue, function (val) {
 
             // 格式化为当前值
             val = formatToCurrentValue(val, true)
@@ -325,10 +326,11 @@ export default {
         // ==========【方法】=============================================================================================
 
         /**
-         * 更新值
+         * 触发更新值
          */
         function emitModelValue(val) {
-            // 更新值
+
+            // 触发更新值
             emit('update:modelValue', val)
         }
 
@@ -457,7 +459,7 @@ export default {
                 // 将当前值转为声明值
                 val = formatToModelValue(val)
 
-                // 更新值
+                // 触发更新值
                 emitModelValue(val)
 
                 // 失去焦点触发
@@ -485,7 +487,7 @@ export default {
                 // 更新当前值
                 currentValue.value = val
 
-                // 更新值
+                // 触发更新值
                 emitModelValue(formatToModelValue(val))
             }
         }

package/components/table/index.vue

@@ -352,7 +352,7 @@ export default {
                     if (utils.isValidObject(res)) {
 
                         // 设置表格传参
-                        $table.tableQuery.value = res
+                        $table.setQuery(res)
 
                         // 表格重新加载
                         $table.tableReload()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netang/quasar",
-  "version": "0.0.36",
+  "version": "0.0.39",
   "description": "netang-quasar",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

package/sass/var.scss

@@ -0,0 +1,141 @@
+// ==========【quasar 重定义】=====================================================================================================
+
+$primary   : #4380fa;
+$secondary : #19be6b;
+$accent    : #9C27B0;
+
+$dark      : #27282e;
+$dark-page : #1b1c21;
+
+$positive  : #19be6b;
+$negative  : #ff3750;
+$info      : #2db7f5;
+$warning   : #ff9900;
+
+//$shadow-color         : #000000 !default;
+//$elevation-umbra      : rgba($shadow-color, 0.1) !default;
+//$elevation-penumbra   : rgba($shadow-color, 0.1) !default;
+//$elevation-ambient    : rgba($shadow-color, 0.1) !default;
+
+// 按钮紧凑内边距
+$button-dense-padding: 0.285em 16px !important;
+
+// ==========【自定义】=====================================================================================================
+
+$color-gray-dark: $dark-page;
+$color-gray-white: #ffffff;
+
+$color-gray-99: mix($color-gray-dark, $color-gray-white, 99%);
+$color-gray-98: mix($color-gray-dark, $color-gray-white, 98%);
+$color-gray-97: mix($color-gray-dark, $color-gray-white, 97%);
+$color-gray-96: mix($color-gray-dark, $color-gray-white, 96%);
+$color-gray-95: mix($color-gray-dark, $color-gray-white, 95%);
+$color-gray-94: mix($color-gray-dark, $color-gray-white, 94%);
+$color-gray-93: mix($color-gray-dark, $color-gray-white, 93%);
+$color-gray-92: mix($color-gray-dark, $color-gray-white, 92%);
+$color-gray-91: mix($color-gray-dark, $color-gray-white, 91%);
+$color-gray-90: mix($color-gray-dark, $color-gray-white, 90%);
+$color-gray-89: mix($color-gray-dark, $color-gray-white, 89%);
+$color-gray-88: mix($color-gray-dark, $color-gray-white, 88%);
+$color-gray-87: mix($color-gray-dark, $color-gray-white, 87%);
+$color-gray-86: mix($color-gray-dark, $color-gray-white, 86%);
+$color-gray-85: mix($color-gray-dark, $color-gray-white, 85%);
+$color-gray-84: mix($color-gray-dark, $color-gray-white, 84%);
+$color-gray-83: mix($color-gray-dark, $color-gray-white, 83%);
+$color-gray-82: mix($color-gray-dark, $color-gray-white, 82%);
+$color-gray-81: mix($color-gray-dark, $color-gray-white, 81%);
+$color-gray-80: mix($color-gray-dark, $color-gray-white, 80%);
+$color-gray-79: mix($color-gray-dark, $color-gray-white, 79%);
+$color-gray-78: mix($color-gray-dark, $color-gray-white, 78%);
+$color-gray-77: mix($color-gray-dark, $color-gray-white, 77%);
+$color-gray-76: mix($color-gray-dark, $color-gray-white, 76%);
+$color-gray-75: mix($color-gray-dark, $color-gray-white, 75%);
+$color-gray-74: mix($color-gray-dark, $color-gray-white, 74%);
+$color-gray-73: mix($color-gray-dark, $color-gray-white, 73%);
+$color-gray-72: mix($color-gray-dark, $color-gray-white, 72%);
+$color-gray-71: mix($color-gray-dark, $color-gray-white, 71%);
+$color-gray-70: mix($color-gray-dark, $color-gray-white, 70%);
+$color-gray-69: mix($color-gray-dark, $color-gray-white, 69%);
+$color-gray-68: mix($color-gray-dark, $color-gray-white, 68%);
+$color-gray-67: mix($color-gray-dark, $color-gray-white, 67%);
+$color-gray-66: mix($color-gray-dark, $color-gray-white, 66%);
+$color-gray-65: mix($color-gray-dark, $color-gray-white, 65%);
+$color-gray-64: mix($color-gray-dark, $color-gray-white, 64%);
+$color-gray-63: mix($color-gray-dark, $color-gray-white, 63%);
+$color-gray-62: mix($color-gray-dark, $color-gray-white, 62%);
+$color-gray-61: mix($color-gray-dark, $color-gray-white, 61%);
+$color-gray-60: mix($color-gray-dark, $color-gray-white, 60%);
+$color-gray-59: mix($color-gray-dark, $color-gray-white, 59%);
+$color-gray-58: mix($color-gray-dark, $color-gray-white, 58%);
+$color-gray-57: mix($color-gray-dark, $color-gray-white, 57%);
+$color-gray-56: mix($color-gray-dark, $color-gray-white, 56%);
+$color-gray-55: mix($color-gray-dark, $color-gray-white, 55%);
+$color-gray-54: mix($color-gray-dark, $color-gray-white, 54%);
+$color-gray-53: mix($color-gray-dark, $color-gray-white, 53%);
+$color-gray-52: mix($color-gray-dark, $color-gray-white, 52%);
+$color-gray-51: mix($color-gray-dark, $color-gray-white, 51%);
+$color-gray-50: mix($color-gray-dark, $color-gray-white, 50%);
+$color-gray-49: mix($color-gray-dark, $color-gray-white, 49%);
+$color-gray-48: mix($color-gray-dark, $color-gray-white, 48%);
+$color-gray-47: mix($color-gray-dark, $color-gray-white, 47%);
+$color-gray-46: mix($color-gray-dark, $color-gray-white, 46%);
+$color-gray-45: mix($color-gray-dark, $color-gray-white, 45%);
+$color-gray-44: mix($color-gray-dark, $color-gray-white, 44%);
+$color-gray-43: mix($color-gray-dark, $color-gray-white, 43%);
+$color-gray-42: mix($color-gray-dark, $color-gray-white, 42%);
+$color-gray-41: mix($color-gray-dark, $color-gray-white, 41%);
+$color-gray-40: mix($color-gray-dark, $color-gray-white, 40%);
+$color-gray-39: mix($color-gray-dark, $color-gray-white, 39%);
+$color-gray-38: mix($color-gray-dark, $color-gray-white, 38%);
+$color-gray-37: mix($color-gray-dark, $color-gray-white, 37%);
+$color-gray-36: mix($color-gray-dark, $color-gray-white, 36%);
+$color-gray-35: mix($color-gray-dark, $color-gray-white, 35%);
+$color-gray-34: mix($color-gray-dark, $color-gray-white, 34%);
+$color-gray-33: mix($color-gray-dark, $color-gray-white, 33%);
+$color-gray-32: mix($color-gray-dark, $color-gray-white, 32%);
+$color-gray-31: mix($color-gray-dark, $color-gray-white, 31%);
+$color-gray-30: mix($color-gray-dark, $color-gray-white, 30%);
+$color-gray-29: mix($color-gray-dark, $color-gray-white, 29%);
+$color-gray-28: mix($color-gray-dark, $color-gray-white, 28%);
+$color-gray-27: mix($color-gray-dark, $color-gray-white, 27%);
+$color-gray-26: mix($color-gray-dark, $color-gray-white, 26%);
+$color-gray-25: mix($color-gray-dark, $color-gray-white, 25%);
+$color-gray-24: mix($color-gray-dark, $color-gray-white, 24%);
+$color-gray-23: mix($color-gray-dark, $color-gray-white, 23%);
+$color-gray-22: mix($color-gray-dark, $color-gray-white, 22%);
+$color-gray-21: mix($color-gray-dark, $color-gray-white, 21%);
+$color-gray-20: mix($color-gray-dark, $color-gray-white, 20%);
+$color-gray-16: mix($color-gray-dark, $color-gray-white, 16%);
+$color-gray-19: mix($color-gray-dark, $color-gray-white, 19%);
+$color-gray-18: mix($color-gray-dark, $color-gray-white, 18%);
+$color-gray-17: mix($color-gray-dark, $color-gray-white, 17%);
+$color-gray-16: mix($color-gray-dark, $color-gray-white, 16%);
+$color-gray-15: mix($color-gray-dark, $color-gray-white, 15%);
+$color-gray-14: mix($color-gray-dark, $color-gray-white, 14%);
+$color-gray-13: mix($color-gray-dark, $color-gray-white, 13%);
+$color-gray-12: mix($color-gray-dark, $color-gray-white, 12%);
+$color-gray-11: mix($color-gray-dark, $color-gray-white, 11%);
+$color-gray-10: mix($color-gray-dark, $color-gray-white, 10%);
+$color-gray-9: mix($color-gray-dark, $color-gray-white, 9%);
+$color-gray-8: mix($color-gray-dark, $color-gray-white, 8%);
+$color-gray-7: mix($color-gray-dark, $color-gray-white, 7%);
+$color-gray-6: mix($color-gray-dark, $color-gray-white, 6%);
+$color-gray-5: mix($color-gray-dark, $color-gray-white, 5%);
+$color-gray-4: mix($color-gray-dark, $color-gray-white, 4%);
+$color-gray-3: mix($color-gray-dark, $color-gray-white, 3%);
+$color-gray-2: mix($color-gray-dark, $color-gray-white, 2%);
+$color-gray-1: mix($color-gray-dark, $color-gray-white, 1%);
+
+$color-ccc: #cccccc;
+$color-999: #999999;
+$color-888: #888888;
+$color-777: #777777;
+$color-666: #666666;
+$color-555: #555555;
+$color-444: #444444;
+$color-333: #333333;
+$color-222: #222222;
+$color-111: #111111;
+$color-000: $color-gray-dark;
+
+@import "~quasar/src/css/variables.sass";

package/utils/$table.js

@@ -217,9 +217,6 @@ function create(params) {
     // 表格宫格
     const tableGrid = ref(o.showGrid && isCache ? utils.storage.get('table:grid:' + cacheName) === true : false)
 
-    // 表格传参
-    const tableQuery = ref({})
-
     // 表格请求参数(将表格传参中的搜索参数剥离掉, 剩下的直接当做参数传递给服务器)
     let tableRequestQuery = {}
 
@@ -371,10 +368,12 @@ function create(params) {
         })
     }
 
+    // ==========【方法】================================================================================================
+
     /**
-     * 监听表格传参
+     * 设置表格传参
      */
-    watch(tableQuery, function (query) {
+    function setQuery(query) {
 
         if (utils.isValidObject(query)) {
 
@@ -475,13 +474,8 @@ function create(params) {
         }
 
         tableRequestQuery = {}
+    }
 
-    }, {
-        // 深度监听
-        deep: true,
-    })
-
-    // ==========【方法】================================================================================================
 
     /**
      * 表格是否已加载
@@ -892,8 +886,6 @@ function create(params) {
 
         // 表格宫格
         tableGrid,
-        // 表格传参
-        tableQuery,
         // 表格合计
         tableSummary,
         // 表格搜索数据
@@ -901,6 +893,8 @@ function create(params) {
         // 表格搜索参数
         tableSearchOptions,
 
+        // 设置表格传参
+        setQuery,
         // 表格是否已加载
         isTableLoaded,
         // 表格加载(只加载一次)

package/utils/price.js

@@ -1,13 +1,13 @@
-/**
- * 换算金额
- */
-utils.price = function(value, params) {
-    return utils.decimal(value, Object.assign({
-        // 最小值
-        min: 0,
-        // 小数点位数
-        decimalLength: 2,
-        // 是否开启人民币分转元(如值 189 -> 1.89)
-        centToYuan: utils.config('priceCent') === true,
-    }, params))
-}
+/**
+ * 换算金额
+ */
+utils.price = function(value, params) {
+    return utils.decimal(value, Object.assign({
+        // 最小值
+        min: 0,
+        // 小数点位数
+        decimalLength: 2,
+        // 是否开启人民币分转元(如值 189 -> 1.89)
+        centToYuan: utils.config('priceCent') === true,
+    }, params))
+}