155 lines
4.4 KiB
Vue
155 lines
4.4 KiB
Vue
<script setup lang="ts">
|
||
import DiscussionTypeItem from '../components/DiscussionTypeItem.vue';
|
||
import { ref } from 'vue';
|
||
import type {
|
||
discussionTypeOrSection,
|
||
categoryType
|
||
} from '@/api/discussion/types';
|
||
import { useRouter } from 'vue-router';
|
||
import { getAllTypes } from '@/api/discussion';
|
||
import { DISCUSS_FORMAT } from '@/constant/discuss';
|
||
import isArray from 'lodash/isArray';
|
||
import isEmpty from 'lodash/isEmpty';
|
||
import { useDiscussGetUserInfo, useDiscussionOpen } from '@/api/discussion/hook';
|
||
import { orgInfoStore } from '@/stores/Org';
|
||
import { repoInfoStore } from '@/stores/Repo';
|
||
import { Message } from 'vue-devui/message';
|
||
|
||
defineOptions({
|
||
name: 'DiscussionSelectType'
|
||
});
|
||
|
||
const props = withDefaults(defineProps<{
|
||
sourceType: 1|2; // 组织1，项目2
|
||
orgNamespace?: string; // 组织namespace
|
||
}>(), {
|
||
sourceType: 1
|
||
});
|
||
|
||
const router = useRouter();
|
||
|
||
// 获取当前用户信息 & 是否登录
|
||
const { isLogin = false, userInfo = {}} = useDiscussGetUserInfo();
|
||
if (!isLogin) router.push('/404');
|
||
|
||
// 确认讨论是否开启
|
||
const { id: source_id, discussOpen, getDiscussionStatus } = useDiscussionOpen(props.sourceType, props.orgNamespace);
|
||
|
||
// 获取当前用户项目/组织权限
|
||
const access_level = props.sourceType === 1 ? orgInfoStore().access_level : repoInfoStore().access_level;
|
||
|
||
const loading = ref(false);
|
||
const typeList = ref([] as discussionTypeOrSection[]);
|
||
// 获取所有 type
|
||
const getDiscussionTypeList = async() => {
|
||
loading.value = true;
|
||
const res = await getAllTypes({ id: source_id.value, source_type: props.sourceType });
|
||
if (!res.error) {
|
||
const resData = res?.data?.data;
|
||
const tempData = access_level > 30 ? resData : resData.filter((item:categoryType) => item.category_type !== DISCUSS_FORMAT.ANNOUNCE);
|
||
// 赋值
|
||
typeList.value =
|
||
isArray(resData) && !isEmpty(resData)
|
||
? tempData.map((item: categoryType) => ({
|
||
id: item.id,
|
||
icon: item.category_icon,
|
||
title: item.category_name,
|
||
desc: item.category_desc,
|
||
answerAcceptEnable: item.category_type === 2,
|
||
isGroup: false
|
||
}))
|
||
: [];
|
||
}
|
||
loading.value = false;
|
||
};
|
||
|
||
const initialData = async() => {
|
||
await getDiscussionStatus();
|
||
if (source_id.value && discussOpen.value === '1') {
|
||
await getDiscussionTypeList();
|
||
} else {
|
||
Message.warning(`${props.sourceType === 1 ? '组织' : '项目'}讨论未开启`);
|
||
router.replace('/404');
|
||
}
|
||
};
|
||
initialData();
|
||
|
||
const onDiscussionCreate = (item: discussionTypeOrSection) => {
|
||
router.push({
|
||
name: `${props.sourceType === 1 ? 'org' : 'repo'}DiscussionCreate`,
|
||
params: {
|
||
discussionTypeId: item.id
|
||
}
|
||
});
|
||
};
|
||
|
||
const goToTypeManage = () => {
|
||
router.push({ name: `${props.sourceType === 1 ? 'org' : 'repo'}DiscussionType` });
|
||
};
|
||
|
||
</script>
|
||
|
||
<template>
|
||
<div class="discussion-select space-y-20 mt-6">
|
||
<d-skeleton :loading="loading">
|
||
<header>
|
||
<p class="discussion-select__title">请选择你要创建的讨论类型</p>
|
||
<d-button v-if="access_level>30" variant="solid" color="primary" @click="goToTypeManage">
|
||
讨论内容分类设置
|
||
</d-button>
|
||
</header>
|
||
<Card simple>
|
||
<DiscussionTypeItem v-for="item in typeList" :key="item.id" :info="item">
|
||
<!-- 替换为 emoji -->
|
||
<template #icon>
|
||
<span class="emoji-icon">{{ item.icon }}</span>
|
||
</template>
|
||
<template #tools>
|
||
<d-button class="create-btn" size="md" @click="onDiscussionCreate(item)"
|
||
>发起讨论</d-button
|
||
>
|
||
</template>
|
||
</DiscussionTypeItem>
|
||
</Card>
|
||
</d-skeleton>
|
||
</div>
|
||
</template>
|
||
|
||
<style scoped lang="scss">
|
||
@import 'devui-theme/styles-var/devui-var.scss';
|
||
.discussion-select {
|
||
& > header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
&__title {
|
||
font-size: 18px;
|
||
font-weight: 500;
|
||
color: #2d2d2e;
|
||
line-height: 32px;
|
||
}
|
||
:deep(.discussion-type-item) {
|
||
border-top: 0;
|
||
border-radius: 0;
|
||
border-bottom: 1px solid var(--color-border-light);
|
||
box-shadow: none;
|
||
&:first-of-type {
|
||
border-top-left-radius: var(--border-radius);
|
||
border-top-right-radius: var(--border-radius);
|
||
}
|
||
&:last-of-type {
|
||
border-bottom-left-radius: var(--border-radius);
|
||
border-bottom-right-radius: var(--border-radius);
|
||
border-bottom: none;
|
||
}
|
||
}
|
||
}
|
||
|
||
.create-btn {
|
||
padding: 6px 20px;
|
||
border-radius: var(--border-radius);
|
||
font-weight: 500;
|
||
}
|
||
</style>
|