让企业管理更智慧、更快捷

Skip to content
源代码提交（3）
隐藏空白变更内容
行内 左右并排
package-lock.json
浏览文件 @ 6c31f4d6
{
"name": "@package/lwc-ui-components",
"version": "1.0.2",
"version": "1.0.3",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "@package/lwc-ui-components",
"version": "1.0.2",
"version": "1.0.3",
"license": "UNLICENSED",
"dependencies": {
"@mdx-js/vue-loader": "^1.6.22",
package.json
浏览文件 @ 6c31f4d6
{
"name": "@package/lwc-ui-components",
"version": "1.0.2",
"version": "1.0.3",
"private": false,
"description": "立威云UI组件库",
"author": "",
......
src/composables/use-default-data.js
浏览文件 @ 6c31f4d6
import defaultAvatar from "../assets/images/default-avatar.png";
import defaultImage from "../assets/images/default-image.png";
// import defaultAvatar from "../assets/images/default-avatar.png";
// import defaultImage from "../assets/images/default-image.png";
export default function useDefaultData() {
const OSS_LWC_IMAGE_BASE_PATH = "https://lwc-images.oss-cn-chengdu.aliyuncs.com";
return {
defaultAvatar: defaultAvatar,
defaultImage: defaultImage,
defaultImage: `${OSS_LWC_IMAGE_BASE_PATH}/common/default-image.png`,
defaultAvatar: `${OSS_LWC_IMAGE_BASE_PATH}/common/default-avatar.png`,
defaultProgressColors: [
{ color: "#909399", percentage: 25 },
{ color: "#F56C6C", percentage: 50 },
......@@ -12,7 +14,7 @@ export default function useDefaultData() {
{ color: "#67C23A", percentage: 100 },
],
defaultEventType: {
redirect_url: "redirect_url"
}
redirect_url: "redirect_url",
},
};
}
src/stories/card/cashier/Index.vue
浏览文件 @ 6c31f4d6
......@@ -10,7 +10,12 @@
<!-- 头像 -->
<el-row class="py-1">
<el-col :span="24" class="text-center">
<el-avatar :size="70" :src="image || defaultAvatar"></el-avatar>
<!-- <el-avatar :size="70" :src="image || defaultAvatar"></el-avatar> -->
<el-image
style="width: 70px; height: 70px; border-radius: 50%;"
:lazy="lazy"
:src="image || defaultAvatar"
></el-image>
</el-col>
</el-row>
<!-- 信息行 -->
......@@ -67,7 +72,7 @@ import LwcDataDisplayBadgeText from '../../data-display/badge-text';
export default {
components: { LwcDataDisplayBadgeText },
name: "lwc-card-cashier",
setup(props, context) {
data() {
const { defaultAvatar } = useDefaultData();
return { defaultAvatar }
......@@ -108,6 +113,10 @@ export default {
statusConfig: {
type: Object,
default: () => {}
},
lazy: {
type: Boolean,
default: true
}
},
......
src/stories/card/contact/Index.vue
浏览文件 @ 6c31f4d6
......@@ -9,10 +9,15 @@
<el-row class="px-2" @click.native="onClick(user)">
<el-row :gutter="32" class="text-center py-1">
<el-col :span="24">
<el-avatar :size="70" :src="user.image || defaultAvatar"></el-avatar>
<!-- <el-avatar :size="70" :src="user.image || defaultAvatar"></el-avatar> -->
<el-image
style="width: 70px; height: 70px; border-radius: 50%;"
:lazy="lazy"
:src="user.image || defaultAvatar"
></el-image>
</el-col>
<el-col :span="24" class="truncate mt-2 text-color-primary flex justify-center items-center">
{{ user.name || "No Name" }}
{{ user.name || "未命名" }}
<el-divider direction="vertical"></el-divider>
<lwc-data-display-badge-text v-bind="badgeStatus"/>
</el-col>
......@@ -21,11 +26,15 @@
<el-divider class="my-2"></el-divider>
</el-col>
<el-col class="p-1 text-color-secondary text-left text-base">
<el-row class="mb-1 truncate">
<el-row class="mb-1 truncate" v-show="user.code">
<i class="el-icon-postcard"></i>
<span class="ml-2">{{ user.code || '未设置' }}</span>
</el-row>
<el-row class="mb-1 truncate" v-show="user.email">
<i class="el-icon-message"></i>
<span class="ml-2">{{ user.email || '未设置' }}</span>
</el-row>
<el-row class="mb-1 truncate">
<el-row class="mb-1 truncate" v-show="user.mobile">
<i class="el-icon-phone-outline"></i>
<span class="ml-2">{{ user.mobile || '未设置' }}</span>
</el-row>
......@@ -48,9 +57,11 @@ import LwcDataDisplayBadgeText from '../../data-display/badge-text';
export default {
name: 'lwc-card-contact',
components: { LwcDataDisplayBadgeText },
setup() {
data() {
const { defaultAvatar } = useDefaultData();
return { defaultAvatar }
return {
defaultAvatar
}
},
props: {
user: {
......@@ -62,6 +73,16 @@ export default {
default() {
return []
}
},
options: {
type: Array,
default() {
return []
}
},
lazy: {
type: Boolean,
default: true
}
},
methods: {
......@@ -81,16 +102,8 @@ export default {
}
return {
...def,
value: this.user.isCompany,
options: [{
label: '公司',
value: true,
type: 'primary'
}, {
label: '个人',
value: false,
type: 'warning'
}]
value: this.user.type,
options: this.options
}
}
}
......
src/stories/card/contact/index.stories.js
浏览文件 @ 6c31f4d6
......@@ -21,17 +21,28 @@ const Template = (args, { argTypes }) => ({
template: '<lwc-card-contact @onClick="onClick" @onDelete="onDelete" v-bind="$props" />',
});
const mockOptions = [{
label: '公司',
value: true,
type: 'primary'
}, {
label: '个人',
value: false,
type: 'warning'
}]
export const Default = Template.bind({});
Default.args = {
user: {
id: 1,
name: '唐良成',
isCompany: false,
type: false,
image: "http://git.leadwaycloud.com/uploads/-/system/user/avatar/4/avatar.png",
mobile: '13028158007',
email: 'tangliangcheng@leadwaycloud.comtangliangcheng@leadwaycloud.com',
},
actions: ['delete']
actions: ['delete'],
options: mockOptions
};
export const EmptyEmail = Template.bind({});
......@@ -39,11 +50,12 @@ EmptyEmail.args = {
user: {
id: 1,
name: '唐良成',
isCompany: false,
type: true,
image: "http://git.leadwaycloud.com/uploads/-/system/user/avatar/4/avatar.png",
mobile: '13028158007',
email: '',
}
},
options: mockOptions
};
export const EmptyMobile = Template.bind({});
......@@ -51,11 +63,13 @@ EmptyMobile.args = {
user: {
id: 1,
name: '唐良成',
isCompany: false,
type: false,
image: "http://git.leadwaycloud.com/uploads/-/system/user/avatar/4/avatar.png",
mobile: '',
email: 'tangliangcheng@leadwaycloud.com',
}
code: "123123332211"
},
options: mockOptions
};
export const EmptyImage = Template.bind({});
......@@ -63,9 +77,32 @@ EmptyImage.args = {
user: {
id: 1,
name: '唐良成',
isCompany: false,
image: "",
mobile: '13028158007',
email: 'tangliangcheng@leadwaycloud.com',
}
type: false
},
options: mockOptions
};
export const CustomOptions = Template.bind({});
CustomOptions.storyName = "自定义 Options"
CustomOptions.args = {
user: {
id: 1,
name: '唐良成',
image: "",
mobile: '13028158007',
email: 'tangliangcheng@leadwaycloud.com',
type: 1
},
options: [{
label: '普通会员',
value: 1,
type: 'info'
}, {
label: '超级会员',
value: 2,
type: 'danger'
}]
};
src/stories/card/employee/Index.vue
浏览文件 @ 6c31f4d6
......@@ -8,10 +8,15 @@
<el-row class="px-2" @click.native="onClick(user)">
<el-row :gutter="32" class="text-center py-1 text-color-primary">
<el-col :span="24">
<el-avatar :size="70" :src="user.image || defaultAvatar"></el-avatar>
<!-- <el-avatar :size="70" :src="user.image || defaultAvatar"></el-avatar> -->
<el-image
style="width: 70px; height: 70px; border-radius: 50%;"
:lazy="lazy"
:src="user.image || defaultAvatar"
></el-image>
</el-col>
<el-col :span="24" class="truncate mt-2">
{{ user.name || "No Name" }}
{{ user.name || "未命名" }}
<el-divider direction="vertical"></el-divider>
{{ user.title || "无职位" }}
</el-col>
......@@ -36,7 +41,7 @@
import { useDefaultData } from "../../../composables";
export default {
name: 'lwc-card-employee',
setup() {
data() {
const { defaultAvatar } = useDefaultData();
return { defaultAvatar }
},
......@@ -44,6 +49,10 @@ export default {
user: {
type: Object,
default() { return {} }
},
lazy: {
type: Boolean,
default: true
}
},
methods: {
......
src/stories/card/goods/Index.vue
浏览文件 @ 6c31f4d6
......@@ -7,28 +7,34 @@
>
<el-row class="flex flex-row overflow-hidden" @click.native="onClick(value)">
<el-row class="mr-4">
<!-- <el-avatar :size="64" :src="value.image || defaultImage"></el-avatar> -->
<el-image
style="width: 64px; height: 64px;"
:lazy="lazy"
:src="value.image || defaultImage"
></el-image>
</el-row>
<el-row class="flex flex-col justify-center">
<el-col :span="24" class="text-base mb-1 flex justify-between items-center">
<span class="truncate inline-block text-color-primary">
{{ value.name || '暂无名称' }}
{{ value.name || '未命名' }}
</span>
</el-col>
<el-col :span="24" class="flex justify-between items-center">
<el-col :span="20" class="text-color-secondary text-sm">
<el-col class="truncate">
<el-col class="truncate" v-show="value.category">
分类
<span class="over-ellipsis">{{
value.category || '暂无'
}}</span>
</el-col>
<el-col class="truncate" v-show="value.code">
货号
<span class="over-ellipsis">{{
value.code || '暂无'
}}</span>
</el-col>
<el-col>
价格
<el-col v-show="value.price">
单价
<lwc-currency-money
:value="value.price"
></lwc-currency-money>
......@@ -44,14 +50,20 @@ import LwcCurrencyMoney from "../../currency/money/Index.vue";
import { useDefaultData } from "../../../composables";
export default {
name: 'lwc-card-goods',
setup() {
data() {
const { defaultImage } = useDefaultData();
return { defaultImage }
return {
defaultImage
}
},
props: {
value: {
type: Object,
default() { return {} }
},
lazy: {
type: Boolean,
default: false
}
},
components: {
......
src/stories/card/goods/index.stories.js
浏览文件 @ 6c31f4d6
......@@ -46,8 +46,9 @@ export const EmptyImage = Template.bind({});
EmptyImage.args = {
value: {
name: "七喜碳酸饮料",
image: "",
image: null,
code: "100101",
price: 99.50
},
category: "饮料",
// price: 99.50
}
};
src/stories/select/extend/src/index.js
浏览文件 @ 6c31f4d6
......@@ -234,7 +234,7 @@ export default {
* @param {*} config 配置
*/
handleFooterItemClick(config, item) {
const { type, itemRender, props } = config;
const { type, itemRender, props, attrs } = config;
const selectRef = this.$refs[this.refName];
switch(type) {
case 'dialog':
......@@ -245,6 +245,9 @@ export default {
name: item.name || '快速创建',
width: '80%',
...props
},
attrs: {
...attrs
}
}
if (selectRef && selectRef.blur ) selectRef.blur();
......
storybook-static/iframe.html
浏览文件 @ 6c31f4d6
......@@ -347,4 +347,4 @@
window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/*.stories.mdx","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.mdx)$"},{"titlePrefix":"","directory":"./src","files":"**/*.stories.@(js|jsx|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.(js|jsx|ts|tsx))$"}];</script><script src="runtime~main.0d59c2a8.iframe.bundle.js"></script><script src="624.58372a83.iframe.bundle.js"></script><script src="main.10b99304.iframe.bundle.js"></script></body></html>
\ No newline at end of file
window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/*.stories.mdx","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.mdx)$"},{"titlePrefix":"","directory":"./src","files":"**/*.stories.@(js|jsx|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.(js|jsx|ts|tsx))$"}];</script><script src="runtime~main.0d59c2a8.iframe.bundle.js"></script><script src="624.58372a83.iframe.bundle.js"></script><script src="main.4a37d3dd.iframe.bundle.js"></script></body></html>
\ No newline at end of file

致力于帮助企业简化企业管理与运营管理