|
|
@@ -10,7 +10,15 @@
|
|
|
</div>
|
|
|
</section>
|
|
|
<footer v-if="hasUpload">
|
|
|
- <a-popover :popup-visible="showUpload" position="tl">
|
|
|
+ <a-popover
|
|
|
+ :popup-visible="showUpload"
|
|
|
+ position="tl"
|
|
|
+ @popup-visible-change="
|
|
|
+ () => {
|
|
|
+ showDeleteTooltip = false;
|
|
|
+ }
|
|
|
+ "
|
|
|
+ >
|
|
|
<div :class="{ 'text-hide': showUpload }" v-if="!uploadImg">
|
|
|
<div
|
|
|
@click="
|
|
|
@@ -23,7 +31,7 @@
|
|
|
<img src="@/assets/document/4.svg" class="img-hover" v-if="!showUpload" />
|
|
|
<img src="@/assets/document/5.svg" class="img-active" v-if="showUpload" />
|
|
|
</div>
|
|
|
- <p>已选择 0/0 个文档</p>
|
|
|
+ <p>已选择 {{ selectedKeys.length }}/{{ tableData.length }} 个文档</p>
|
|
|
</div>
|
|
|
<div class="text-narrow" v-else>
|
|
|
<div
|
|
|
@@ -80,7 +88,7 @@
|
|
|
<div v-if="!uploadImg">
|
|
|
<p>
|
|
|
<span>已解析文件列表</span>
|
|
|
- <span>共0个</span>
|
|
|
+ <span>共{{ tableData.length }}个</span>
|
|
|
</p>
|
|
|
<div>
|
|
|
<a-table
|
|
|
@@ -92,15 +100,60 @@
|
|
|
v-model:selectedKeys="selectedKeys"
|
|
|
>
|
|
|
<template #methods="{ record }">
|
|
|
- <a-button @click="$modal.info({ title: 'Name', content: record.name })"
|
|
|
- >删除</a-button
|
|
|
- >
|
|
|
+ <a-tooltip content="下载">
|
|
|
+ <div class="method-button" @click="downloadDocument(record)">
|
|
|
+ <icon-cloud-download />
|
|
|
+ </div>
|
|
|
+ </a-tooltip>
|
|
|
+ <a-popover :popup-visible="showDeleteTooltip && deleteId === record.key">
|
|
|
+ <a-tooltip content="删除">
|
|
|
+ <div class="method-button" @click="handleDeleteButton(record.key)">
|
|
|
+ <icon-delete />
|
|
|
+ </div>
|
|
|
+ </a-tooltip>
|
|
|
+ <template #content>
|
|
|
+ <div>
|
|
|
+ <p>删除后无法恢复，您是否删除？</p>
|
|
|
+ <div class="delete-buttons">
|
|
|
+ <div>
|
|
|
+ <a-button
|
|
|
+ size="mini"
|
|
|
+ type="primary"
|
|
|
+ style="margin-right: 10px"
|
|
|
+ @click="deleteDocument"
|
|
|
+ >确认</a-button
|
|
|
+ >
|
|
|
+ <a-button
|
|
|
+ size="mini"
|
|
|
+ type="outline"
|
|
|
+ @click="
|
|
|
+ () => {
|
|
|
+ showDeleteTooltip = false;
|
|
|
+ }
|
|
|
+ "
|
|
|
+ >取消</a-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </a-popover>
|
|
|
</template>
|
|
|
</a-table>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="bottom-buttons">
|
|
|
+ <div>
|
|
|
+ <a-button type="outline" style="margin-right: 10px" @click="selectFiles(false)"
|
|
|
+ >取消</a-button
|
|
|
+ >
|
|
|
+ <a-button type="primary" @click="selectFiles(true)"
|
|
|
+ >去提问({{ selectedKeys.length }})</a-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</a-popover>
|
|
|
<section v-if="hasSlider">
|
|
|
@@ -119,6 +172,18 @@ export default defineComponent({
|
|
|
const { helper } = inject("$global");
|
|
|
const maxSize = 30 * 1024 * 1024;
|
|
|
const fileList = [];
|
|
|
+ const showDeleteTooltip = ref(false);
|
|
|
+ const deleteId = ref("");
|
|
|
+ const selectFiles = (isSelect) => {
|
|
|
+ if (!isSelect) {
|
|
|
+ selectedKeys.value = [];
|
|
|
+ }
|
|
|
+ showUpload.value = false;
|
|
|
+ };
|
|
|
+ const handleDeleteButton = (id) => {
|
|
|
+ showDeleteTooltip.value = true;
|
|
|
+ deleteId.value = id;
|
|
|
+ };
|
|
|
const onBeforeUpload = (file) => {
|
|
|
if (file.size > maxSize) {
|
|
|
helper.message("error", `上传文件大小不能超过10M`);
|
|
|
@@ -142,7 +207,7 @@ export default defineComponent({
|
|
|
fileList = fileList.filter((item) => item.id !== data.uid);
|
|
|
return true;
|
|
|
};
|
|
|
- const selectedKeys = ref(["Jane Doe", "Alisa Ross"]);
|
|
|
+ const selectedKeys = ref([]);
|
|
|
|
|
|
const rowSelection = reactive({
|
|
|
type: "checkbox",
|
|
|
@@ -195,6 +260,8 @@ export default defineComponent({
|
|
|
time: "2024.9.8"
|
|
|
}
|
|
|
]);
|
|
|
+ const downloadDocument = (record) => {};
|
|
|
+ const deleteDocument = () => {};
|
|
|
return {
|
|
|
selectedKeys,
|
|
|
getAssetURL: helper.getAssetURL,
|
|
|
@@ -205,12 +272,39 @@ export default defineComponent({
|
|
|
customRequest,
|
|
|
columns,
|
|
|
tableData,
|
|
|
- rowSelection
|
|
|
+ rowSelection,
|
|
|
+ downloadDocument,
|
|
|
+ deleteDocument,
|
|
|
+ showDeleteTooltip,
|
|
|
+ deleteId,
|
|
|
+ handleDeleteButton,
|
|
|
+ selectFiles
|
|
|
};
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
+.bottom-buttons {
|
|
|
+ display: flex;
|
|
|
+ justify-content: right;
|
|
|
+ > div {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+}
|
|
|
+.delete-buttons {
|
|
|
+ margin-top: 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.method-button {
|
|
|
+ display: inline-block;
|
|
|
+ padding: 4px 8px;
|
|
|
+ border-radius: 5px;
|
|
|
+ cursor: pointer;
|
|
|
+ &:hover {
|
|
|
+ background: rgba(150, 171, 185, 0.2);
|
|
|
+ }
|
|
|
+}
|
|
|
.upload-main {
|
|
|
width: 800px;
|
|
|
height: 109px;
|
zhangnuoyan