Skip to content

C
company_app
提交 ed833235 作者: 施汉文
操作

🌈 style: 关联标签修改

上级 5e642f8d
正在显示 包含 108 行增加 和 55 行删除
src/components/common/Empty.vue 0 → 100644
<template>
<div class="w-full h-full flex items-center justify-center">
<div class="flex flex-col justify-center">
<iconpark-icon name="Empty-2" class="text-[80px]"></iconpark-icon>
<slot></slot>
</div>
</div>
</template>
<script>
export default {
name: "CommonEmpty",
};
</script>
<style></style>
src/views/popup/AddTagsDrawer/components/TagsCheck.vue
...@@ -11,29 +11,40 @@ ...@@ -11,29 +11,40 @@
<div <div
class="flex flex-wrap content-start gap-[8px] mt-[8px] pb-[12px] border-b-[1px] border-dashed border-b-[#E5E5E6] h-[112px] overflow-y-auto" class="flex flex-wrap content-start gap-[8px] mt-[8px] pb-[12px] border-b-[1px] border-dashed border-b-[#E5E5E6] h-[112px] overflow-y-auto"
> >
<div <template v-if="value.length > 0">
class="flex items-center px-[6px] h-[22px] rounded-[4px] bg-[#F5F5F5]" <div
:class="[ class="flex items-center px-[6px] h-[22px] rounded-[4px] bg-[#F5F5F5]"
checkedIds && checkedIds.includes(item[options.value]) :class="[
? '' checkedIds && checkedIds.includes(item[options.value])
: 'bg-[#E8F1FD] ', ? ''
]" : 'bg-[#E8F1FD] ',
v-for="(item, index) in value" ]"
:key="index" v-for="(item, index) in value"
> :key="index"
{{ item[options.label] }} >
<i {{ item[options.label] }}
v-if="checkedIds && !checkedIds.includes(item[options.value])" <i
@click="remove(item)" v-if="checkedIds && !checkedIds.includes(item[options.value])"
class="el-icon-close ml-[6px] cursor-pointer text-[#B0B2B5] hover:text-primary" @click="remove(item)"
></i> class="el-icon-close ml-[6px] cursor-pointer text-[#B0B2B5] hover:text-primary"
</div> ></i>
</div>
</template>
<Empty v-else>
<div class="text-[#6D7176] text-[12px]">
未选择标签，点击下方标签进行勾选
</div>
</Empty>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import Empty from "@/components/common/Empty.vue";
export default { export default {
name: "TagsCheck", name: "TagsCheck",
components: {
Empty,
},
props: { props: {
value: { value: {
type: Array, type: Array,
...@@ -45,7 +56,7 @@ export default { ...@@ -45,7 +56,7 @@ export default {
}, },
checkedIds: { checkedIds: {
type: Array, type: Array,
default: () => null, default: () => [],
}, },
}, },
methods: { methods: {
...@@ -54,6 +65,7 @@ export default { ...@@ -54,6 +65,7 @@ export default {
"input", "input",
this.value.filter((i) => i !== item) this.value.filter((i) => i !== item)
); );
this.$emit("change");
}, },
clear() { clear() {
this.$emit( this.$emit(
...@@ -62,6 +74,7 @@ export default { ...@@ -62,6 +74,7 @@ export default {
this.checkedIds.includes(i[this.options.value]) this.checkedIds.includes(i[this.options.value])
) )
); );
this.$emit("change");
}, },
}, },
}; };
......
src/views/popup/AddTagsDrawer/index.vue
...@@ -11,6 +11,7 @@ ...@@ -11,6 +11,7 @@
v-model="list" v-model="list"
:checked-ids="defaultCheckedIds" :checked-ids="defaultCheckedIds"
:options="{ label: 'label_name', value: 'id' }" :options="{ label: 'label_name', value: 'id' }"
@change="applyInitialDisabledState"
/> />
<div class="flex-1 overflow-y-auto"> <div class="flex-1 overflow-y-auto">
<div class="text-[#363E49] text-[13px] mt-[12px] mb-[8px]"> <div class="text-[#363E49] text-[13px] mt-[12px] mb-[8px]">
...@@ -137,6 +138,7 @@ export default { ...@@ -137,6 +138,7 @@ export default {
if (res.status_code === 1) { if (res.status_code === 1) {
this.$message.success(res.msg); this.$message.success(res.msg);
this.close(); this.close();
this.$emit("submitOk");
} else { } else {
this.$message.error(res.msg || "添加失败"); this.$message.error(res.msg || "添加失败");
} }
......
src/views/userInfo/components/Info.vue
...@@ -149,58 +149,76 @@ ...@@ -149,58 +149,76 @@
/> />
<!-- 游戏标签 --> <!-- 游戏标签 -->
<div class="item rowFlex columnCenter spaceBetween tagsLost"> <div class="item rowFlex columnCenter spaceBetween tagsLost group">
<div class="rowFlex"> <div class="rowFlex items-center">
<span class="label">关联标签:</span> <span class="label">关联标签:</span>
<div <div
v-if=" v-if="
chatUserDetails.tag_group && chatUserDetails.tag_group &&
chatUserDetails.tag_group.length > 0 chatUserDetails.tag_group.length > 0
" "
class="flex space-x-[4px] items-center"
> >
<!-- 第一个标签组的所有标签 --> <div class="flex items-center space-x-[4px] cursor-pointer">
<el-tag
v-for="(items, indexs) in chatUserDetails.tag_group[0].tag"
:key="indexs"
>{{ items.name }}</el-tag
>
<!-- 如果有多个标签组，显示+n -->
<el-popover
v-if="chatUserDetails.tag_group.length > 1"
placement="top"
trigger="hover"
popper-class="tag-popover"
>
<div <div
class="groups-popover-content" v-for="(items, index) in chatUserDetails.tag_group[0].tag"
style="max-height: 600px; overflow-y: auto" :key="index"
class="px-[6px] rounded-[4px] bg-[#F5F5F5] gap-[4px] flex items-center h-[22px]"
> >
<div <div
v-for="( v-if="chatUserDetails.tag_group.length > 1"
group, groupIndex class="flex-1 truncate"
) in chatUserDetails.tag_group.slice(1)"
:key="groupIndex"
class="group-item"
> >
<el-tag {{ items.name }}
v-for="(tagItem, tagIndex) in group.tag"
:key="tagIndex"
style="margin-right: 10px"
>{{ tagItem.name }}</el-tag
>
</div> </div>
<div
v-else-if="chatUserDetails.tag_group.length > 0"
class="flex-1 truncate"
>
{{ items.name }}
</div>
<div v-else class="flex-1 truncate">--</div>
</div> </div>
<span slot="reference" class="tag-more" <el-tooltip
>+{{ chatUserDetails.tag_group.length - 1 }}</span effect="dark"
placement="top"
v-if="chatUserDetails.tag_group.length > 1"
> >
</el-popover> <div slot="content" class="space-y-[4px]">
<div
v-for="(
group, groupIndex
) in chatUserDetails.tag_group.slice(1)"
:key="groupIndex"
class="grid grid-cols-3 gap-[4px] border-b-[1px] border-[rgba(255,255,255,0.2)] border-dashed py-[4px]"
>
<div
v-for="(tagItem, tagIndex) in group.tag"
:key="tagIndex"
class="px-[6px] w-full max-w-[200px] rounded-[4px] bg-[rgba(255,255,255,0.2)] flex items-center h-[22px] overflow-hidden"
>
<span class="truncate"> {{ tagItem?.name }} </span>
</div>
</div>
</div>
<el-button type="text" size="small"
>+{{ chatUserDetails.tag_group.length - 1 }}
</el-button>
</el-tooltip>
<iconpark-icon
name="ziliao-tianjia-jb82dh2k"
class="group-hover:visible invisible text-primary text-[14px] ml-[6px]"
@click="editTags"
></iconpark-icon>
</div>
</div> </div>
</div> </div>
<i <!-- <i
class="el-icon-edit icon" class="el-icon-edit icon"
style="font-size: 14px; margin-right: 10px" style="font-size: 14px; margin-right: 10px"
@click="editTags" @click="editTags"
></i> ></i> -->
</div> </div>
<!-- 共享信息 --> <!-- 共享信息 -->
<shareInfo :chat-user-details="chatUserDetails" /> <shareInfo :chat-user-details="chatUserDetails" />
......
src/views/userInfo/components/gameInfo/ZyouTag.vue
<template> <template>
<div> <div>
<div class="item spaceBetween zyouTag grid grid-cols-12"> <div class="item spaceBetween zyouTag grid grid-cols-12 max-w-[360px]">
<div class="rowFlex col-span-3"> <div class="rowFlex col-span-3 max-w-[100px]">
<span class="label">掌游标签:</span> <span class="label">掌游标签:</span>
<!-- <i <!-- <i
:class="[ :class="[
...@@ -59,10 +59,12 @@ ...@@ -59,10 +59,12 @@
</div> </div>
<iconpark-icon <iconpark-icon
name="ziliao-tianjia-jb82dh2k" name="ziliao-tianjia-jb82dh2k"
class="group-hover:visible invisible text-primary text-[14px] ml-[6px]" class="invisible text-primary text-[14px] ml-[6px]"
:class="{ 'group-hover:visible': item.label_type == 2 }"
@click="addTag(item.label)" @click="addTag(item.label)"
></iconpark-icon> ></iconpark-icon>
</div> </div>
<Empty />
</div> </div>
</div> </div>
<!-- 掌游标签列表 --> <!-- 掌游标签列表 -->
...@@ -147,7 +149,11 @@ ...@@ -147,7 +149,11 @@
</div> </div>
</div> </div>
</div> --> </div> -->
<AddTagsDrawer ref="addTagsDrawer" :game-user-info="gameUserInfo" /> <AddTagsDrawer
ref="addTagsDrawer"
:game-user-info="gameUserInfo"
@submitOk="getRoleLabelList"
/>
</div> </div>
</template> </template>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论