update 修改组件 去除无用引用和代码缩进
This commit is contained in:
parent
9f038ad181
commit
d43ae50abc
@ -1,8 +1,6 @@
|
|||||||
<!-- 代码构建 -->
|
<!-- 代码构建 -->
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
|
||||||
import { ComponentInternalInstance } from "vue";
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
showBtn: {
|
showBtn: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
|
@ -24,7 +24,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { PropType } from 'vue';
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
@ -36,10 +36,7 @@ const props = defineProps({
|
|||||||
// 当前的值
|
// 当前的值
|
||||||
value: [Number, String, Array] as PropType<number | string | Array<number | string>>,
|
value: [Number, String, Array] as PropType<number | string | Array<number | string>>,
|
||||||
// 当未找到匹配的数据时,显示value
|
// 当未找到匹配的数据时,显示value
|
||||||
showValue: {
|
showValue: propTypes.bool.def(true),
|
||||||
type: Boolean as PropType<boolean>,
|
|
||||||
default: true,
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const values = computed(() => {
|
const values = computed(() => {
|
||||||
|
@ -30,38 +30,21 @@
|
|||||||
import { QuillEditor, Quill } from '@vueup/vue-quill';
|
import { QuillEditor, Quill } from '@vueup/vue-quill';
|
||||||
import '@vueup/vue-quill/dist/vue-quill.snow.css';
|
import '@vueup/vue-quill/dist/vue-quill.snow.css';
|
||||||
import { getToken } from "@/utils/auth";
|
import { getToken } from "@/utils/auth";
|
||||||
import { ComponentInternalInstance } from "vue";
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
/* 编辑器的内容 */
|
/* 编辑器的内容 */
|
||||||
modelValue: {
|
modelValue: propTypes.string,
|
||||||
type: String,
|
|
||||||
},
|
|
||||||
/* 高度 */
|
/* 高度 */
|
||||||
height: {
|
height: propTypes.number.def(400),
|
||||||
type: Number,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
/* 最小高度 */
|
/* 最小高度 */
|
||||||
minHeight: {
|
minHeight: propTypes.number.def(400),
|
||||||
type: Number,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
/* 只读 */
|
/* 只读 */
|
||||||
readOnly: {
|
readOnly: propTypes.bool.def(false),
|
||||||
type: Boolean,
|
|
||||||
default: false,
|
|
||||||
},
|
|
||||||
/* 上传文件大小限制(MB) */
|
/* 上传文件大小限制(MB) */
|
||||||
fileSize: {
|
fileSize: propTypes.number.def(5),
|
||||||
type: Number,
|
|
||||||
default: 5,
|
|
||||||
},
|
|
||||||
/* 类型(base64格式、url格式) */
|
/* 类型(base64格式、url格式) */
|
||||||
type: {
|
type: propTypes.string.def('url')
|
||||||
type: String,
|
|
||||||
default: "url",
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
@ -166,16 +149,20 @@ const handleUploadError = (err: any) => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.editor, .ql-toolbar {
|
.editor,
|
||||||
|
.ql-toolbar {
|
||||||
white-space: pre-wrap !important;
|
white-space: pre-wrap !important;
|
||||||
line-height: normal !important;
|
line-height: normal !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.quill-img {
|
.quill-img {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-tooltip[data-mode="link"]::before {
|
.ql-snow .ql-tooltip[data-mode="link"]::before {
|
||||||
content: "请输入链接地址:";
|
content: "请输入链接地址:";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
|
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
content: "保存";
|
content: "保存";
|
||||||
@ -190,14 +177,17 @@ const handleUploadError = (err: any) => {
|
|||||||
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
|
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
|
||||||
content: "14px";
|
content: "14px";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
|
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
|
||||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
|
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
|
||||||
content: "10px";
|
content: "10px";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
|
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
|
||||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
|
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
|
||||||
content: "18px";
|
content: "18px";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
|
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
|
||||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
|
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
|
||||||
content: "32px";
|
content: "32px";
|
||||||
@ -207,26 +197,32 @@ const handleUploadError = (err: any) => {
|
|||||||
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
|
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
|
||||||
content: "文本";
|
content: "文本";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
|
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
|
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
|
||||||
content: "标题1";
|
content: "标题1";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
|
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
|
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
|
||||||
content: "标题2";
|
content: "标题2";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
|
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
|
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
|
||||||
content: "标题3";
|
content: "标题3";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
|
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
|
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
|
||||||
content: "标题4";
|
content: "标题4";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
|
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
|
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
|
||||||
content: "标题5";
|
content: "标题5";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
|
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
|
||||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
|
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
|
||||||
content: "标题6";
|
content: "标题6";
|
||||||
@ -236,10 +232,12 @@ const handleUploadError = (err: any) => {
|
|||||||
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
|
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
|
||||||
content: "标准字体";
|
content: "标准字体";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
|
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
|
||||||
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
|
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
|
||||||
content: "衬线字体";
|
content: "衬线字体";
|
||||||
}
|
}
|
||||||
|
|
||||||
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
|
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
|
||||||
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
|
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
|
||||||
content: "等宽字体";
|
content: "等宽字体";
|
||||||
|
@ -45,31 +45,18 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { getToken } from "@/utils/auth";
|
import { getToken } from "@/utils/auth";
|
||||||
import { listByIds, delOss } from "@/api/system/oss";
|
import { listByIds, delOss } from "@/api/system/oss";
|
||||||
import { ComponentInternalInstance } from "vue";
|
import { propTypes } from '@/utils/propTypes';
|
||||||
import { ElUpload, UploadFile } from "element-plus";
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
modelValue: [String, Object, Array],
|
modelValue: [String, Object, Array],
|
||||||
// 数量限制
|
// 数量限制
|
||||||
limit: {
|
limit: propTypes.number.def(5),
|
||||||
type: Number,
|
|
||||||
default: 5,
|
|
||||||
},
|
|
||||||
// 大小限制(MB)
|
// 大小限制(MB)
|
||||||
fileSize: {
|
fileSize: propTypes.number.def(5),
|
||||||
type: Number,
|
|
||||||
default: 5,
|
|
||||||
},
|
|
||||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||||
fileType: {
|
fileType: propTypes.array.def(["doc", "xls", "ppt", "txt", "pdf"]),
|
||||||
type: Array,
|
|
||||||
default: () => ["doc", "xls", "ppt", "txt", "pdf"],
|
|
||||||
},
|
|
||||||
// 是否显示提示
|
// 是否显示提示
|
||||||
isShowTip: {
|
isShowTip: propTypes.bool.def(true),
|
||||||
type: Boolean,
|
|
||||||
default: true
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
@ -86,7 +73,7 @@ const showTip = computed(
|
|||||||
() => props.isShowTip && (props.fileType || props.fileSize)
|
() => props.isShowTip && (props.fileType || props.fileSize)
|
||||||
);
|
);
|
||||||
|
|
||||||
const fileUploadRef = ref(ElUpload);
|
const fileUploadRef = ref<ElUploadInstance>();
|
||||||
|
|
||||||
watch(() => props.modelValue, async val => {
|
watch(() => props.modelValue, async val => {
|
||||||
if (val) {
|
if (val) {
|
||||||
@ -158,7 +145,7 @@ const handleUploadSuccess = (res:any, file: UploadFile) => {
|
|||||||
number.value--;
|
number.value--;
|
||||||
proxy?.$modal.closeLoading();
|
proxy?.$modal.closeLoading();
|
||||||
proxy?.$modal.msgError(res.msg);
|
proxy?.$modal.msgError(res.msg);
|
||||||
fileUploadRef.value.handleRemove(file);
|
fileUploadRef.value?.handleRemove(file);
|
||||||
uploadedSuccessfully();
|
uploadedSuccessfully();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -209,18 +196,21 @@ const listToString = (list: any[], separator?: string) => {
|
|||||||
.upload-file-uploader {
|
.upload-file-uploader {
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.upload-file-list .el-upload-list__item {
|
.upload-file-list .el-upload-list__item {
|
||||||
border: 1px solid #e4e7ed;
|
border: 1px solid #e4e7ed;
|
||||||
line-height: 2;
|
line-height: 2;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.upload-file-list .ele-upload-list__item-content {
|
.upload-file-list .ele-upload-list__item-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ele-upload-list__item-content-action .el-link {
|
.ele-upload-list__item-content-action .el-link {
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
@ -9,11 +9,10 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
defineProps({
|
defineProps({
|
||||||
isActive: {
|
isActive: propTypes.bool.def(false)
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['toggleClick'])
|
const emit = defineEmits(['toggleClick'])
|
||||||
|
@ -23,7 +23,6 @@ import { getNormalPath } from '@/utils/ruoyi';
|
|||||||
import { isHttp } from '@/utils/validate';
|
import { isHttp } from '@/utils/validate';
|
||||||
import usePermissionStore from '@/store/modules/permission';
|
import usePermissionStore from '@/store/modules/permission';
|
||||||
import { RouteOption } from 'vue-router';
|
import { RouteOption } from 'vue-router';
|
||||||
import { ElSelect } from 'element-plus';
|
|
||||||
|
|
||||||
type Router = Array<{
|
type Router = Array<{
|
||||||
path: string;
|
path: string;
|
||||||
@ -35,7 +34,7 @@ const options = ref<any>([]);
|
|||||||
const searchPool = ref<Router>([]);
|
const searchPool = ref<Router>([]);
|
||||||
const show = ref(false);
|
const show = ref(false);
|
||||||
const fuse = ref();
|
const fuse = ref();
|
||||||
const headerSearchSelectRef = ref(ElSelect);
|
const headerSearchSelectRef = ref<ElSelectInstance>();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const routes = computed(() => usePermissionStore().routes);
|
const routes = computed(() => usePermissionStore().routes);
|
||||||
|
|
||||||
|
@ -31,17 +31,11 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import icons from '@/components/IconSelect/requireIcons';
|
import icons from '@/components/IconSelect/requireIcons';
|
||||||
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
modelValue: {
|
modelValue: propTypes.string.isRequired,
|
||||||
type: String,
|
width: propTypes.string.def('400px')
|
||||||
require: true
|
|
||||||
},
|
|
||||||
width: {
|
|
||||||
type: String,
|
|
||||||
require: false,
|
|
||||||
default: '400px'
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const emit = defineEmits(['update:modelValue']);
|
const emit = defineEmits(['update:modelValue']);
|
||||||
|
@ -9,11 +9,10 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
src: {
|
src: propTypes.string.def(''),
|
||||||
type: String,
|
|
||||||
default: ""
|
|
||||||
},
|
|
||||||
width: {
|
width: {
|
||||||
type: [Number, String],
|
type: [Number, String],
|
||||||
default: ""
|
default: ""
|
||||||
@ -58,13 +57,16 @@ const realHeight = computed(() =>
|
|||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
background-color: #ebeef5;
|
background-color: #ebeef5;
|
||||||
box-shadow: 0 0 5px 1px #ccc;
|
box-shadow: 0 0 5px 1px #ccc;
|
||||||
|
|
||||||
:deep(.el-image__inner) {
|
:deep(.el-image__inner) {
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
transform: scale(1.2);
|
transform: scale(1.2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.image-slot) {
|
:deep(.image-slot) {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
@ -17,7 +17,9 @@
|
|||||||
:on-preview="handlePictureCardPreview"
|
:on-preview="handlePictureCardPreview"
|
||||||
:class="{ hide: fileList.length >= limit }"
|
:class="{ hide: fileList.length >= limit }"
|
||||||
>
|
>
|
||||||
<el-icon class="avatar-uploader-icon"><plus /></el-icon>
|
<el-icon class="avatar-uploader-icon">
|
||||||
|
<plus />
|
||||||
|
</el-icon>
|
||||||
</el-upload>
|
</el-upload>
|
||||||
<!-- 上传提示 -->
|
<!-- 上传提示 -->
|
||||||
<div class="el-upload__tip" v-if="showTip">
|
<div class="el-upload__tip" v-if="showTip">
|
||||||
@ -42,25 +44,16 @@ import { getToken } from "@/utils/auth";
|
|||||||
import { listByIds, delOss } from "@/api/system/oss";
|
import { listByIds, delOss } from "@/api/system/oss";
|
||||||
import { ComponentInternalInstance, PropType } from "vue";
|
import { ComponentInternalInstance, PropType } from "vue";
|
||||||
import { OssVO } from "@/api/system/oss/types";
|
import { OssVO } from "@/api/system/oss/types";
|
||||||
import { ElUpload, UploadFile } from "element-plus";
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
modelValue: [String, Object, Array],
|
modelValue: [String, Object, Array],
|
||||||
// 图片数量限制
|
// 图片数量限制
|
||||||
limit: {
|
limit: propTypes.number.def(5),
|
||||||
type: Number,
|
|
||||||
default: 5,
|
|
||||||
},
|
|
||||||
// 大小限制(MB)
|
// 大小限制(MB)
|
||||||
fileSize: {
|
fileSize: propTypes.number.def(5),
|
||||||
type: Number,
|
|
||||||
default: 5,
|
|
||||||
},
|
|
||||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||||
fileType: {
|
fileType: propTypes.array.def(["png", "jpg", "jpeg"]),
|
||||||
type: Array as PropType<string[]>,
|
|
||||||
default: () => ["png", "jpg", "jpeg"],
|
|
||||||
},
|
|
||||||
// 是否显示提示
|
// 是否显示提示
|
||||||
isShowTip: {
|
isShowTip: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
@ -84,7 +77,7 @@ const showTip = computed(
|
|||||||
() => props.isShowTip && (props.fileType || props.fileSize)
|
() => props.isShowTip && (props.fileType || props.fileSize)
|
||||||
);
|
);
|
||||||
|
|
||||||
const imageUploadRef = ref(ElUpload);
|
const imageUploadRef = ref<ElUploadInstance>();
|
||||||
|
|
||||||
watch(() => props.modelValue, async val => {
|
watch(() => props.modelValue, async val => {
|
||||||
if (val) {
|
if (val) {
|
||||||
@ -122,7 +115,7 @@ const handleBeforeUpload = (file: any) => {
|
|||||||
if (file.name.lastIndexOf(".") > -1) {
|
if (file.name.lastIndexOf(".") > -1) {
|
||||||
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
|
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
|
||||||
}
|
}
|
||||||
isImg = props.fileType.some((type) => {
|
isImg = props.fileType.some((type: any) => {
|
||||||
if (file.type.indexOf(type) > -1) return true;
|
if (file.type.indexOf(type) > -1) return true;
|
||||||
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
|
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
|
||||||
return false;
|
return false;
|
||||||
@ -161,7 +154,7 @@ const handleUploadSuccess = (res: any, file: UploadFile) => {
|
|||||||
number.value--;
|
number.value--;
|
||||||
proxy?.$modal.closeLoading();
|
proxy?.$modal.closeLoading();
|
||||||
proxy?.$modal.msgError(res.msg);
|
proxy?.$modal.msgError(res.msg);
|
||||||
imageUploadRef.value.handleRemove(file);
|
imageUploadRef.value?.handleRemove(file);
|
||||||
uploadedSuccessfully();
|
uploadedSuccessfully();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -18,25 +18,15 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { TransferKey } from "element-plus";
|
import { propTypes } from '@/utils/propTypes';
|
||||||
import { PropType } from "vue";
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
showSearch: {
|
showSearch: propTypes.bool.def(true),
|
||||||
type: Boolean,
|
|
||||||
default: true,
|
|
||||||
},
|
|
||||||
columns: {
|
columns: {
|
||||||
type: Array as PropType<FieldOption[]>,
|
type: Array as PropType<FieldOption[]>,
|
||||||
},
|
},
|
||||||
search: {
|
search: propTypes.bool.def(true),
|
||||||
type: Boolean,
|
gutter: propTypes.number.def(10),
|
||||||
default: true,
|
|
||||||
},
|
|
||||||
gutter: {
|
|
||||||
type: Number,
|
|
||||||
default: 10,
|
|
||||||
},
|
|
||||||
})
|
})
|
||||||
|
|
||||||
const emits = defineEmits(['update:showSearch', 'queryTable']);
|
const emits = defineEmits(['update:showSearch', 'queryTable']);
|
||||||
|
@ -5,19 +5,12 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
iconClass: {
|
iconClass: propTypes.string.isRequired,
|
||||||
type: String,
|
className: propTypes.string.def(''),
|
||||||
required: true
|
color: propTypes.string.def(''),
|
||||||
},
|
|
||||||
className: {
|
|
||||||
type: String,
|
|
||||||
default: ''
|
|
||||||
},
|
|
||||||
color: {
|
|
||||||
type: String,
|
|
||||||
default: ''
|
|
||||||
},
|
|
||||||
})
|
})
|
||||||
const iconName = computed(() => `#icon-${props.iconClass}`);
|
const iconName = computed(() => `#icon-${props.iconClass}`);
|
||||||
const svgClass = computed(() => {
|
const svgClass = computed(() => {
|
||||||
|
@ -29,7 +29,6 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ElTreeSelect } from 'element-plus'
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
/* 配置项 */
|
/* 配置项 */
|
||||||
@ -68,7 +67,7 @@ const props = defineProps({
|
|||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
const selectTree = ref(ElTreeSelect);
|
const selectTree = ref<ElTreeSelectInstance>();
|
||||||
|
|
||||||
const emit = defineEmits(['update:value']);
|
const emit = defineEmits(['update:value']);
|
||||||
|
|
||||||
@ -81,14 +80,14 @@ const valueId = computed({
|
|||||||
const valueTitle = ref('');
|
const valueTitle = ref('');
|
||||||
const defaultExpandedKey = ref<any[]>([]);
|
const defaultExpandedKey = ref<any[]>([]);
|
||||||
|
|
||||||
function initHandle() {
|
const initHandle = () => {
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
const selectedValue = valueId.value;
|
const selectedValue = valueId.value;
|
||||||
if (selectedValue !== null && typeof (selectedValue) !== 'undefined') {
|
if (selectedValue !== null && typeof (selectedValue) !== 'undefined') {
|
||||||
const node = selectTree.value.getNode(selectedValue)
|
const node = selectTree.value?.getNode(selectedValue)
|
||||||
if (node) {
|
if (node) {
|
||||||
valueTitle.value = node.data[props.objMap.label]
|
valueTitle.value = node.data[props.objMap.label]
|
||||||
selectTree.value.setCurrentKey(selectedValue) // 设置默认选中
|
selectTree.value?.setCurrentKey(selectedValue) // 设置默认选中
|
||||||
defaultExpandedKey.value = [selectedValue] // 设置默认展开
|
defaultExpandedKey.value = [selectedValue] // 设置默认展开
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
@ -96,27 +95,27 @@ function initHandle() {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
function handleNodeClick(node: any) {
|
const handleNodeClick = (node: any) => {
|
||||||
valueTitle.value = node[props.objMap.label]
|
valueTitle.value = node[props.objMap.label]
|
||||||
valueId.value = node[props.objMap.value];
|
valueId.value = node[props.objMap.value];
|
||||||
defaultExpandedKey.value = [];
|
defaultExpandedKey.value = [];
|
||||||
selectTree.value.blur()
|
selectTree.value?.blur()
|
||||||
selectFilterData('')
|
selectFilterData('')
|
||||||
}
|
}
|
||||||
function selectFilterData(val: any) {
|
const selectFilterData = (val: any) => {
|
||||||
selectTree.value.filter(val)
|
selectTree.value?.filter(val)
|
||||||
}
|
}
|
||||||
function filterNode(value: any, data: any) {
|
const filterNode = (value: any, data: any) => {
|
||||||
if (!value) return true
|
if (!value) return true
|
||||||
return data[props.objMap['label']].indexOf(value) !== -1
|
return data[props.objMap['label']].indexOf(value) !== -1
|
||||||
}
|
}
|
||||||
function clearHandle() {
|
const clearHandle = () => {
|
||||||
valueTitle.value = ''
|
valueTitle.value = ''
|
||||||
valueId.value = ''
|
valueId.value = ''
|
||||||
defaultExpandedKey.value = [];
|
defaultExpandedKey.value = [];
|
||||||
clearSelected()
|
clearSelected()
|
||||||
}
|
}
|
||||||
function clearSelected() {
|
const clearSelected = () => {
|
||||||
const allNode = document.querySelectorAll('#tree-option .el-tree-node')
|
const allNode = document.querySelectorAll('#tree-option .el-tree-node')
|
||||||
allNode.forEach((element) => element.classList.remove('is-current'))
|
allNode.forEach((element) => element.classList.remove('is-current'))
|
||||||
}
|
}
|
||||||
@ -132,6 +131,7 @@ watch(valueId, () => {
|
|||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "@/assets/styles/variables.module.scss";
|
@import "@/assets/styles/variables.module.scss";
|
||||||
|
|
||||||
.el-scrollbar .el-scrollbar__view .el-select-dropdown__item {
|
.el-scrollbar .el-scrollbar__view .el-select-dropdown__item {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
@ -5,11 +5,10 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { propTypes } from '@/utils/propTypes';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
src: {
|
src: propTypes.string.isRequired
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
const height = ref(document.documentElement.clientHeight - 94.5 + "px;")
|
const height = ref(document.documentElement.clientHeight - 94.5 + "px;")
|
||||||
|
Loading…
x
Reference in New Issue
Block a user