mirror of
https://github.com/kuaifan/dootask.git
synced 2025-12-12 03:01:12 +00:00
326 lines
12 KiB
Vue
326 lines
12 KiB
Vue
<template>
|
||
<div class="report-edit-wrapper">
|
||
<Form class="report-edit" v-bind="formOptions" @submit.native.prevent>
|
||
<FormItem :label="$L('汇报类型')">
|
||
<RadioGroup
|
||
type="button"
|
||
button-style="solid"
|
||
v-model="reportData.type"
|
||
@on-change="typeChange"
|
||
class="report-radiogroup"
|
||
:readonly="id > 0">
|
||
<Radio label="weekly" :disabled="id > 0 && reportData.type =='daily'">{{ $L("周报") }}</Radio>
|
||
<Radio label="daily" :disabled="id > 0 && reportData.type =='weekly'">{{ $L("日报") }}</Radio>
|
||
</RadioGroup>
|
||
<ButtonGroup v-if="id === 0" class="report-buttongroup">
|
||
<ETooltip :disabled="$isEEUIApp || windowTouch" :content="prevCycleText" placement="bottom">
|
||
<Button type="primary" @click="prevCycle">
|
||
<Icon type="ios-arrow-back" />
|
||
</Button>
|
||
</ETooltip>
|
||
<div class="report-buttongroup-vertical"></div>
|
||
<ETooltip :disabled="$isEEUIApp || windowTouch || reportData.offset >= 0" :content="nextCycleText" placement="bottom">
|
||
<Button type="primary" @click="nextCycle" :disabled="reportData.offset >= 0">
|
||
<Icon type="ios-arrow-forward" />
|
||
</Button>
|
||
</ETooltip>
|
||
</ButtonGroup>
|
||
</FormItem>
|
||
<FormItem :label="$L('汇报名称')">
|
||
<Input v-model="reportData.title" disabled/>
|
||
</FormItem>
|
||
<FormItem :label="$L('汇报对象')">
|
||
<div class="report-users">
|
||
<UserSelect v-model="reportData.receive" :disabledChoice="[userId]" :title="$L('选择接收人')"/>
|
||
<a class="report-user-link" href="javascript:void(0);" @click="getLastSubmitter">
|
||
<Icon v-if="receiveLoad > 0" type="ios-loading" class="icon-loading"/>
|
||
<Icon v-else type="ios-share-outline" />
|
||
{{ $L("使用我上次的汇报对象") }}
|
||
</a>
|
||
</div>
|
||
</FormItem>
|
||
<FormItem :label="$L('汇报内容')" class="report-content-editor">
|
||
<TEditor v-model="reportData.content" height="100%"/>
|
||
</FormItem>
|
||
<FormItem class="report-foot">
|
||
<div class="report-bottoms">
|
||
<Button type="primary" @click="handleSubmit" :loading="loadIng > 0" class="report-bottom">{{$L(id > 0 ? '修改' : '提交')}}</Button>
|
||
<Button
|
||
type="default"
|
||
class="report-bottom"
|
||
:loading="aiOrganizeLoading"
|
||
@click="onOrganize">
|
||
<Icon type="md-construct" />
|
||
{{ $L("AI 整理汇报") }}
|
||
</Button>
|
||
</div>
|
||
</FormItem>
|
||
</Form>
|
||
<Modal
|
||
v-model="organizePreviewVisible"
|
||
:title="$L('整理结果预览')"
|
||
:mask-closable="false"
|
||
:styles="{
|
||
width: '90%',
|
||
maxWidth: '800px'
|
||
}">
|
||
<div class="report-content organize-preview user-select-auto" v-html="organizeResult.html"></div>
|
||
<div slot="footer" class="adaption">
|
||
<Button type="default" @click="closeOrganizePreview">{{ $L("取消") }}</Button>
|
||
<Button type="primary" @click="applyOrganize" :loading="aiOrganizeLoading">{{ $L("应用到汇报") }}</Button>
|
||
</div>
|
||
</Modal>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import UserSelect from "../../../components/UserSelect.vue";
|
||
import {mapState} from "vuex";
|
||
|
||
const TEditor = () => import('../../../components/TEditor');
|
||
export default {
|
||
name: "ReportEdit",
|
||
components: {
|
||
UserSelect,
|
||
TEditor
|
||
},
|
||
props: {
|
||
id: {
|
||
default: 0,
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
loadIng: 0,
|
||
receiveLoad: 0,
|
||
aiOrganizeLoading: false,
|
||
organizePreviewVisible: false,
|
||
organizeResult: {
|
||
html: '',
|
||
model: '',
|
||
},
|
||
|
||
reportData: {
|
||
sign: "",
|
||
title: "",
|
||
content: "",
|
||
type: "weekly",
|
||
receive: [],
|
||
id: 0,
|
||
offset: 0 // 以当前日期为基础的周期偏移量。例如选择了上一周那么就是 -1，上一天同理。
|
||
},
|
||
prevCycleText: this.$L("上一周"),
|
||
nextCycleText: this.$L("下一周"),
|
||
};
|
||
},
|
||
watch: {
|
||
id: {
|
||
handler(val) {
|
||
if (val > 0) {
|
||
this.getDetail(val);
|
||
} else {
|
||
this.reportData.offset = 0;
|
||
this.reportData.type = "weekly";
|
||
this.reportData.receive = [];
|
||
this.getTemplate();
|
||
}
|
||
},
|
||
immediate: true
|
||
},
|
||
},
|
||
computed: {
|
||
...mapState(['formOptions']),
|
||
},
|
||
methods: {
|
||
handleSubmit() {
|
||
if (this.id === 0 && this.reportData.id > 0) {
|
||
$A.modalConfirm({
|
||
title: '覆盖提交',
|
||
content: '你已提交过此日期的报告，是否覆盖提交？',
|
||
onOk: () => {
|
||
this.doSubmit();
|
||
}
|
||
});
|
||
} else {
|
||
this.doSubmit();
|
||
}
|
||
},
|
||
|
||
doSubmit() {
|
||
this.loadIng++;
|
||
this.$store.dispatch("call", {
|
||
url: 'report/store',
|
||
data: this.reportData,
|
||
method: 'post',
|
||
}).then(({data, msg}) => {
|
||
// data 结果数据
|
||
this.reportData.offset = 0;
|
||
this.reportData.type = "weekly";
|
||
this.reportData.receive = [];
|
||
this.getTemplate();
|
||
// msg 结果描述
|
||
!this.$isSubElectron && $A.messageSuccess(msg);
|
||
this.$emit("saveSuccess", {data, msg});
|
||
}).catch(({msg}) => {
|
||
// msg 错误原因
|
||
$A.messageError(msg);
|
||
}).finally(_ => {
|
||
this.loadIng--;
|
||
});
|
||
},
|
||
|
||
getTemplate() {
|
||
this.loadIng++;
|
||
this.$store.dispatch("call", {
|
||
url: 'report/template',
|
||
data: {
|
||
type: this.reportData.type,
|
||
offset: this.reportData.offset,
|
||
id: this.id
|
||
},
|
||
}).then(({data}) => {
|
||
// data 结果数据
|
||
if (data.id) {
|
||
this.reportData.id = data.id;
|
||
if (this.id > 0) {
|
||
this.getDetail(data.id);
|
||
} else {
|
||
this.reportData.sign = data.sign;
|
||
this.reportData.title = data.title;
|
||
this.reportData.content = data.content;
|
||
}
|
||
} else {
|
||
this.reportData.id = 0;
|
||
this.reportData.sign = data.sign;
|
||
this.reportData.title = data.title;
|
||
this.reportData.content = data.content;
|
||
}
|
||
}).catch(({msg}) => {
|
||
// msg 错误原因
|
||
$A.messageError(msg);
|
||
}).finally(_ => {
|
||
this.loadIng--;
|
||
});
|
||
},
|
||
|
||
typeChange(value) {
|
||
// 切换汇报类型后偏移量归零
|
||
this.reportData.offset = 0;
|
||
if (value === "weekly") {
|
||
this.prevCycleText = this.$L("上一周");
|
||
this.nextCycleText = this.$L("下一周");
|
||
} else {
|
||
this.prevCycleText = this.$L("前一天");
|
||
this.nextCycleText = this.$L("后一天");
|
||
}
|
||
this.getTemplate();
|
||
},
|
||
|
||
getDetail(reportId) {
|
||
this.$store.dispatch("call", {
|
||
url: 'report/detail',
|
||
data: {
|
||
id: reportId
|
||
},
|
||
}).then(({data}) => {
|
||
// data 结果数据
|
||
this.reportData.title = data.title;
|
||
this.reportData.content = data.content;
|
||
this.reportData.receive = data.receives_user.map(({userid}) => userid);
|
||
this.reportData.type = data.type_val;
|
||
this.reportData.id = reportId;
|
||
}).catch(({msg}) => {
|
||
// msg 错误原因
|
||
$A.messageError(msg);
|
||
});
|
||
},
|
||
|
||
prevCycle() {
|
||
this.reportData.offset -= 1;
|
||
this.reReportData();
|
||
this.getTemplate();
|
||
},
|
||
|
||
nextCycle() {
|
||
// 周期偏移量不允许大于0
|
||
if (this.reportData.offset < 0) {
|
||
this.reportData.offset += 1;
|
||
}
|
||
this.reReportData();
|
||
this.getTemplate();
|
||
},
|
||
|
||
// 获取上一次接收人
|
||
getLastSubmitter() {
|
||
setTimeout(_ => {
|
||
this.receiveLoad++;
|
||
}, 300)
|
||
this.$store.dispatch("call", {
|
||
url: 'report/last_submitter',
|
||
}).then(({data}) => {
|
||
this.reportData.receive = data;
|
||
if (data.length === 0) {
|
||
$A.messageWarning("没有上次的汇报对象");
|
||
}
|
||
}).catch(({msg}) => {
|
||
$A.messageError(msg);
|
||
}).finally(_ => {
|
||
this.receiveLoad--;
|
||
});
|
||
},
|
||
|
||
reReportData() {
|
||
this.reportData.title = "";
|
||
this.reportData.content = "";
|
||
this.reportData.receive = [];
|
||
this.reportData.id = 0;
|
||
},
|
||
|
||
onOrganize() {
|
||
if (!this.reportData.content || !this.reportData.content.trim()) {
|
||
$A.messageWarning("请先填写汇报内容");
|
||
return;
|
||
}
|
||
if (this.aiOrganizeLoading) {
|
||
return;
|
||
}
|
||
this.aiOrganizeLoading = true;
|
||
this.$store.dispatch("call", {
|
||
url: 'report/ai_organize',
|
||
method: 'post',
|
||
data: {
|
||
content: this.reportData.content,
|
||
title: this.reportData.title,
|
||
type: this.reportData.type,
|
||
},
|
||
timeout: 60 * 1000,
|
||
}).then(({data}) => {
|
||
this.organizeResult = data || {html: '', model: ''};
|
||
if (!this.organizeResult.html) {
|
||
$A.messageWarning("AI 未返回整理内容");
|
||
return;
|
||
}
|
||
this.organizePreviewVisible = true;
|
||
}).catch(({msg}) => {
|
||
$A.messageError(msg);
|
||
}).finally(() => {
|
||
this.aiOrganizeLoading = false;
|
||
});
|
||
},
|
||
|
||
closeOrganizePreview() {
|
||
this.organizePreviewVisible = false;
|
||
},
|
||
|
||
applyOrganize() {
|
||
if (!this.organizeResult.html) {
|
||
$A.messageWarning("没有可应用的内容");
|
||
return;
|
||
}
|
||
this.reportData.content = this.organizeResult.html;
|
||
this.organizePreviewVisible = false;
|
||
$A.messageSuccess("已应用整理结果");
|
||
}
|
||
}
|
||
}
|
||
</script> |