perf: 优化工作报告前端

This commit is contained in:
kuaifan 2022-03-16 15:46:47 +08:00
parent 1263603c7b
commit c53db63cc7
6 changed files with 140 additions and 218 deletions

View File

@ -849,6 +849,10 @@ export default {
this.addTaskShow = true;
},
openTask(task) {
this.$store.dispatch("openTask", task)
},
addDialogMsg(data) {
if (!this.natificationReady) {
return;
@ -893,7 +897,7 @@ export default {
taskVisibleChange(visible) {
if (!visible) {
this.$store.dispatch('openTask', 0)
this.openTask(0)
}
},
@ -1026,10 +1030,6 @@ export default {
}
document.addEventListener(visibilityChangeEvent, visibilityChangeListener);
},
openTask(task) {
this.$store.dispatch("openTask", task)
},
}
}
</script>

View File

@ -2,10 +2,10 @@
<div class="report">
<Tabs v-model="reportTabs">
<TabPane :label="$L('我的汇报')" name="my">
<ReportMy ref="report" v-if="reportTabs === 'my'" @on-view="onView" @on-edit="onEditReport"></ReportMy>
<ReportMy ref="report" v-if="reportTabs === 'my'" @on-view="onView" @on-edit="onEditReport"/>
</TabPane>
<TabPane :label="tabRebder(reportUnreadNumber)" name="receive">
<ReportReceive v-if="reportTabs === 'receive'" @on-view="onView"></ReportReceive>
<ReportReceive v-if="reportTabs === 'receive'" @on-view="onView"/>
</TabPane>
</Tabs>
<DrawerOverlay
@ -61,6 +61,10 @@ export default {
mounted() {
this.reportTabs = this.reportType;
//
if (this.$isMainElectron) {
this.$Electron.registerMsgListener('reportSaveSuccess', this.saveSuccess)
}
},
methods: {
@ -135,7 +139,3 @@ export default {
}
}
</script>
<style scoped>
</style>

View File

@ -2,50 +2,22 @@
<div class="report-detail">
<div class="report-title">{{ data.title }}</div>
<div class="report-detail-context">
<div class="report-profile">
<Row>
<Col span="2">
<div class="report-submitter">
<p>{{ $L('汇报人') }}</p>
</div>
</Col>
<Col span="6">
<div class="report-submitter">
<Form class="report-form" label-width="auto" inline>
<FormItem :label="$L('汇报人')">
<UserAvatar :userid="data.userid" :size="28"/>
</div>
</Col>
<Col span="2">
<div class="report-submitter">
<p>{{ $L('提交时间') }}</p>
</div>
</Col>
<Col span="6">
<div class="report-submitter">
<div>{{ data.created_at }}</div>
</div>
</Col>
<Col span="2">
<div class="report-submitter">
<p>{{ $L('汇报对象') }}</p>
</div>
</Col>
<Col span="6">
<div class="report-submitter">
</FormItem>
<FormItem :label="$L('提交时间')">
{{ data.created_at }}
</FormItem>
<FormItem :label="$L('汇报对象')">
<UserAvatar v-for="(item, key) in data.receives_user" :key="key" :userid="item.userid" :size="28"/>
</div>
</Col>
</Row>
</div>
<Row class="report-main">
<Col span="2">
<div class="report-submitter">
<p>{{ $L('汇报内容') }}</p>
</div>
</Col>
<Col span="22">
</FormItem>
</Form>
<Form class="report-form" label-width="auto">
<FormItem :label="$L('汇报内容')">
<div class="report-content" v-html="data.content"></div>
</Col>
</Row>
</FormItem>
</Form>
</div>
</div>
</template>
@ -58,12 +30,12 @@ export default {
default: {},
}
},
mounted() {
if (this.data.id > 0) this.sendRead();
},
watch: {
data() {
if (this.data.id > 0) this.sendRead();
'data.id': {
handler(id) {
if (id > 0) this.sendRead();
},
immediate: true
},
},
methods: {
@ -73,11 +45,10 @@ export default {
data: {
ids: [this.data.id]
},
}).then(({data, msg}) => {
// data
// msg
}).catch(({msg}) => {
// msg
}).then(() => {
//
}).catch(() => {
//
});
},
}

View File

@ -1,70 +1,51 @@
<template>
<Form class="report-box" label-position="top" @submit.native.prevent>
<Row class="report-row">
<Col span="2">
<p class="report-titles">{{ $L("汇报类型") }}</p>
</Col>
<Col span="12">
<RadioGroup type="button" button-style="solid" v-model="reportData.type" @on-change="typeChange" class="report-radiogroup" :readonly="id > 0">
<Form class="report-edit" label-width="auto" @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 class="report-buttongroup" v-if="id === 0">
<ETooltip class="report-poptip" :content="prevCycleText" placement="bottom">
<ButtonGroup v-if="id === 0" class="report-buttongroup">
<ETooltip :content="prevCycleText" placement="bottom">
<Button type="primary" @click="prevCycle">
<Icon type="ios-arrow-back" />
</Button>
</ETooltip>
<div class="report-buttongroup-vertical"></div>
<ETooltip class="report-poptip" :disabled="reportData.offset >= 0" :content="nextCycleText" placement="bottom">
<ETooltip :disabled="reportData.offset >= 0" :content="nextCycleText" placement="bottom">
<Button type="primary" @click="nextCycle" :disabled="reportData.offset >= 0">
<Icon type="ios-arrow-forward" />
</Button>
</ETooltip>
</ButtonGroup>
</Col>
</Row>
<Row class="report-row">
<Col span="2">
<p class="report-titles">{{ $L("汇报名称") }}</p>
</Col>
<Col span="22">
</FormItem>
<FormItem :label="$L('汇报名称')">
<Input v-model="reportData.title" disabled/>
</Col>
</Row>
<Row class="report-row">
<Col span="2">
<p class="report-titles">{{ $L("汇报对象") }}</p>
</Col>
<Col span="22">
</FormItem>
<FormItem :label="$L('汇报对象')">
<div class="report-users">
<UserInput
v-model="reportData.receive"
:disabledChoice="[userId]"
:placeholder="$L('选择接收人')"
:transfer="false"/>
<a class="report-row-a" href="javascript:void(0);" @click="getLastSubmitter">
<Icon class="report-row-a-icon" type="ios-share-outline" />{{ $L("使用我上次的汇报对象") }}
<a class="report-user-link" href="javascript:void(0);" @click="getLastSubmitter">
<Icon type="ios-share-outline" />{{ $L("使用我上次的汇报对象") }}
</a>
</div>
</Col>
</Row>
<Row class="report-row report-row-content">
<Col span="2">
<p class="report-titles">{{ $L("汇报内容") }}</p>
</Col>
<Col span="22">
<FormItem class="report-row-content-editor">
</FormItem>
<FormItem :label="$L('汇报内容')" class="report-content-editor">
<TEditor v-model="reportData.content" height="100%"/>
</FormItem>
</Col>
</Row>
<Row class="report-row report-row-foot">
<Col span="2"></Col>
<Col span="4">
<FormItem class="report-foot">
<Button type="primary" @click="handleSubmit" class="report-bottom">{{$L(id > 0 ? '修改' : '提交')}}</Button>
</Col>
</Row>
</FormItem>
</Form>
</template>

View File

@ -33,6 +33,12 @@ export default {
methods: {
saveSuccess(data) {
this.detail = data;
if (this.$isSubElectron) {
$A.Electron.sendMessage('sendForwardMain', {
channel: 'reportSaveSuccess',
data,
});
}
}
}
}

View File

@ -39,10 +39,6 @@
margin-top: -53px;
padding-top: 53px;
}
.ivu-tabs-tabpane {
}
}
}
@ -62,55 +58,30 @@
.report-detail-context {
flex: 1;
height: 0;
padding: 12px 0 12px 24px;
display: flex;
flex-direction: column;
height: 0;
.report-main {
flex: 1;
overflow: auto;
margin-top: 12px;
}
.report-submitter {
p {
.report-form {
display: flex;
margin-bottom: 12px;
.ivu-form-item {
flex: 1;
flex-shrink: 0;
.ivu-form-item-label {
padding-top: 8px;
opacity: 0.8;
}
}
}
.report-profile {
font-size: 14px;
padding-right: 24px;
}
.report-submitter {
display: flex;
flex-wrap: wrap;
height: 28px;
line-height: 28px;
p {
display: block;
width: 100%;
text-align: justify;
padding-right: 12px;
&:after {
content: '';
display: inline-block;
width: 100%;
.ivu-form-item-content {
line-height: 30px;
}
}
& > div {
margin-right: 8px;
}
}
.ivu-col {
margin-bottom: 12px;
}
.report-content {
@ -136,21 +107,21 @@
}
}
.report-box {
.report-edit {
display: flex;
flex-direction: column;
height: 100%;
padding: 24px;
.report-row-foot {
flex: 0 0 auto;
.ivu-input[disabled] {
color: #666666;
}
.report-row-content {
.report-content {
flex: 1 1 auto;
overflow-y: auto;
.report-row-content-editor {
.report-content-editor {
height: 100%;
.ivu-form-item-content {
@ -165,21 +136,6 @@
}
}
.report-row-foot {
margin-bottom: 0;
}
.report-titles {
line-height: 32px;
}
.report-poptip {
.ivu-tooltip-inner {
min-width: 60px !important;
font-size: 12px !important;
}
}
.report-users {
display: flex;
align-items: center;
@ -189,8 +145,14 @@
margin-right: 12px;
}
.report-row-a {
.report-user-link {
flex-shrink: 0;
> i {
font-size: 16px;
margin-right: 2px;
transform: rotate(-90deg);
}
}
}
@ -206,6 +168,10 @@
box-shadow: none !important;
border: none !important;
&.ivu-radio-wrapper-disabled {
color: #c6c6c6 !important;
}
&:before {
width: 0 !important;
}
@ -241,11 +207,13 @@
.report-buttongroup-vertical {
position: absolute;
left: 47px;
left: 50%;
width: 1px;
height: 23px;
background-color: #E5E5E5;
top: 5px;
height: 15px;
background-color: #e9e9e9;
top: 50%;
transform: translate(-50%, -50%);
z-index: 9;
}
.ivu-btn-primary {
@ -257,34 +225,30 @@
line-height: 34px;
&[disabled] {
color: #515A6E !important;
color: #c6c6c6 !important;
}
}
}
}
.report-row {
margin-bottom: 20px;
.report-row-a {
float: right;
line-height: 32px;
.report-row-a-icon {
transform: rotate(-90deg);
font-size: 16px;
margin-right: 2px;
}
}
.report-content-editor {
flex: 1;
.ivu-form-item-content {
display: flex;
height: 100%;
.teditor-wrapper {
display: flex;
flex: 1;
}
}
}
.report-foot {
margin-bottom: 0;
.report-bottom {
height: 38px;
line-height: 36px;
min-width: 120px;
}
.ivu-input[disabled] {
color: #666666;
}
}