|
|
|
|
@ -1,65 +1,112 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<n-popconfirm v-model:show="showModal">
|
|
|
|
|
<n-popconfirm :show-icon="false" @positive-click="handlePositiveClick">
|
|
|
|
|
<!-- 按钮区 -->
|
|
|
|
|
<template #trigger>
|
|
|
|
|
<n-button>引用</n-button>
|
|
|
|
|
<n-tooltip trigger="hover">
|
|
|
|
|
<template #trigger>
|
|
|
|
|
<n-button strong secondary size="tiny">
|
|
|
|
|
<template #icon>
|
|
|
|
|
<n-icon size="14" style="cursor: pointer">
|
|
|
|
|
<svg
|
|
|
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
|
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
|
|
|
viewBox="0 0 12 12"
|
|
|
|
|
>
|
|
|
|
|
<g fill="none">
|
|
|
|
|
<path
|
|
|
|
|
d="M6.5 1.75a.75.75 0 0 0-1.5 0V5H1.75a.75.75 0 0 0 0 1.5H5v3.25a.75.75 0 0 0 1.5 0V6.5h3.25a.75.75 0 0 0 0-1.5H6.5V1.75z"
|
|
|
|
|
fill="currentColor"
|
|
|
|
|
></path>
|
|
|
|
|
</g>
|
|
|
|
|
</svg>
|
|
|
|
|
</n-icon>
|
|
|
|
|
</template>
|
|
|
|
|
</n-button>
|
|
|
|
|
</template>
|
|
|
|
|
添加为常用问题
|
|
|
|
|
</n-tooltip>
|
|
|
|
|
</template>
|
|
|
|
|
譬如，我或许可以就大象本身写一点什么，但对象的驯化却不知从何写起。
|
|
|
|
|
<template #action>
|
|
|
|
|
<n-button size="small" @click="showModal = false">
|
|
|
|
|
或许吧
|
|
|
|
|
</n-button>
|
|
|
|
|
</template>
|
|
|
|
|
</n-popconfirm>
|
|
|
|
|
<!-- <n-tooltip placement="bottom" trigger="hover">
|
|
|
|
|
<template #trigger>
|
|
|
|
|
<n-icon size="14" style="cursor: pointer" @click="handleAdd()">
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 12 12">
|
|
|
|
|
<g fill="none">
|
|
|
|
|
<path
|
|
|
|
|
d="M6.5 1.75a.75.75 0 0 0-1.5 0V5H1.75a.75.75 0 0 0 0 1.5H5v3.25a.75.75 0 0 0 1.5 0V6.5h3.25a.75.75 0 0 0 0-1.5H6.5V1.75z"
|
|
|
|
|
fill="currentColor"
|
|
|
|
|
></path>
|
|
|
|
|
</g>
|
|
|
|
|
</svg>
|
|
|
|
|
</n-icon>
|
|
|
|
|
</template>
|
|
|
|
|
<span> 添加为常用问题 </span>
|
|
|
|
|
</n-tooltip> -->
|
|
|
|
|
|
|
|
|
|
<!-- 弹窗信息 -->
|
|
|
|
|
<!-- <n-modal v-model:show="showModal">
|
|
|
|
|
<n-card style="width: 600px" title="添加常用问题" :bordered="false" size="huge" role="dialog" aria-modal="true">
|
|
|
|
|
<div class="issue-list">
|
|
|
|
|
|
|
|
|
|
<div class="issue-item"></div>
|
|
|
|
|
<div class="issue-item"></div>
|
|
|
|
|
<div class="issue-item"></div>
|
|
|
|
|
<!-- 内容区 -->
|
|
|
|
|
<div class="issue-list">
|
|
|
|
|
<div
|
|
|
|
|
class="issue-item"
|
|
|
|
|
:class="currentIndex == index ? 'active-type' : ''"
|
|
|
|
|
@click="handlerClick(item.dictKey, index)"
|
|
|
|
|
v-for="(item, index) in list"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
>
|
|
|
|
|
{{ item.dictValue }}
|
|
|
|
|
</div>
|
|
|
|
|
<template #footer> 尾部 </template>
|
|
|
|
|
</n-card>
|
|
|
|
|
</n-modal> -->
|
|
|
|
|
</div>
|
|
|
|
|
</n-popconfirm>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
|
import { ref } from 'vue'
|
|
|
|
|
let showModal = ref(true)
|
|
|
|
|
import { addIssue } from '@/api/path'
|
|
|
|
|
import { useMessage } from 'naive-ui'
|
|
|
|
|
import { ref, reactive } from 'vue'
|
|
|
|
|
import { useSystemStore } from '@/store/modules/systemStore/systemStore'
|
|
|
|
|
|
|
|
|
|
const handleAdd = () => {
|
|
|
|
|
showModal.value = true
|
|
|
|
|
const props = defineProps({
|
|
|
|
|
list: {
|
|
|
|
|
type: Array,
|
|
|
|
|
default: () => []
|
|
|
|
|
},
|
|
|
|
|
issueText: {
|
|
|
|
|
type: String,
|
|
|
|
|
default: ''
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
const systemStore = useSystemStore()
|
|
|
|
|
let currentIndex = ref(null)
|
|
|
|
|
const message = useMessage()
|
|
|
|
|
let form = {
|
|
|
|
|
questionType: undefined,
|
|
|
|
|
content: undefined,
|
|
|
|
|
userId: undefined
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const handlePositiveClick = async () => {
|
|
|
|
|
form.content = props.issueText
|
|
|
|
|
form.userId = systemStore.userInfo.userId || 1
|
|
|
|
|
try {
|
|
|
|
|
await addIssue(form)
|
|
|
|
|
currentIndex.value = null
|
|
|
|
|
} catch {
|
|
|
|
|
message.warning('保存出错！请联系管理员')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
const handlerClick = (dictKey, index) => {
|
|
|
|
|
if (currentIndex.value != index) {
|
|
|
|
|
form.questionType = dictKey
|
|
|
|
|
currentIndex.value = index
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.issue-list {
|
|
|
|
|
width: 250px;
|
|
|
|
|
display: grid;
|
|
|
|
|
grid-template-columns: repeat(3, 1fr);
|
|
|
|
|
gap: 20px;
|
|
|
|
|
gap: 10px;
|
|
|
|
|
|
|
|
|
|
.issue-item{
|
|
|
|
|
height: 100px;
|
|
|
|
|
background-color: rgba(242, 242, 242, 1);
|
|
|
|
|
.issue-item {
|
|
|
|
|
padding: 10px 0;
|
|
|
|
|
color: '#fff';
|
|
|
|
|
text-align: center;
|
|
|
|
|
background-color: #3d424d;
|
|
|
|
|
border: 1px solid #474d59;
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
}
|
|
|
|
|
.active-type {
|
|
|
|
|
border-color: #507afc;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
