🐛(component): [menu]在一个按需配置的项目中,只使用 menu 组件时,dropdown css 未自动引入导致的位置异常

This commit is contained in:
sight 2022-08-11 12:07:16 +08:00
parent 8541482993
commit dcdf47b2ca
4 changed files with 27 additions and 17 deletions

View File

@ -1,3 +1,6 @@
@import "../dropdown/index.less";
@import "../popper/index.less"
.layui-nav .layui-show.layui-anim-upbit .layui-show.layui-anim-upbit { .layui-nav .layui-show.layui-anim-upbit .layui-show.layui-anim-upbit {
top: 0px; top: 0px;
left: calc(100% + 5px); left: calc(100% + 5px);

View File

@ -265,11 +265,13 @@ watch(
const changeAll = (isChecked: boolean) => { const changeAll = (isChecked: boolean) => {
// Selected // Selected
if(isChecked) { if (isChecked) {
const datasources = props.dataSource.filter((item: any, index: number) => { const datasources = props.dataSource.filter((item: any, index: number) => {
return !props.getCheckboxProps(item, index).disabled; return !props.getCheckboxProps(item, index).disabled;
}); });
const ids = datasources.map((item) => {return item[props.id]}); const ids = datasources.map((item) => {
return item[props.id];
});
tableSelectedKeys.value = [...ids]; tableSelectedKeys.value = [...ids];
} else { } else {
// unSelected // unSelected

View File

@ -49,10 +49,12 @@ const hasRightChecked = ref(false);
const allLeftChange = (isChecked: boolean) => { const allLeftChange = (isChecked: boolean) => {
if (isChecked) { if (isChecked) {
const datasources = leftDataSource.value.filter((item: any) => { const datasources = leftDataSource.value.filter((item: any) => {
return !item.disabled return !item.disabled;
}); });
const ids = datasources.map((item) => {return item[props.id]}); const ids = datasources.map((item) => {
console.log(JSON.stringify(ids)) return item[props.id];
});
console.log(JSON.stringify(ids));
leftSelectedKeys.value = [...ids]; leftSelectedKeys.value = [...ids];
} else { } else {
leftSelectedKeys.value = []; leftSelectedKeys.value = [];
@ -82,10 +84,12 @@ watch(
const allRightChange = (checked: any) => { const allRightChange = (checked: any) => {
if (checked) { if (checked) {
const datasources = rightDataSource.value.filter((item: any) => { const datasources = rightDataSource.value.filter((item: any) => {
return !item.disabled return !item.disabled;
}); });
const ids = datasources.map((item) => { return item[props.id]}) const ids = datasources.map((item) => {
console.log(JSON.stringify(ids)) return item[props.id];
});
console.log(JSON.stringify(ids));
rightSelectedKeys.value = [...ids]; rightSelectedKeys.value = [...ids];
} else { } else {
rightSelectedKeys.value = []; rightSelectedKeys.value = [];

View File

@ -30,7 +30,8 @@
<i <i
class="layui-icon layui-icon-chart btn" class="layui-icon layui-icon-chart btn"
title="在 stackblitz 打开" title="在 stackblitz 打开"
@click="onStackblitz"> @click="onStackblitz"
>
</i> </i>
</div> </div>
</div> </div>
@ -40,7 +41,7 @@
import { layer } from "@layui/layer-vue"; import { layer } from "@layui/layer-vue";
import { onMounted, onUnmounted, ref, watch } from "vue"; import { onMounted, onUnmounted, ref, watch } from "vue";
import { openPlayground } from "../utils/code-playground"; import { openPlayground } from "../utils/code-playground";
import { openStackblitz } from "../utils/code-stackblitz" import { openStackblitz } from "../utils/code-stackblitz";
const meta = ref<HTMLElement>({} as HTMLElement); const meta = ref<HTMLElement>({} as HTMLElement);
const isFixContorl = ref(false); const isFixContorl = ref(false);
@ -61,12 +62,12 @@ const onPlayground = async function () {
window.open(link); window.open(link);
}; };
const onStackblitz = function() { const onStackblitz = function () {
const foundCodes = meta.value.getElementsByClassName("language-html"); const foundCodes = meta.value.getElementsByClassName("language-html");
const foundCode = foundCodes[0]; const foundCode = foundCodes[0];
const SourceCode = foundCode.textContent || ""; const SourceCode = foundCode.textContent || "";
openStackblitz(SourceCode); openStackblitz(SourceCode);
} };
const copy = function () { const copy = function () {
const foundCodes = meta.value.getElementsByClassName("language-html"); const foundCodes = meta.value.getElementsByClassName("language-html");
@ -213,7 +214,7 @@ function handleScroll() {
.btn:hover::before { .btn:hover::before {
color: #5fb878; color: #5fb878;
} }
.btn:hover svg > path{ .btn:hover svg > path {
fill: #5fb878; fill: #5fb878;
} }
</style> </style>