stellar-ui-plus 1.20.21 → 1.20.23

package/components/ste-cub-box/README.md

@@ -1,350 +0,0 @@
-# UserInfo 用户信息
-
-提供用户信息展示。
-
----$
-
-## 代码演示
-
-### 基本使用
-
-- 通过 `avatar`设置头像，默认为``
-- 通过 `nickname`设置昵称，默认为``
-- 通过 `desc`插槽设置用户描述，默认为``
-- 通过 `list`设置数据列表（最多三个），默认为`[]`
-- 通过 `codeSrc`设置功能码图片，默认为``
-- 通过 `codeTitle`设置功能码标题，默认为``
-- 通过 `codeTitleColor`设置功能码标题颜色，默认为`主题色`
-
-```html
-<script lang="ts" setup>
-    import { ref } from 'vue';
-    let list1 = ref([
-        { title: '余额', value: '100' },
-        { title: '订餐数', value: '8' },
-    ]);
-
-    let list2 = ref([
-        { title: '数据1', value: '100' },
-        { title: '数据2', value: '8' },
-        { title: '数据3', value: '8' },
-    ]);
-    let list3 = ref([{ title: '数据1', value: '100' }]);
-</script>
-<template>
-    <view class="item-block">
-        <view>
-            <ste-user-info
-                avatar="https://image.whzb.com/chain/StellarUI/图片.jpg"
-                nickname="张三"
-                :list="list1"
-                codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png"
-                codeTitle="核销码"
-                codeTitleColor="#EC3E1A"
-            >
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info
-                avatar="https://image.whzb.com/chain/StellarUI/图片.jpg"
-                nickname="张三"
-                :list="[]"
-                codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png"
-                codeTitle="核销码"
-                codeTitleColor="#EC3E1A"
-            >
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info
-                avatar="https://image.whzb.com/chain/StellarUI/图片.jpg"
-                nickname="张三"
-                :list="list3"
-                codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png"
-                codeTitle="核销码"
-                codeTitleColor="#EC3E1A"
-            >
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info
-                avatar="https://image.whzb.com/chain/StellarUI/图片.jpg"
-                nickname="张三"
-                :list="list2"
-                codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png"
-                codeTitle="核销码"
-                codeTitleColor="#EC3E1A"
-            >
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-</template>
-<style>
-    .item-block {
-        > view {
-            margin: 0 36rpx 36rpx 0;
-        }
-    }
-    .desc {
-        display: flex;
-        align-items: center;
-        .title {
-            font-size: 24rpx;
-            color: #ec3e1a;
-            margin: 4rpx;
-            margin-right: 14rpx;
-        }
-    }
-</style>
-```
-
-### 用户信息隐藏
-
-- 通过 `showUserInfo`设置是否展示用户相关，默认为`true`
-
-```html
-<script lang="ts" setup>
-    import { ref } from 'vue';
-    let list1 = ref([
-        { title: '余额', value: '100' },
-        { title: '订餐数', value: '8' },
-    ]);
-
-    let list2 = ref([
-        { title: '数据1', value: '100' },
-        { title: '数据2', value: '8' },
-        { title: '数据3', value: '8' },
-    ]);
-    let list3 = ref([{ title: '数据1', value: '100' }]);
-</script>
-<template>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showUserInfo="false" :list="list1" codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png" codeTitle="核销码" codeTitleColor="#EC3E1A"></ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showUserInfo="false" :list="[]" codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png" codeTitle="核销码" codeTitleColor="#EC3E1A"></ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showUserInfo="false" :list="list3" codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png" codeTitle="核销码" codeTitleColor="#EC3E1A"></ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showUserInfo="false" :list="list2" codeSrc="https://image.whzb.com/chain/StellarUI/image/code1.png" codeTitle="核销码" codeTitleColor="#EC3E1A"></ste-user-info>
-        </view>
-    </view>
-</template>
-<style>
-    .item-block {
-        > view {
-            margin: 0 36rpx 36rpx 0;
-        }
-    }
-    .desc {
-        display: flex;
-        align-items: center;
-        .title {
-            font-size: 24rpx;
-            color: #ec3e1a;
-            margin: 4rpx;
-            margin-right: 14rpx;
-        }
-    }
-</style>
-```
-
-### 核销码隐藏
-
-- 通过 `showCode`设置核销码隐藏，默认为`true`
-
-```html
-<script lang="ts" setup>
-    import { ref } from 'vue';
-    let list1 = ref([
-        { title: '余额', value: '100' },
-        { title: '订餐数', value: '8' },
-    ]);
-
-    let list2 = ref([
-        { title: '数据1', value: '100' },
-        { title: '数据2', value: '8' },
-        { title: '数据3', value: '8' },
-    ]);
-    let list3 = ref([{ title: '数据1', value: '100' }]);
-</script>
-<template>
-    <view class="item-block">
-        <view>
-            <ste-user-info avatar="https://image.whzb.com/chain/StellarUI/图片.jpg" nickname="张三" :list="list1" :showCode="false">
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info avatar="https://image.whzb.com/chain/StellarUI/图片.jpg" nickname="张三" :list="[]" :showCode="false">
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info avatar="https://image.whzb.com/chain/StellarUI/图片.jpg" nickname="张三" :list="list3" :showCode="false">
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info avatar="https://image.whzb.com/chain/StellarUI/图片.jpg" nickname="张三" :list="list2" :showCode="false">
-                <template v-slot:desc>
-                    <view class="desc">
-                        <ste-icon code="&#xe670;" color="#EC3E1A" size="26"></ste-icon>
-                        <view class="title">中百食堂</view>
-                    </view>
-                </template>
-            </ste-user-info>
-        </view>
-    </view>
-</template>
-<style>
-    .item-block {
-        > view {
-            margin: 0 36rpx 36rpx 0;
-        }
-    }
-    .desc {
-        display: flex;
-        align-items: center;
-        .title {
-            font-size: 24rpx;
-            color: #ec3e1a;
-            margin: 4rpx;
-            margin-right: 14rpx;
-        }
-    }
-</style>
-```
-
-### 用户信息和核销码隐藏
-
-```html
-<script lang="ts" setup>
-    import { ref } from 'vue';
-    let list1 = ref([
-        { title: '余额', value: '100' },
-        { title: '订餐数', value: '8' },
-    ]);
-
-    let list2 = ref([
-        { title: '数据1', value: '100' },
-        { title: '数据2', value: '8' },
-        { title: '数据3', value: '8' },
-    ]);
-    let list3 = ref([{ title: '数据1', value: '100' }]);
-</script>
-<template>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showCode="false" :showUserInfo="false" :list="list1"></ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showCode="false" :showUserInfo="false" :list="[]"></ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showCode="false" :showUserInfo="false" :list="list3"></ste-user-info>
-        </view>
-    </view>
-    <view class="item-block">
-        <view>
-            <ste-user-info :showCode="false" :showUserInfo="false" :list="list2"></ste-user-info>
-        </view>
-    </view>
-</template>
-<style>
-    .item-block {
-        > view {
-            margin: 0 36rpx 36rpx 0;
-        }
-    }
-    .desc {
-        display: flex;
-        align-items: center;
-        .title {
-            font-size: 24rpx;
-            color: #ec3e1a;
-            margin: 4rpx;
-            margin-right: 14rpx;
-        }
-    }
-</style>
-```
-
----$
-
-### API
-
-<!-- props -->
-
-#### Slots
-
-| 插槽名 | 说明     | 插槽参数 | 支持版本 |
-| ------ | -------- | -------- | -------- |
-| `desc` | 用户描述 | -        | -        |
-
----$
-{{qinpengfei}}

package/components/ste-cub-box/config.json

@@ -1,5 +0,0 @@
-{
-    "group": "业务组件",
-    "title": "UserInfo 用户信息",
-    "icon": "https://image.whzb.com/chain/StellarUI/组件图标/人员信息.png"
-}

package/components/ste-cub-box/props.ts

@@ -1,10 +0,0 @@
-export default {
-    avatar: { type: String, default: '' },
-    nickname: { type: String, default: '' },
-    showUserInfo: { type: Boolean, default: true },
-    list: { type: Array, default: () => [] },
-    codeSrc: { type: String, default: '' },
-    codeTitle: { type: String, default: '' },
-    codeTitleColor: { type: String, default: '' },
-    showCode: { type: Boolean, default: true },
-};

package/components/ste-cub-box/ste-cub-box.vue

@@ -1,244 +0,0 @@
-<template>
-    <!-- 魔方组件 -->
-    <div class="page">
-        <div
-            class="cap-cube"
-            :class="{ 'c-box-angle-2': imageAngle == 2 }"
-            :style="{
-                width: capCubeStyle.width,
-                marginLeft: capCubeStyle.marginLeft,
-                marginBottom: capCubeStyle.marginBottom,
-                gridRowGap: capCubeStyle.gridRowGap,
-                gridColumnGap: capCubeStyle.gridColumnGap,
-                gridTemplateRows: capCubeStyle.gridTemplateRows,
-                gridTemplateColumns: capCubeStyle.gridTemplateColumns,
-            }"
-        >
-            <div
-                class="cap-cube__item"
-                v-for="(item, index) in showCubeListWrap"
-                :key="index"
-                :style="{
-                    gridColumnStart: item.columnStart,
-                    gridColumnEnd: item.columnEnd,
-                    gridRowStart: item.rowStart,
-                    gridRowEnd: item.rowEnd,
-                }"
-                @click="handleTap(index)"
-            >
-                <ste-image
-                    :mode="radioTC == 1 ? 'aspectFill' : radioTC == 2 ? 'aspectFit' : 'scaleToFill'"
-                    :class="{ 'c-box-angle-2': imageAngle == 2 }"
-                    class="cap-cube__table-image cap-cube__table-image--invisible"
-                    :src="item.img"
-                    v-if="item.img"
-                />
-            </div>
-        </div>
-    </div>
-</template>
-<script>
-import utils from '@/common/utils';
-import useRouter from '@/common/useRouter.js';
-let router = useRouter();
-
-/**以0.5为单位进行四舍五入*/
-const toFixed = num => {
-    if (!num) return 0;
-    const n = Math.floor(num);
-    const f = num % 1;
-    if (f < 0.26) return n;
-    if (f < 0.76) return n + 0.5;
-    return n + 1;
-};
-
-export default {
-    props: {
-        decoration: {},
-    },
-    data() {
-        return {
-            borderWidth: 0,
-            layoutWidth: 0,
-            layoutHeight: 0,
-            showMethod: 0,
-            pageMargin: 0,
-            marginBottom: 0,
-            width: 0,
-            subEntry: [],
-            showCubeListWrap: [],
-            imageAngle: 1, //单选：1.直角 2.圆角
-            radioTC: 1, //单选：1填充 2留白
-            pageMarginStyle: {
-                width: 0,
-                row: 1, // 行数
-                column: 1, // 列数
-                itemWidth: 0,
-                itemHeight: 0,
-                widthDiff: 0, // 差值
-            },
-            // businessType: 0,
-        };
-    },
-    computed: {
-        capCubeStyle() {
-            const { width, row, column, itemWidth, itemHeight, widthDiff } = this.pageMarginStyle;
-
-            let gridTemplateRows = '',
-                gridTemplateColumns = '';
-            for (let i = 0; i < row; i++) {
-                gridTemplateRows += `${itemHeight}px `;
-            }
-            for (let i = 0; i < column; i++) {
-                let w = itemWidth;
-                // 如果差值不是0，则将差值分配到第一列和最后一列（最多七列，每列差值上限0.25，总差值不会超过1.75）
-                if (widthDiff) {
-                    if (i === 0) {
-                        // 将小数位分配给第一列
-                        w += widthDiff % 1;
-                    } else if (i === column - 1) {
-                        // 整数位分配给最后一列(因为可能有负数，不能使用Math.floor函数向下取证)
-                        w += parseInt(widthDiff);
-                    }
-                }
-                gridTemplateColumns += `${w}px `;
-            }
-
-            return {
-                width: `${width}px`,
-                marginLeft: `${this.pageMargin}px`,
-                marginBottom: `${this.marginBottom}px`,
-                gridRowGap: `${this.borderWidth}px`,
-                gridColumnGap: `${this.borderWidth}px`,
-                gridTemplateRows,
-                gridTemplateColumns,
-            };
-        },
-    },
-    created() {
-        // 因为做的是定位，使用rpx会失真，直接使用PX绝对值
-        let formdata = utils.deepClone(this.decoration);
-        this.getProperties(formdata);
-        this.drawCubeWrap();
-    },
-    // 组件周期函数--监听组件挂载完毕
-    mounted() {},
-    methods: {
-        getProperties(formdata) {
-            this.borderWidth = formdata.borderWidth;
-            this.layoutWidth = formdata.layoutWidth;
-            this.layoutHeight = formdata.layoutHeight;
-            this.showMethod = formdata.showMethod;
-            this.pageMargin = formdata.pageMargin;
-            this.marginBottom = formdata.marginBottom;
-            this.width = formdata.width;
-            this.subEntry = formdata.subEntry;
-            this.showCubeListWrap = formdata.showCubeListWrap;
-            this.pageMarginStyle = formdata.pageMarginStyle;
-            this.imageAngle = formdata.imageAngle;
-            this.radioTC = formdata.radioTC;
-            // this.businessType = formdata.businessType;
-        },
-        /**
-         * 动态计算图片规格
-         */
-        drawCubeWrap() {
-            const perviewLayoutWidth = utils.getWindowInfo().windowWidth;
-            const layoutWidth = this.layoutWidth;
-            const layoutHeight = this.layoutHeight;
-            // 应该展示的内容区域总宽度
-            const wrapWith = perviewLayoutWidth - this.pageMargin * 2;
-            // 单个块的宽度
-            const itemWidth = toFixed((wrapWith - this.borderWidth * (layoutWidth - 1)) / layoutWidth);
-            // 重新计算盒子实际总宽度
-            const _wrapWith = (itemWidth + this.borderWidth) * layoutWidth - this.borderWidth;
-            // 计算实际宽度和应该展示宽度之间的差值，求绝对值
-            const widthDiff = wrapWith - _wrapWith;
-            // 单个块的高度
-            const itemHeight = layoutHeight === 1 ? itemWidth : toFixed((perviewLayoutWidth - this.borderWidth * (layoutWidth - 1)) / layoutHeight);
-
-            const subEntry = this.subEntry;
-            const showCubeListWrap = [];
-            let maxHeight = 0,
-                row = 1;
-            if (subEntry.length) {
-                for (let i = 0; i < subEntry.length; i++) {
-                    const a = subEntry[i];
-                    const coverDiv = {
-                        columnStart: a.x + 1,
-                        columnEnd: a.x + a.width + 1,
-                        rowStart: a.y + 1,
-                        rowEnd: a.y + a.height + 1,
-                        img: a[`img`] ? a[`img`] : '',
-                    };
-                    if (maxHeight < coverDiv.top + coverDiv.height) {
-                        maxHeight = coverDiv.top + coverDiv.height;
-                    }
-                    if (row < a.y + a.height) {
-                        row = a.y + a.height;
-                    }
-                    showCubeListWrap.push(coverDiv);
-                }
-                this.showCubeListWrap = showCubeListWrap;
-                this.pageMarginStyle = {
-                    width: wrapWith,
-                    column: this.layoutWidth, // 列数
-                    row, // 行数
-                    itemWidth,
-                    itemHeight,
-                    widthDiff, // 差值
-                };
-            }
-        },
-        /**
-         * 跳转
-         */
-        handleTap(index) {
-            const currentSwiperItem = this.subEntry[index];
-            const itemLink = currentSwiperItem.link;
-            router.navtofun(itemLink);
-        },
-    },
-};
-</script>
-
-<style lang="scss" scoped>
-/*预览*/
-.rc-design-vue-preview {
-    .cap-cube-wrap {
-        width: 100%;
-        overflow: hidden;
-    }
-}
-
-.cap-cube {
-    position: relative;
-    display: grid;
-    overflow: hidden;
-}
-
-.cap-cube__item {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-repeat: no-repeat;
-    background-position: 50%;
-    background-size: 100% 100%;
-    overflow: hidden;
-}
-
-.cap-cube__table-image--invisible {
-    width: 100%;
-    height: 100%;
-}
-
-.iconshangpinxiangqing-baozhuang-2 {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    font-size: 40px;
-    z-index: 999;
-    color: #fff;
-    transform: translate(-50%, -50%);
-}
-</style>

package/components/ste-cub-box/ste-user-info.easycom.json

@@ -1,71 +0,0 @@
-{
-    "name": "ste-user-info",
-    "description": "提供用户信息展示。",
-    "example": "<ste-user-info></ste-user-info>",
-    "tutorial": "https://stellar-ui.intecloud.com.cn/plus/#/?active=user-info",
-    "attributes": [
-        {
-            "name": "avatar",
-            "description": "头像",
-            "type": "String",
-            "default": ""
-        },
-        {
-            "name": "nickname",
-            "description": "昵称",
-            "type": "String",
-            "default": ""
-        },
-        {
-            "name": "showUserInfo",
-            "description": "是否展示用户相关",
-            "type": "Boolean",
-            "default": true
-        },
-        {
-            "name": "list",
-            "description": "数据列表（最多三个）",
-            "type": "Array",
-            "default": []
-        },
-        {
-            "name": "codeSrc",
-            "description": "功能码图片",
-            "type": "String",
-            "default": ""
-        },
-        {
-            "name": "codeTitle",
-            "description": "功能码标题",
-            "type": "String",
-            "default": ""
-        },
-        {
-            "name": "codeTitleColor",
-            "description": "功能码标题颜色",
-            "type": "String",
-            "default": "主题色"
-        },
-        {
-            "name": "showCode",
-            "description": "是否展示功能码相关",
-            "type": "Boolean",
-            "default": true
-        },
-        {
-            "name": "[event]userClick",
-            "description": "用户区域点击",
-            "type": "() => void"
-        },
-        {
-            "name": "[event]dataClick",
-            "description": "数据点击",
-            "type": "(index : string | number) => void"
-        },
-        {
-            "name": "[event]codeClick",
-            "description": "功能码区域点击",
-            "type": "() => void"
-        }
-    ]
-}