mirror of
https://github.com/kuaifan/dootask.git
synced 2025-12-12 03:01:12 +00:00
perf: 优化工作报告前端
This commit is contained in:
parent
1263603c7b
commit
c53db63cc7
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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(() => {
|
||||
//
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -33,6 +33,12 @@ export default {
|
||||
methods: {
|
||||
saveSuccess(data) {
|
||||
this.detail = data;
|
||||
if (this.$isSubElectron) {
|
||||
$A.Electron.sendMessage('sendForwardMain', {
|
||||
channel: 'reportSaveSuccess',
|
||||
data,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
136
resources/assets/sass/components/report.scss
vendored
136
resources/assets/sass/components/report.scss
vendored
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user