chain-saasui 1.0.6 → 1.0.7

package/components/src/SDrawer/index.vue

@@ -1,97 +1,97 @@
-<template>
-    <el-drawer class="saas-drawer" v-bind="bindProps" :wrapperClosable="false" v-on="$listeners" :visible.sync="show">
-        <template v-if="$slots.title" slot="title">
-            <slot name="title"></slot>
-        </template>
-        <div class="saas-drawer-content">
-            <slot></slot>
-        </div>
-        <div v-if="showFooter" class="saas-drawer-footer">
-            <slot v-if="$slots.footer" name="footer"></slot>
-            <template v-else>
-                <el-button v-if="showCancelButton" @click="handleClose">{{ cancelText }}</el-button>
-                <el-button v-if="showConfirmButton" :loading="loadingBtn" type="primary" @click="handleSubmit" v-preventReClick="5000">
-                    {{ confirmText }}
-                </el-button>
-            </template>
-        </div>
-    </el-drawer>
-</template>
-<script>
-import { Drawer } from 'element-ui';
-import { omit } from 'chain-lodash';
-export default {
-    name: 'SDrawer',
-    props: {
-        ...Drawer.props,
-        showFooter: {
-            type: Boolean,
-            default: () => true,
-        },
-        size: {
-            type: [String, Number],
-            default: () => '800px',
-        },
-        wrapperClosable: {
-            type: Boolean,
-            default: () => false,
-        },
-        loadingBtn: {
-            type: Boolean,
-            default: () => false,
-        },
-        appendToBody: {
-            type: Boolean,
-            default: true,
-        },
-        showCancelButton: {
-            type: Boolean,
-            default: true,
-        },
-        showConfirmButton: {
-            type: Boolean,
-            default: true,
-        },
-        confirmText: {
-            type: String,
-            default() {
-                return this.$t('buttonGroup.sure');
-            },
-        },
-        cancelText: {
-            type: String,
-            default() {
-                return this.$t('buttonGroup.cancel');
-            },
-        },
-    },
-    data() {
-        return {};
-    },
-    computed: {
-        show: {
-            get() {
-                return this.visible;
-            },
-            set(val) {
-                this.$emit('update:visible', val);
-            },
-        },
-        bindProps() {
-            return omit(this.$props, ['visible']);
-        },
-    },
-    deactivated() {
-        this.handleClose(); // 在缓存组件时关闭弹窗
-    },
-    methods: {
-        handleSubmit() {
-            this.$emit('confirm');
-        },
-        handleClose() {
-            this.$emit('update:visible', false);
-            this.$emit('close');
-        },
-    },
-};
-</script>
+<template>
+    <el-drawer class="saas-drawer" v-bind="bindProps" :wrapperClosable="false" v-on="$listeners" :visible.sync="show">
+        <template v-if="$slots.title" slot="title">
+            <slot name="title"></slot>
+        </template>
+        <div class="saas-drawer-content">
+            <slot></slot>
+        </div>
+        <div v-if="showFooter" class="saas-drawer-footer">
+            <slot v-if="$slots.footer" name="footer"></slot>
+            <template v-else>
+                <el-button v-if="showCancelButton" @click="handleClose">{{ cancelText }}</el-button>
+                <el-button v-if="showConfirmButton" :loading="loadingBtn" type="primary" @click="handleSubmit" v-preventReClick="5000">
+                    {{ confirmText }}
+                </el-button>
+            </template>
+        </div>
+    </el-drawer>
+</template>
+<script>
+import { Drawer } from 'element-ui';
+import { omit } from 'chain-lodash';
+export default {
+    name: 'SDrawer',
+    props: {
+        ...Drawer.props,
+        showFooter: {
+            type: Boolean,
+            default: () => true,
+        },
+        size: {
+            type: [String, Number],
+            default: () => '800px',
+        },
+        wrapperClosable: {
+            type: Boolean,
+            default: () => false,
+        },
+        loadingBtn: {
+            type: Boolean,
+            default: () => false,
+        },
+        appendToBody: {
+            type: Boolean,
+            default: true,
+        },
+        showCancelButton: {
+            type: Boolean,
+            default: true,
+        },
+        showConfirmButton: {
+            type: Boolean,
+            default: true,
+        },
+        confirmText: {
+            type: String,
+            default() {
+                return this.$t('buttonGroup.sure');
+            },
+        },
+        cancelText: {
+            type: String,
+            default() {
+                return this.$t('buttonGroup.cancel');
+            },
+        },
+    },
+    data() {
+        return {};
+    },
+    computed: {
+        show: {
+            get() {
+                return this.visible;
+            },
+            set(val) {
+                this.$emit('update:visible', val);
+            },
+        },
+        bindProps() {
+            return omit(this.$props, ['visible']);
+        },
+    },
+    deactivated() {
+        this.handleClose(); // 在缓存组件时关闭弹窗
+    },
+    methods: {
+        handleSubmit() {
+            this.$emit('confirm');
+        },
+        handleClose() {
+            this.$emit('update:visible', false);
+            this.$emit('close');
+        },
+    },
+};
+</script>

package/components/src/SForm/SSelect/index.vue

@@ -1,108 +1,108 @@
-<template>
-    <div class="saas-select" :class="{ 'saas-search-textbox': from === 'text' }">
-        <span v-if="from === 'text'" class="search-dict">{{ selectValue }}</span>
-        <el-select
-            v-else
-            style="width: 100%"
-            v-model="newValue"
-            :size="size"
-            :multiple="multiple"
-            :placeholder="placeholder"
-            v-bind="$attrs"
-            filterable
-            clearable>
-            <template v-for="item in options">
-                <!-- 如果item有options属性，说明是分组 -->
-                <el-option-group v-if="item.options" :key="item.value" :label="item.label">
-                    <el-option
-                        v-for="option in item.options"
-                        :disabled="option.disabled"
-                        :key="option.value"
-                        :label="option.label"
-                        :value="option.value"></el-option>
-                </el-option-group>
-                <!-- 否则是普通选项 -->
-                <el-option v-else :disabled="item.disabled" :key="item.value" :label="item.label" :value="item.value"></el-option>
-            </template>
-        </el-select>
-    </div>
-</template>
-<script>
-import { isEmpty, omit } from 'chain-lodash';
-import { Select } from 'element-ui';
-export default {
-    name: 'SSelect',
-    props: {
-        ...omit(Select.props, ['value', 'clearable']),
-        value: {
-            type: [String, Number, Array],
-        },
-        clearable: {
-            type: Boolean,
-            default: () => true,
-        },
-        placeholder: {
-            type: String,
-            default() {
-                return this.$t('InputPlaceholder.pleasemsg');;
-            },
-        },
-        from: {
-            type: String,
-            default: 'select',
-        },
-        options: {
-            type: Array,
-            default: () => [],
-        },
-    },
-    data() {
-        return {};
-    },
-    computed: {
-        newValue: {
-            get() {
-                let value = this.multiple ? [] : '';
-                if (this.multiple) {
-                    value = (this.value || []).map(m => (m != null ? String(m) : ''));
-                } else {
-                    if (!isEmpty(this.value) && this.value != null) {
-                        value = String(this.value);
-                    }
-                }
-                return value;
-            },
-            set(val) {
-                this.$emit('input', val);
-            },
-        },
-        selectValue() {
-            const multiple = this.multiple;
-            // 扁平化所有选项，包括分组中的选项
-            const allOptions = this.flattenOptions(this.options || []);
-
-            if (multiple) {
-                const nameArr = allOptions.filter(f => this.newValue.includes(f.value)).map(m => m.label);
-                return nameArr.length > 1 ? `${nameArr[0]} +${nameArr.length - 1}` : nameArr[0];
-            } else {
-                const obj = allOptions.find(f => f.value == this.newValue) || {};
-                return obj.label || '-';
-            }
-        },
-    },
-    methods: {
-        flattenOptions(options) {
-            const result = [];
-            options.forEach(item => {
-                if (item.options) {
-                    result.push(...item.options);
-                } else {
-                    result.push(item);
-                }
-            });
-            return result;
-        },
-    },
-};
-</script>
-<style lang="scss" scoped></style>
+<template>
+    <div class="saas-select" :class="{ 'saas-search-textbox': from === 'text' }">
+        <span v-if="from === 'text'" class="search-dict">{{ selectValue }}</span>
+        <el-select
+            v-else
+            style="width: 100%"
+            v-model="newValue"
+            :size="size"
+            :multiple="multiple"
+            :placeholder="placeholder"
+            v-bind="$attrs"
+            filterable
+            clearable>
+            <template v-for="item in options">
+                <!-- 如果item有options属性，说明是分组 -->
+                <el-option-group v-if="item.options" :key="item.value" :label="item.label">
+                    <el-option
+                        v-for="option in item.options"
+                        :disabled="option.disabled"
+                        :key="option.value"
+                        :label="option.label"
+                        :value="option.value"></el-option>
+                </el-option-group>
+                <!-- 否则是普通选项 -->
+                <el-option v-else :disabled="item.disabled" :key="item.value" :label="item.label" :value="item.value"></el-option>
+            </template>
+        </el-select>
+    </div>
+</template>
+<script>
+import { isEmpty, omit } from 'chain-lodash';
+import { Select } from 'element-ui';
+export default {
+    name: 'SSelect',
+    props: {
+        ...omit(Select.props, ['value', 'clearable']),
+        value: {
+            type: [String, Number, Array],
+        },
+        clearable: {
+            type: Boolean,
+            default: () => true,
+        },
+        placeholder: {
+            type: String,
+            default() {
+                return this.$t('selectGroup.pleaseSelect');;
+            },
+        },
+        from: {
+            type: String,
+            default: 'select',
+        },
+        options: {
+            type: Array,
+            default: () => [],
+        },
+    },
+    data() {
+        return {};
+    },
+    computed: {
+        newValue: {
+            get() {
+                let value = this.multiple ? [] : '';
+                if (this.multiple) {
+                    value = (this.value || []).map(m => (m != null ? String(m) : ''));
+                } else {
+                    if (!isEmpty(this.value) && this.value != null) {
+                        value = String(this.value);
+                    }
+                }
+                return value;
+            },
+            set(val) {
+                this.$emit('input', val);
+            },
+        },
+        selectValue() {
+            const multiple = this.multiple;
+            // 扁平化所有选项，包括分组中的选项
+            const allOptions = this.flattenOptions(this.options || []);
+
+            if (multiple) {
+                const nameArr = allOptions.filter(f => this.newValue.includes(f.value)).map(m => m.label);
+                return nameArr.length > 1 ? `${nameArr[0]} +${nameArr.length - 1}` : nameArr[0];
+            } else {
+                const obj = allOptions.find(f => f.value == this.newValue) || {};
+                return obj.label || '-';
+            }
+        },
+    },
+    methods: {
+        flattenOptions(options) {
+            const result = [];
+            options.forEach(item => {
+                if (item.options) {
+                    result.push(...item.options);
+                } else {
+                    result.push(item);
+                }
+            });
+            return result;
+        },
+    },
+};
+</script>
+<style lang="scss" scoped></style>

package/components/src/SGroup/index.vue

@@ -1,81 +1,81 @@
-<template>
-    <div class="saas-group">
-        <div class="saas-sort-group" v-for="(group, index) in list" :key="index">
-            <div
-                v-for="(item, index) in group.children"
-                :key="index"
-                class="saas-sort-item"
-                :class="{ active: getActive(item, group) }"
-                @click="handleClick(item, group)">
-                <div class="title" :style="getSortStyle(item)">{{ item.formatValue(item, data) }}</div>
-                <div class="text">
-                    <span>
-                        <slot :item="item">
-                            {{ item.label }}
-                            <el-tooltip v-if="item.tip" :content="item.tip">
-                                <div slot="content" v-html="item.tip"></div>
-                                <i style="color: #a1a5b2; margin-left: 4px" class="smart-info-filled"></i>
-                            </el-tooltip>
-                        </slot>
-                    </span>
-                </div>
-                <img src="./icon_rtsuc.png" alt="" srcset="" />
-            </div>
-        </div>
-    </div>
-</template>
-<script>
-import { omit } from 'chain-lodash';
-export default {
-    name: 'SGroup',
-    props: {
-        title: {
-            type: String,
-            default: '',
-        },
-        list: {
-            type: Array,
-            default: () => [],
-        },
-        data: {
-            type: Object,
-            default: () => ({}),
-        },
-        isActive: {
-            type: Function,
-            default: null,
-        },
-    },
-    data() {
-        return {};
-    },
-    computed: {},
-    deactivated() {},
-    methods: {
-        getSortStyle(item) {
-            let obj = {};
-            if (item.type === 'percent') {
-                const num = this.data[item.field];
-                if (num <= 30) {
-                    obj.color = '#FF3B30';
-                } else if (num <= 60) {
-                    obj.color = '#FF9900';
-                } else {
-                    obj.color = '#28B86A';
-                }
-            }
-            return obj;
-        },
-        handleClick(item, group) {
-            this.$emit('tab-click', item, group);
-        },
-        getActive(item, group) {
-            if (this.isActive) {
-                return this.isActive(item, group);
-            }
-            return false;
-        },
-    },
-};
-</script>
-<style lang="scss" scoped></style>
+<template>
+    <div class="saas-group">
+        <div class="saas-sort-group" v-for="(group, index) in list" :key="index">
+            <div
+                v-for="(item, index) in group.children"
+                :key="index"
+                class="saas-sort-item"
+                :class="{ active: getActive(item, group) }"
+                @click="handleClick(item, group)">
+                <div class="title" :style="getSortStyle(item)">{{ item.formatValue(item, data) }}</div>
+                <div class="text">
+                    <span>
+                        <slot :item="item">
+                            {{ item.label }}
+                            <el-tooltip v-if="item.tip" :content="item.tip">
+                                <div slot="content" v-html="item.tip"></div>
+                                <i style="color: #a1a5b2; margin-left: 4px" class="smart-info-filled"></i>
+                            </el-tooltip>
+                        </slot>
+                    </span>
+                </div>
+                <img src="./icon_rtsuc.png" alt="" srcset="" />
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+import { omit } from 'chain-lodash';
+export default {
+    name: 'SGroup',
+    props: {
+        title: {
+            type: String,
+            default: '',
+        },
+        list: {
+            type: Array,
+            default: () => [],
+        },
+        data: {
+            type: Object,
+            default: () => ({}),
+        },
+        isActive: {
+            type: Function,
+            default: null,
+        },
+    },
+    data() {
+        return {};
+    },
+    computed: {},
+    deactivated() {},
+    methods: {
+        getSortStyle(item) {
+            let obj = {};
+            if (item.type === 'percent') {
+                const num = this.data[item.field];
+                if (num <= 30) {
+                    obj.color = '#FF3B30';
+                } else if (num <= 60) {
+                    obj.color = '#FF9900';
+                } else {
+                    obj.color = '#28B86A';
+                }
+            }
+            return obj;
+        },
+        handleClick(item, group) {
+            this.$emit('tab-click', item, group);
+        },
+        getActive(item, group) {
+            if (this.isActive) {
+                return this.isActive(item, group);
+            }
+            return false;
+        },
+    },
+};
+</script>
+<style lang="scss" scoped></style>