145 lines
3.3 KiB
Vue
145 lines
3.3 KiB
Vue
<script setup lang="ts">
|
|
import AppDictionaryCache from "@/core/utils/AppDictionaryCache";
|
|
import T_Character_Personality_RelationService from "@/services/apps/T_Character_Personality_Relations/T_Character_Personality_RelationService";
|
|
//
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
record: any;
|
|
color: string;
|
|
}>(),
|
|
{
|
|
color: "blue",
|
|
}
|
|
);
|
|
const emits = defineEmits<{
|
|
(e: "del"): void;
|
|
}>();
|
|
|
|
const open = ref<boolean>(false);
|
|
const showModal = async () => {
|
|
const _data = await AppDictionaryCache.appDictionaryTypesCache.getDataList();
|
|
const mData = [];
|
|
const keys = [];
|
|
_data.forEach((item, index) => {
|
|
const data = {
|
|
key: item.value,
|
|
title: item.name,
|
|
description: item.code,
|
|
};
|
|
// console.log(props.record.personas.filter(it=> it.value == item.value));
|
|
|
|
if (
|
|
props.record.personas.filter((it) => it.value == item.value).length > 0
|
|
) {
|
|
console.log("添加", data);
|
|
|
|
keys.push(data.key);
|
|
}
|
|
// if()
|
|
mData.push(data);
|
|
});
|
|
console.log(props.record);
|
|
|
|
mockData.value = mData;
|
|
targetKeys.value = keys;
|
|
console.log(mockData.value, targetKeys.value);
|
|
open.value = true;
|
|
};
|
|
const handleOk = async (e: MouseEvent) => {
|
|
console.log(e);
|
|
console.log(targetKeys.value);
|
|
await T_Character_Personality_RelationService.setCharacterPersonality(
|
|
props.record.id,
|
|
targetKeys.value
|
|
);
|
|
props.personas = mockData.value
|
|
.filter((it) => targetKeys.value.includes(it.value))
|
|
.map((item) => {
|
|
return {
|
|
name: item.title,
|
|
code: item.description,
|
|
value: item.key,
|
|
};
|
|
});
|
|
|
|
// setCharacterPersonality
|
|
open.value = false;
|
|
};
|
|
|
|
interface MockData {
|
|
key: number;
|
|
title: string;
|
|
description: string;
|
|
chosen: boolean;
|
|
}
|
|
// {
|
|
// "page": 1,
|
|
// "size": 50,
|
|
// "search": {},
|
|
// "searchSort": []
|
|
// }
|
|
// T_Character_Personality_RelationService.findList(1,999,{},{});
|
|
|
|
const mockData = ref<MockData[]>([]);
|
|
|
|
const targetKeys = ref<number[]>([]);
|
|
|
|
const handleChange = (
|
|
keys: number[],
|
|
direction: string,
|
|
moveKeys: string[]
|
|
) => {
|
|
console.log(keys, direction, moveKeys);
|
|
};
|
|
|
|
const filterOption = (inputValue: string, option: MockData) => {
|
|
return option.title.indexOf(inputValue) > -1||option.description.indexOf(inputValue) > -1;
|
|
};
|
|
|
|
</script>
|
|
<template>
|
|
<a-button
|
|
type="primary"
|
|
size="small"
|
|
style="width: 60px; height: 22px; font-size: 12px"
|
|
@click="showModal"
|
|
>性格管理</a-button
|
|
>
|
|
<a-modal
|
|
v-model:open="open"
|
|
title="性格管理"
|
|
@ok="handleOk"
|
|
width="800px"
|
|
:maskClosable="false"
|
|
>
|
|
<a-transfer
|
|
v-model:target-keys="targetKeys"
|
|
:data-source="mockData"
|
|
:filter-option="filterOption"
|
|
show-search
|
|
:list-style="{
|
|
width: '300px',
|
|
height: '300px',
|
|
}"
|
|
@change="handleChange"
|
|
>
|
|
<template #footer="{ direction }">
|
|
<a-button
|
|
v-if="direction === 'left'"
|
|
size="small"
|
|
style="float: left; margin: 5px"
|
|
type="primary"
|
|
>
|
|
添加性格
|
|
</a-button>
|
|
</template>
|
|
<template #render="item">
|
|
<span class="custom-item"
|
|
>{{ item.title }} - {{ item.description }}</span
|
|
>
|
|
</template>
|
|
</a-transfer>
|
|
</a-modal>
|
|
</template>
|
|
<style lang="less" scoped></style>
|