refactor: vue3.3 defineOptions

This commit is contained in:
shizhong
2023-09-22 14:00:50 +08:00
parent 20f483f561
commit 7e5ad60d1d
23 changed files with 122 additions and 104 deletions

View File

@ -968,37 +968,37 @@ const submit = () => {
<style scoped>
.sc-cron:deep(.el-tabs__item) {
height: auto;
line-height: 1;
padding: 0 7px;
line-height: 1;
vertical-align: bottom;
}
.sc-cron-num {
text-align: center;
margin-bottom: 15px;
width: 100%;
margin-bottom: 15px;
text-align: center;
}
.sc-cron-num h2 {
font-size: 12px;
margin-bottom: 15px;
font-size: 12px;
font-weight: normal;
}
.sc-cron-num h4 {
display: block;
height: 32px;
line-height: 30px;
width: 100%;
font-size: 12px;
height: 32px;
padding: 0 15px;
font-size: 12px;
line-height: 30px;
background: var(--el-color-primary-light-9);
border-radius: 4px;
}
.sc-cron:deep(.el-tabs__item.is-active) .sc-cron-num h4 {
background: var(--el-color-primary);
color: #fff;
background: var(--el-color-primary);
}
[data-theme='dark'] .sc-cron-num h4 {

View File

@ -2,6 +2,7 @@
import { propTypes } from '@/utils/propTypes'
import { isNumber } from '@/utils/is'
// eslint-disable-next-line vue/no-reserved-component-names
defineOptions({ name: 'Dialog' })
const slots = useSlots()

View File

@ -27,8 +27,8 @@ const getEnable = () => {
</script>
<style scoped>
.el-alert--success.is-light {
border: 1px solid green;
margin-bottom: 10px;
cursor: pointer;
border: 1px solid green;
}
</style>

View File

@ -191,10 +191,10 @@ watch(
.icon-item {
&:hover {
border-color: var(--el-color-primary);
color: var(--el-color-primary);
transition: all 0.4s;
border-color: var(--el-color-primary);
transform: scaleX(1.05);
transition: all 0.4s;
}
}
@ -215,15 +215,15 @@ watch(
}
:deep(.el-tabs__item) {
height: 30px;
font-size: 12px;
font-weight: normal;
height: 30px;
line-height: 30px;
}
:deep(.el-tabs__header),
:deep(.el-tabs__nav-wrap) {
margin: 0;
position: static;
margin: 0;
}
</style>

View File

@ -96,7 +96,7 @@ $prefix-cls: #{$namespace}-input-password;
background-color: transparent;
border-color: var(--el-color-white);
border-style: solid;
border-width: 0 5px 0 5px;
border-width: 0 5px;
content: '';
}

View File

@ -243,7 +243,7 @@ $prefix-cls: #{$namespace}-qrcode;
.#{$prefix-cls} {
&--disabled {
background: rgba(255, 255, 255, 0.95);
background: rgb(255 255 255 / 95%);
& > div {
transform: translate(-50%, -50%);

View File

@ -145,21 +145,25 @@ const listToString = (list: UploadUserFile[], separator?: string) => {
.upload-file-uploader {
margin-bottom: 5px;
}
:deep(.upload-file-list .el-upload-list__item) {
border: 1px solid #e4e7ed;
line-height: 2;
margin-bottom: 10px;
position: relative;
}
:deep(.el-upload-list__item-file-name) {
max-width: 250px;
}
:deep(.upload-file-list .ele-upload-list__item-content) {
display: flex;
justify-content: space-between;
align-items: center;
color: inherit;
}
:deep(.ele-upload-list__item-content-action .el-link) {
margin-right: 10px;
}

View File

@ -81,7 +81,7 @@ const props = defineProps({
fileType: propTypes.array.def(['image/jpeg', 'image/png', 'image/gif']), // 图片类型限制 ==> 非必传(默认为 ["image/jpeg", "image/png", "image/gif"]
height: propTypes.string.def('150px'), // 组件高度 ==> 非必传(默认为 150px
width: propTypes.string.def('150px'), // 组件宽度 ==> 非必传(默认为 150px
borderRadius: propTypes.string.def('8px') // 组件边框圆角 ==> 非必传(默认为 8px
borderradius: propTypes.string.def('8px') // 组件边框圆角 ==> 非必传(默认为 8px
})
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
@ -132,29 +132,34 @@ const uploadError = () => {
:deep(.el-upload),
:deep(.el-upload-dragger) {
border: 1px dashed var(--el-color-danger) !important;
&:hover {
border-color: var(--el-color-primary) !important;
}
}
}
}
:deep(.disabled) {
.el-upload,
.el-upload-dragger {
cursor: not-allowed !important;
background: var(--el-disabled-bg-color);
border: 1px dashed var(--el-border-color-darker) !important;
&:hover {
border: 1px dashed var(--el-border-color-darker) !important;
}
}
}
.upload-box {
.no-border {
:deep(.el-upload) {
border: none !important;
}
}
:deep(.upload) {
.el-upload {
position: relative;
@ -165,14 +170,17 @@ const uploadError = () => {
height: v-bind(height);
overflow: hidden;
border: 1px dashed var(--el-border-color-darker);
border-radius: v-bind(borderRadius);
border-radius: v-bind(borderradius);
transition: var(--el-transition-duration-fast);
&:hover {
border-color: var(--el-color-primary);
.upload-handle {
opacity: 1;
}
}
.el-upload-dragger {
display: flex;
align-items: center;
@ -183,20 +191,24 @@ const uploadError = () => {
overflow: hidden;
background-color: transparent;
border: 1px dashed var(--el-border-color-darker);
border-radius: v-bind(borderRadius);
border-radius: v-bind(borderradius);
&:hover {
border: 1px dashed var(--el-color-primary);
}
}
.el-upload-dragger.is-dragover {
background-color: var(--el-color-primary-light-9);
border: 2px dashed var(--el-color-primary) !important;
}
.upload-image {
width: 100%;
height: 100%;
object-fit: contain;
}
.upload-empty {
position: relative;
display: flex;
@ -206,11 +218,13 @@ const uploadError = () => {
font-size: 12px;
line-height: 30px;
color: var(--el-color-info);
.el-icon {
font-size: 28px;
color: var(--el-text-color-secondary);
}
}
.upload-handle {
position: absolute;
top: 0;
@ -225,6 +239,7 @@ const uploadError = () => {
background: rgb(0 0 0 / 60%);
opacity: 0;
transition: var(--el-transition-duration-fast);
.handle-icon {
display: flex;
flex-direction: column;
@ -232,11 +247,13 @@ const uploadError = () => {
justify-content: center;
padding: 0 6%;
color: aliceblue;
.el-icon {
margin-bottom: 40%;
font-size: 130%;
line-height: 130%;
}
span {
font-size: 85%;
line-height: 85%;
@ -245,6 +262,7 @@ const uploadError = () => {
}
}
}
.el-upload__tip {
line-height: 18px;
text-align: center;

View File

@ -82,7 +82,7 @@ const props = defineProps({
fileType: propTypes.array.def(['image/jpeg', 'image/png', 'image/gif']), // 图片类型限制 ==> 非必传(默认为 ["image/jpeg", "image/png", "image/gif"]
height: propTypes.string.def('150px'), // 组件高度 ==> 非必传(默认为 150px
width: propTypes.string.def('150px'), // 组件宽度 ==> 非必传(默认为 150px
borderRadius: propTypes.string.def('8px') // 组件边框圆角 ==> 非必传(默认为 8px
borderradius: propTypes.string.def('8px') // 组件边框圆角 ==> 非必传(默认为 8px
})
const uploadHeaders = ref({
@ -90,7 +90,7 @@ const uploadHeaders = ref({
'tenant-id': getTenantId()
})
const fileList = ref<UploadUserFile[]>()
const fileList = ref<UploadUserFile[]>([])
// fix: 改为动态监听赋值解决图片回显问题
watch(
() => props.modelValue,
@ -218,7 +218,7 @@ const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
padding: 0;
overflow: hidden;
border: 1px dashed var(--el-border-color-darker);
border-radius: v-bind(borderRadius);
border-radius: v-bind(borderradius);
&:hover {
border: 1px dashed var(--el-color-primary);
@ -235,7 +235,7 @@ const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
width: v-bind(width);
height: v-bind(height);
background-color: transparent;
border-radius: v-bind(borderRadius);
border-radius: v-bind(borderradius);
}
.upload-image {

File diff suppressed because one or more lines are too long

View File

@ -7,8 +7,9 @@
href="https://doc.iocoder.cn/bpm/#_3-%E6%B5%81%E7%A8%8B%E5%9B%BE%E7%A4%BA%E4%BE%8B"
type="danger"
target="_blank"
>如何实现实现会签或签</el-link
>
如何实现实现会签或签
</el-link>
<el-form-item label="流程标识" prop="id">
<el-input
v-model="needProps.id"

View File

@ -6,17 +6,18 @@
<el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />
<el-table-column label="操作" width="110px">
<template #default="scope">
<el-button link @click="openAttributesForm(scope.row, scope.$index)" size="small"
>编辑</el-button
>
<el-button link @click="openAttributesForm(scope.row, scope.$index)" size="small">
编辑
</el-button>
<el-divider direction="vertical" />
<el-button
link
size="small"
style="color: #ff4d4f"
@click="removeAttributes(scope.row, scope.$index)"
>移除</el-button
>
移除
</el-button>
</template>
</el-table-column>
</el-table>

View File

@ -1,7 +1,7 @@
<template>
<div class="panel-tab__content">
<div class="panel-tab__content--title">
<span><Icon icon="ep:menu" style="margin-right: 8px; color: #555555" />消息列表</span>
<span><Icon icon="ep:menu" style="margin-right: 8px; color: #555" />消息列表</span>
<XButton type="primary" title="创建新消息" preIcon="ep:plus" @click="openModel('message')" />
</div>
<el-table :data="messageList" border>
@ -11,9 +11,9 @@
</el-table>
<div
class="panel-tab__content--title"
style="padding-top: 8px; margin-top: 8px; border-top: 1px solid #eeeeee"
style="padding-top: 8px; margin-top: 8px; border-top: 1px solid #eee"
>
<span><Icon icon="ep:menu" style="margin-right: 8px; color: #555555" />信号列表</span>
<span><Icon icon="ep:menu" style="margin-right: 8px; color: #555" />信号列表</span>
<XButton type="primary" title="创建新信号" preIcon="ep:plus" @click="openModel('signal')" />
</div>
<el-table :data="signalList" border>