|
|
@@ -1,6 +1,13 @@
|
|
|
<template>
|
|
|
<div v-loading="loading" class="box">
|
|
|
- <div style="margin-bottom: 10px">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ "
|
|
|
+ >
|
|
|
<el-button
|
|
|
:disabled="currentMailIndex === 0"
|
|
|
@click="handleChangeEail('10')"
|
|
|
@@ -17,6 +24,23 @@
|
|
|
<el-button @click="handleReply('40')">再次编辑</el-button>
|
|
|
<el-button @click="handleMove">移动</el-button>
|
|
|
<el-button @click="handleRemove">删除</el-button>
|
|
|
+ <el-tag
|
|
|
+ style="margin-left: 8px"
|
|
|
+ type="success"
|
|
|
+ closable
|
|
|
+ v-for="(tag, index) in mailTagList"
|
|
|
+ :key="index"
|
|
|
+ @close="tagClose(tag)"
|
|
|
+ >
|
|
|
+ {{ tag.name }}
|
|
|
+ </el-tag>
|
|
|
+ <el-tag
|
|
|
+ style="margin-left: 8px; cursor: pointer"
|
|
|
+ type="success"
|
|
|
+ @click="handleAddTag"
|
|
|
+ >
|
|
|
+ +
|
|
|
+ </el-tag>
|
|
|
</div>
|
|
|
<div class="top">
|
|
|
<div class="top-row">
|
|
|
@@ -128,11 +152,40 @@
|
|
|
</el-button>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ title="添加标签"
|
|
|
+ v-model="tagDialog"
|
|
|
+ width="300px"
|
|
|
+ destroy-on-close
|
|
|
+ v-loading="submitLoading"
|
|
|
+ >
|
|
|
+ <byForm
|
|
|
+ :formConfig="tagFormConfig"
|
|
|
+ :formOption="formOption"
|
|
|
+ v-model="formData.tagData"
|
|
|
+ :rules="rules"
|
|
|
+ ref="tagForm"
|
|
|
+ >
|
|
|
+ </byForm>
|
|
|
+ <template #footer>
|
|
|
+ <el-button @click="tagDialog = false" size="large">取 消</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="submitTagForm()"
|
|
|
+ size="large"
|
|
|
+ :loading="submitLoading"
|
|
|
+ >
|
|
|
+ 确 定
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
import useMailStore from "@/store/modules/mail";
|
|
|
+import useUserStore from "@/store/modules/user";
|
|
|
import byForm from "@/components/byForm/index";
|
|
|
import { ElMessage, ElMessageBox } from "element-plus";
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
@@ -174,13 +227,35 @@ const myFolderFormConfig = computed(() => [
|
|
|
},
|
|
|
},
|
|
|
]);
|
|
|
+
|
|
|
const formData = reactive({
|
|
|
myFolderData: {},
|
|
|
+ tagData: {},
|
|
|
});
|
|
|
+
|
|
|
const rules = ref({
|
|
|
myFolderId: [{ required: true, message: "请选择文件夹", trigger: "change" }],
|
|
|
+ myTagId: [{ required: true, message: "请选择标签", trigger: "change" }],
|
|
|
});
|
|
|
|
|
|
+const allTagList = ref([]);
|
|
|
+const mailTagList = ref([]);
|
|
|
+const tagForm = ref(null);
|
|
|
+const tagDialog = ref(false);
|
|
|
+const tagFormConfig = computed(() => [
|
|
|
+ {
|
|
|
+ type: "select",
|
|
|
+ prop: "myTagId",
|
|
|
+ label: "标签名称",
|
|
|
+ disabled: false,
|
|
|
+ itemWidth: 100,
|
|
|
+ data: allTagList.value,
|
|
|
+ style: {
|
|
|
+ width: "100%",
|
|
|
+ },
|
|
|
+ },
|
|
|
+]);
|
|
|
+
|
|
|
const getMyFolderTree = (flag) => {
|
|
|
if (flag) {
|
|
|
setTimeout(() => {
|
|
|
@@ -245,14 +320,69 @@ const submitMyFolderForm = () => {
|
|
|
});
|
|
|
};
|
|
|
|
|
|
+const getAllTagData = () => {
|
|
|
+ proxy
|
|
|
+ .post("/myTag/page", {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 9999,
|
|
|
+ id: useUserStore().user.userId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ allTagList.value = res.rows;
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
const getMailTag = () => {
|
|
|
- // proxy
|
|
|
- // .post("/myTagMessage/getListByMessageId", {
|
|
|
- // id: mailStore.currentMenu.messageId,
|
|
|
- // })
|
|
|
- // .then((res) => {
|
|
|
- // console.log(res, "ada");
|
|
|
- // });
|
|
|
+ if (mailStore.currentMenu.messageId) {
|
|
|
+ proxy
|
|
|
+ .post("/myTag/getListByMessageId", {
|
|
|
+ id: mailStore.currentMenu.messageId,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ mailTagList.value = res;
|
|
|
+ });
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const tagClose = (tag) => {
|
|
|
+ proxy
|
|
|
+ .post("/myTagMessage/deleteTag", {
|
|
|
+ myTagId: tag.id,
|
|
|
+ messageId: mailStore.currentMenu.messageId,
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ ElMessage({
|
|
|
+ message: "操作成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ getMailTag();
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const handleAddTag = () => {
|
|
|
+ formData.tagData.messageId = mailStore.currentMenu.messageId;
|
|
|
+ formData.tagData.myTagId = "";
|
|
|
+ tagDialog.value = true;
|
|
|
+};
|
|
|
+
|
|
|
+const submitTagForm = () => {
|
|
|
+ tagForm.value.handleSubmit(() => {
|
|
|
+ submitLoading.value = true;
|
|
|
+ proxy.post("/myTagMessage/add", formData.tagData).then(
|
|
|
+ (res) => {
|
|
|
+ ElMessage({
|
|
|
+ message: `操作成功！`,
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ tagDialog.value = false;
|
|
|
+ submitLoading.value = false;
|
|
|
+ getMailTag();
|
|
|
+ },
|
|
|
+ (err) => {
|
|
|
+ submitLoading.value = false;
|
|
|
+ }
|
|
|
+ );
|
|
|
+ });
|
|
|
};
|
|
|
|
|
|
const getDetails = (messageId) => {
|
|
|
@@ -294,20 +424,6 @@ const showBodyText = (text) => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
-const init = () => {
|
|
|
- //实时更换索引
|
|
|
- if (mailStore.currentMenu.messageId) {
|
|
|
- mailStore.currentMailIndex = mailStore.mailDataList.findIndex(
|
|
|
- (x) => x.id === mailStore.currentMenu.messageId
|
|
|
- );
|
|
|
- }
|
|
|
- getDetails(mailStore.currentMenu.messageId);
|
|
|
-};
|
|
|
-
|
|
|
-onMounted(() => {
|
|
|
- // init();
|
|
|
-});
|
|
|
-
|
|
|
const handleReply = (pageType) => {
|
|
|
// pageType 10为回复 20为转发 30为全部回复 40为再次编辑 0为写信
|
|
|
let title = "";
|
|
|
@@ -398,8 +514,25 @@ const handleClickDownload = (file) => {
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
-getMyFolderTree(true);
|
|
|
-getMailTag();
|
|
|
+
|
|
|
+// onMounted(() => {
|
|
|
+// getMyFolderTree(true);
|
|
|
+// getAllTagData();
|
|
|
+// });
|
|
|
+
|
|
|
+const init = () => {
|
|
|
+ //实时更换索引
|
|
|
+ if (mailStore.currentMenu.messageId) {
|
|
|
+ mailStore.currentMailIndex = mailStore.mailDataList.findIndex(
|
|
|
+ (x) => x.id === mailStore.currentMenu.messageId
|
|
|
+ );
|
|
|
+ }
|
|
|
+ getDetails(mailStore.currentMenu.messageId);
|
|
|
+ getMailTag();
|
|
|
+ getMyFolderTree(true);
|
|
|
+ getAllTagData();
|
|
|
+};
|
|
|
+
|
|
|
defineExpose({
|
|
|
initFn: init,
|
|
|
});
|
cz