This commit is contained in:
wangdan-fit2cloud 2024-01-24 15:42:12 +08:00
parent 8348b397e6
commit 9daa8beb11
7 changed files with 118 additions and 66 deletions

View File

@ -20,7 +20,6 @@
<CardBox <CardBox
shadow="none" shadow="none"
:title="item.title || '-'" :title="item.title || '-'"
:description="item.content"
class="paragraph-source-card cursor mb-8" class="paragraph-source-card cursor mb-8"
:class="item.is_active ? '' : 'disabled'" :class="item.is_active ? '' : 'disabled'"
:showIcon="false" :showIcon="false"
@ -29,6 +28,11 @@
<AppAvatar :name="index + 1 + ''" class="mr-12 avatar-light" :size="22" /> <AppAvatar :name="index + 1 + ''" class="mr-12 avatar-light" :size="22" />
</template> </template>
<div class="active-button primary">{{ item.similarity?.toFixed(3) }}</div> <div class="active-button primary">{{ item.similarity?.toFixed(3) }}</div>
<template #description>
<el-scrollbar height="90">
{{ item.content }}
</el-scrollbar>
</template>
<template #footer> <template #footer>
<div class="footer-content flex-between"> <div class="footer-content flex-between">
<el-text> <el-text>
@ -88,10 +92,6 @@ defineExpose({ open })
.paragraph-source-card { .paragraph-source-card {
height: 210px; height: 210px;
width: 100%; width: 100%;
:deep(.description) {
-webkit-line-clamp: 5 !important;
height: 110px !important;
}
.active-button { .active-button {
position: absolute; position: absolute;
right: 16px; right: 16px;

View File

@ -12,9 +12,11 @@
</div> </div>
</slot> </slot>
</div> </div>
<div class="description mt-12" v-if="$slots.description || description"> <div class="description break-all mt-12" v-if="$slots.description || description">
<slot name="description"> <slot name="description">
{{ description }} <div class="content">
{{ description }}
</div>
</slot> </slot>
</div> </div>
<slot /> <slot />
@ -63,14 +65,16 @@ function cardLeave() {
min-width: var(--card-min-width); min-width: var(--card-min-width);
border-radius: 8px; border-radius: 8px;
.description { .description {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
height: var(--app-card-box-description-height, 40px);
color: var(--app-text-color-secondary); color: var(--app-text-color-secondary);
line-height: 22px; line-height: 22px;
font-weight: 400; font-weight: 400;
.content {
display: -webkit-box;
height: var(--app-card-box-description-height, 40px);
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
} }
.card-footer { .card-footer {
position: absolute; position: absolute;

View File

@ -6,13 +6,28 @@
<el-tag <el-tag
v-for="(item, index) in tagsList" v-for="(item, index) in tagsList"
:key="index" :key="index"
@close="removeTag(item)" @close="removeTag(index)"
closable closable
class="mr-8" class="mr-8"
>{{ item }} type="info"
>{{ item.username }}
</el-tag> </el-tag>
</div> </div>
<!-- 输入框 --> <!-- 输入框 -->
<el-autocomplete
:placeholder="tagsList.length == 0 ? placeholder : ''"
:validate-event="false"
v-model="currentval"
:fetch-suggestions="querySearchAsync"
@select="handleSelect"
:popper-class="noData ? 'platform-auto-complete' : ''"
>
<template #default="{ item }">
<!-- 解决匹配不到提示无匹配数据 -->
<div class="default" v-if="noData">{{ item.default }}</div>
<div class="value" v-else>{{ item.username }}</div>
</template>
</el-autocomplete>
<!-- <el-input <!-- <el-input
:validate-event="false" :validate-event="false"
v-model="currentval" v-model="currentval"
@ -23,18 +38,14 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, watch } from 'vue' import { ref, watch } from 'vue'
import UserApi from '@/api/user'
defineOptions({ name: 'TagsInput' }) defineOptions({ name: 'TagsInput' })
const props = defineProps({ const props = defineProps({
tags: { tags: {
/* 多个 */ /* 多个 */
type: Array<String>, type: Array<any>,
default: () => [] default: () => []
}, },
tag: {
/* 单个 */
type: String,
default: ''
},
placeholder: { placeholder: {
type: String, type: String,
default: '请输入' default: '请输入'
@ -43,33 +54,44 @@ const props = defineProps({
/* 最多生成标签数 */ /* 最多生成标签数 */
type: Number, type: Number,
default: -1 default: -1
},
reg: {
type: String,
default: ''
} }
}) })
const emit = defineEmits(['update:tags', 'update:tag']) const emit = defineEmits(['update:tags'])
const currentval = ref('') const currentval = ref('')
const tagsList = ref<String[]>([]) const tagsList = ref<any[]>([])
const noData = ref(false) //
watch([tagsList, currentval], (val) => { watch([tagsList, currentval], (val) => {
if (val[0]?.length > 0) { emit('update:tags', val[0])
emit('update:tags', val[0])
} else if (val[1]) {
emit('update:tag', val[1])
}
}) })
function addTags() { const querySearchAsync = (queryString: string, cb: (arg: any) => void) => {
const val = currentval.value.trim() if (queryString) {
if (val) { let matchResults
tagsList.value.push(val) UserApi.getUserList(queryString).then((res) => {
if (res.data.length === 0) {
noData.value = true
matchResults = [{ default: '无匹配数据' }]
} else {
noData.value = false
matchResults = res.data
}
cb(matchResults)
})
} else {
cb([])
}
}
const handleSelect = (item: any) => {
if (!tagsList.value.some((obj: any) => obj.id === item.id)) {
tagsList.value.push(item)
} }
currentval.value = '' currentval.value = ''
} }
function removeTag(tag: String) {
tagsList.value.splice(tagsList.value.indexOf(tag), 1) function removeTag(index: number) {
tagsList.value.splice(index, 1)
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -78,6 +100,9 @@ function removeTag(tag: String) {
min-height: 70px; min-height: 70px;
border: 1px solid var(--el-border-color); border: 1px solid var(--el-border-color);
border-radius: var(--el-border-radius-base); border-radius: var(--el-border-radius-base);
:deep(.el-autocomplete) {
width: 100%;
}
:deep(.el-input__wrapper) { :deep(.el-input__wrapper) {
background: none !important; background: none !important;
box-shadow: none !important; box-shadow: none !important;

View File

@ -216,3 +216,20 @@
right: 10px; right: 10px;
left: auto; left: auto;
} }
// 自动补全增加暂无数据
.platform-auto-complete {
.el-autocomplete-suggestion__wrap {
padding: 5px 0;
ul li {
pointer-events: none; // 阻止可点击事件
.default {
text-align: center;
color: #999;
}
&:hover {
background-color: #fff;
}
}
}
}

View File

@ -97,7 +97,7 @@ function deleteParagraph() {
} }
function getMark(data: any) { function getMark(data: any) {
logApi.getMarkRecord(id as string, data.chat, data.id, loading).then((res: any) => { logApi.getMarkRecord(id as string, data.chat_id, data.id, loading).then((res: any) => {
if (res.data.length > 0) { if (res.data.length > 0) {
form.value = res.data[0] form.value = res.data[0]
} }

View File

@ -232,9 +232,9 @@ onMounted(() => {
color: var(--app-border-color-dark); color: var(--app-border-color-dark);
} }
} }
:deep(.description) { :deep(.content) {
-webkit-line-clamp: 5 !important; -webkit-line-clamp: 5 !important;
height: 110px; height: 110px !important;
} }
.active-button { .active-button {
position: absolute; position: absolute;

View File

@ -20,7 +20,8 @@
@submit.prevent @submit.prevent
> >
<el-form-item label="用户名/邮箱" prop="users"> <el-form-item label="用户名/邮箱" prop="users">
<el-select <tags-input v-model:tags="memberForm.users" placeholder="请输入成员的用户名或邮箱" />
<!-- <el-select
ref="SelectRemoteRef" ref="SelectRemoteRef"
class="custom-select-multiple" class="custom-select-multiple"
v-model="memberForm.users" v-model="memberForm.users"
@ -40,13 +41,15 @@
:label="item?.username" :label="item?.username"
:value="item?.id" :value="item?.id"
/> />
</el-select> </el-select> -->
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template #footer>
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click.prevent="dialogVisible = false"> 取消 </el-button> <el-button @click.prevent="dialogVisible = false"> 取消 </el-button>
<el-button type="primary" @click="submitMember(addMemberFormRef)"> 添加 </el-button> <el-button type="primary" @click="submitMember(addMemberFormRef)" :loading="loading">
添加
</el-button>
</span> </span>
</template> </template>
</el-dialog> </el-dialog>
@ -56,7 +59,7 @@ import { ref, watch, onMounted } from 'vue'
import type { FormInstance, FormRules } from 'element-plus' import type { FormInstance, FormRules } from 'element-plus'
import { MsgSuccess } from '@/utils/message' import { MsgSuccess } from '@/utils/message'
import TeamApi from '@/api/team' import TeamApi from '@/api/team'
import UserApi from '@/api/user' // import UserApi from '@/api/user'
const emit = defineEmits(['refresh']) const emit = defineEmits(['refresh'])
@ -66,11 +69,11 @@ const memberForm = ref({
users: [] users: []
}) })
const SelectRemoteRef = ref() // const SelectRemoteRef = ref()
const addMemberFormRef = ref<FormInstance>() const addMemberFormRef = ref<FormInstance>()
const loading = ref<boolean>(false) const loading = ref<boolean>(false)
const userOptions = ref<Array<any>>([]) // const userOptions = ref<Array<any>>([])
const rules = ref<FormRules>({ const rules = ref<FormRules>({
users: [ users: [
@ -88,23 +91,24 @@ watch(dialogVisible, (bool) => {
memberForm.value = { memberForm.value = {
users: [] users: []
} }
loading.value = false
} }
}) })
const remoteMethod = (query: string) => { // const remoteMethod = (query: string) => {
if (query) { // if (query) {
setTimeout(() => { // setTimeout(() => {
getUser(query) // getUser(query)
}, 200) // }, 200)
} else { // } else {
userOptions.value = [] // userOptions.value = []
} // }
} // }
const changeSelectHandle = () => { // const changeSelectHandle = () => {
SelectRemoteRef.value.query = '' // SelectRemoteRef.value.query = ''
SelectRemoteRef.value.blur() // SelectRemoteRef.value.blur()
} // }
const open = () => { const open = () => {
dialogVisible.value = true dialogVisible.value = true
@ -114,10 +118,12 @@ const submitMember = async (formEl: FormInstance | undefined) => {
await formEl.validate((valid, fields) => { await formEl.validate((valid, fields) => {
if (valid) { if (valid) {
loading.value = true loading.value = true
TeamApi.postCreatTeamMember(memberForm.value.users).then((res) => { let idsArray = memberForm.value.users.map((obj: any) => obj.id)
TeamApi.postCreatTeamMember(idsArray).then((res) => {
MsgSuccess('提交成功') MsgSuccess('提交成功')
emit('refresh', memberForm.value.users) emit('refresh', idsArray)
dialogVisible.value = false dialogVisible.value = false
loading.value = false
}) })
} else { } else {
console.log('error submit!') console.log('error submit!')
@ -125,11 +131,11 @@ const submitMember = async (formEl: FormInstance | undefined) => {
}) })
} }
const getUser = (val: string) => { // const getUser = (val: string) => {
UserApi.getUserList(val, loading).then((res) => { // UserApi.getUserList(val, loading).then((res) => {
userOptions.value = res.data // userOptions.value.push(res.data)
}) // })
} // }
onMounted(() => {}) onMounted(() => {})