|
@@ -1,69 +1,74 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <!-- 重复任务详情弹窗 -->
|
|
|
- <el-drawer :visible.sync="Delay_to_open" :with-header="false" :size="'500px'" :before-close="handleClose" :custom-class="'drawer_details'">
|
|
|
- <div class="details_title">{{title}}</div>
|
|
|
- <div class="details_content" v-if="workDetailData" v-loading="loading">
|
|
|
- <ul>
|
|
|
- <li class="flex-box">
|
|
|
- <div class="label">任务内容</div>
|
|
|
- <div class="content_text">{{workDetailData.name}}</div>
|
|
|
- </li>
|
|
|
- <li class="flex-box">
|
|
|
- <div class="label">任务描述</div>
|
|
|
- <div class="content_text">{{workDetailData.remark}}</div>
|
|
|
- </li>
|
|
|
- <li class="flex-box" v-if="workDetailData">
|
|
|
- <div class="label">执行周期</div>
|
|
|
- <div class="content_text">{{workDetailData.task_expire_day}}{{workDetailData.task_cycle == 1?'天':workDetailData.task_cycle == 2?'周':'月'}}</div>
|
|
|
- </li>
|
|
|
- <li class="flex-box" v-if="workDetailData.point_config">
|
|
|
- <div class="label">任务积分</div>
|
|
|
- <div class="content_text">{{workDetailData.point_config.base_point}} <span>{{workDetailData.pt_id == 2 ? 'A分' : workDetailData.pt_id == 3 ? 'B分' : ''}}</span> </div>
|
|
|
- </li>
|
|
|
- <li class="flex-box" v-if="workDetailData.file_list && workDetailData.file_list.length > 0">
|
|
|
- <div class="label">附件</div>
|
|
|
- <div class="content_text">
|
|
|
- <el-image
|
|
|
- v-for="(item, index) in workDetailData.file_list"
|
|
|
- :key="index"
|
|
|
- style="width: 100px; height: 100px;margin-right:8px"
|
|
|
- :src="item"
|
|
|
- :preview-src-list="workDetailData.file_list"
|
|
|
- ></el-image>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li class="flex-box">
|
|
|
- <div class="label">发布人</div>
|
|
|
- <div class="content_text">{{workDetailData.owner_name}}</div>
|
|
|
- </li>
|
|
|
- <li class="flex-box">
|
|
|
- <div class="label">创建时间</div>
|
|
|
- <div class="content_text">{{workDetailData.create_time}}</div>
|
|
|
- </li>
|
|
|
- <li class="flex-box">
|
|
|
- <div class="label">截止时间</div>
|
|
|
- <div class="content_text">
|
|
|
- <span v-if="workDetailData.task_cycle == '1'">每天{{dayTime(workDetailData.task_cycle_value)}}截止</span>
|
|
|
- <span v-if="workDetailData.task_cycle == '2'">
|
|
|
- <span>每周{{weekList[workDetailData.task_cycle_value - 1]}}截止</span>
|
|
|
- </span>
|
|
|
- <span v-if="workDetailData.task_cycle == '3'">每月{{workDetailData.task_cycle_value}}号截止</span>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
-
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="scope.row.task_cycle == '1'">每天0点自动发布,{{dayTime(scope.row.task_cycle_value)}}截止</span>
|
|
|
- <span v-if="scope.row.task_cycle == '2'">
|
|
|
- <span>每周一自动发布,周{{weekList[scope.row.task_cycle_value - 1]}}截止</span>
|
|
|
- </span>
|
|
|
- <span v-if="scope.row.task_cycle == '3'">每月1号自动发布,{{scope.row.task_cycle_value}}号截止</span>
|
|
|
- </template>
|
|
|
- <li class="flex-box" v-if="workDetailData.point_config && workDetailData.point_config.ahead_award_point">
|
|
|
+ <div>
|
|
|
+ <!-- 重复任务详情弹窗 -->
|
|
|
+ <el-drawer :visible.sync="Delay_to_open" :with-header="false" :size="'500px'" :before-close="handleClose" :custom-class="'drawer_details'">
|
|
|
+ <div class="details_title">{{ title }}</div>
|
|
|
+ <div class="details_content" v-if="workDetailData" v-loading="loading">
|
|
|
+ <ul>
|
|
|
+ <li class="flex-box">
|
|
|
+ <div class="label">任务内容</div>
|
|
|
+ <div class="content_text">{{ workDetailData.name }}</div>
|
|
|
+ </li>
|
|
|
+ <li class="flex-box">
|
|
|
+ <div class="label">任务描述</div>
|
|
|
+ <div class="content_text">{{ workDetailData.remark }}</div>
|
|
|
+ </li>
|
|
|
+ <li class="flex-box" v-if="workDetailData">
|
|
|
+ <div class="label">执行周期</div>
|
|
|
+ <div class="content_text">
|
|
|
+ {{ workDetailData.task_expire_day }}{{ workDetailData.task_cycle == 1 ? '天' : workDetailData.task_cycle == 2 ? '周' : '月' }}
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="flex-box" v-if="workDetailData.point_config">
|
|
|
+ <div class="label">任务积分</div>
|
|
|
+ <div class="content_text">
|
|
|
+ {{ workDetailData.point_config.base_point }}
|
|
|
+ <span>{{ workDetailData.pt_id == 2 ? 'A分' : workDetailData.pt_id == 3 ? 'B分' : '' }}</span>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="flex-box" v-if="workDetailData.file_list && workDetailData.file_list.length > 0">
|
|
|
+ <div class="label">附件</div>
|
|
|
+ <div class="content_text">
|
|
|
+ <el-image
|
|
|
+ v-for="(item, index) in workDetailData.file_list"
|
|
|
+ :key="index"
|
|
|
+ style="width: 100px; height: 100px;margin-right:8px"
|
|
|
+ :src="item"
|
|
|
+ :preview-src-list="workDetailData.file_list"
|
|
|
+ ></el-image>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="flex-box">
|
|
|
+ <div class="label">发布人</div>
|
|
|
+ <div class="content_text">{{ workDetailData.owner_name }}</div>
|
|
|
+ </li>
|
|
|
+ <li class="flex-box">
|
|
|
+ <div class="label">创建时间</div>
|
|
|
+ <div class="content_text">{{ workDetailData.create_time }}</div>
|
|
|
+ </li>
|
|
|
+ <li class="flex-box">
|
|
|
+ <div class="label">截止时间</div>
|
|
|
+ <div class="content_text">
|
|
|
+ <span v-if="workDetailData.task_cycle == '1'">每天{{ dayTime(workDetailData.task_cycle_value) }}截止</span>
|
|
|
+ <span v-if="workDetailData.task_cycle == '2'">
|
|
|
+ <span>每周{{ weekList[workDetailData.task_cycle_value - 1] }}截止</span>
|
|
|
+ </span>
|
|
|
+ <span v-if="workDetailData.task_cycle == '3'">每月{{ workDetailData.task_cycle_value }}号截止</span>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="scope.row.task_cycle == '1'">每天0点自动发布,{{ dayTime(scope.row.task_cycle_value) }}截止</span>
|
|
|
+ <span v-if="scope.row.task_cycle == '2'">
|
|
|
+ <span>每周一自动发布,周{{ weekList[scope.row.task_cycle_value - 1] }}截止</span>
|
|
|
+ </span>
|
|
|
+ <span v-if="scope.row.task_cycle == '3'">每月1号自动发布,{{ scope.row.task_cycle_value }}号截止</span>
|
|
|
+ </template>
|
|
|
+ <li class="flex-box" v-if="workDetailData.point_config && workDetailData.point_config.ahead_award_point">
|
|
|
<div class="label">提前奖分</div>
|
|
|
<div class="content_text">{{ workDetailData.point_config.ahead_award_point }}/天</div>
|
|
|
</li>
|
|
|
- <li class="flex-box" v-if="workDetailData.point_config && workDetailData.point_config.ahead_award_point_limit">
|
|
|
+ <li class="flex-box" v-if="workDetailData.point_config && workDetailData.point_config.ahead_award_point_limit">
|
|
|
<div class="label">奖分上限</div>
|
|
|
<div class="content_text">{{ workDetailData.point_config.ahead_award_point_limit }}</div>
|
|
|
</li>
|
|
@@ -96,155 +101,152 @@
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
- <el-row style=" margin-bottom: 20px;">
|
|
|
- <el-col :span="24" style="line-height: 30px;">审批人</el-col>
|
|
|
- <el-col :span="24">
|
|
|
- <div style="display:flex">
|
|
|
- <userImage :user_name="workDetailData.reviewer_name" width="50px" height="50px" style=" margin-right: 15px;" fontSize="1"></userImage>
|
|
|
- <p style="margin: 0; line-height: 50px;">{{workDetailData.reviewer_name}}</p>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row v-if="workDetailData.target_info">
|
|
|
- <el-col :span="24" style="line-height: 30px;">执行人</el-col>
|
|
|
- <el-col :span="24">
|
|
|
- <div v-for="(item,index) in workDetailData.target_info" :key="index" style="margin-bottom: 10px;display:flex;">
|
|
|
- <userImage :user_name="item.name" width="50px" height="50px" style=" margin-right: 15px;" fontSize="1"></userImage>
|
|
|
- <p style="margin: 0; line-height: 50px;">{{item.name}}</p>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- </el-drawer>
|
|
|
-
|
|
|
- </div>
|
|
|
+ <el-row style=" margin-bottom: 20px;">
|
|
|
+ <el-col :span="24" style="line-height: 30px;">审批人</el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <div style="display:flex">
|
|
|
+ <userImage :user_name="workDetailData.reviewer_name" width="50px" height="50px" style=" margin-right: 15px;" fontSize="1"></userImage>
|
|
|
+ <p style="margin: 0; line-height: 50px;">{{ workDetailData.reviewer_name }}</p>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row v-if="workDetailData.target_info">
|
|
|
+ <el-col :span="24" style="line-height: 30px;">执行人</el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <div v-for="(item, index) in workDetailData.target_info" :key="index" style="margin-bottom: 10px;display:flex;">
|
|
|
+ <userImage :user_name="item.name" width="50px" height="50px" style=" margin-right: 15px;" fontSize="1"></userImage>
|
|
|
+ <p style="margin: 0; line-height: 50px;">{{ item.name }}</p>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- export default {
|
|
|
- name: 'repeatTaskDetailsPopup',
|
|
|
- props:{
|
|
|
- title: {
|
|
|
- type: String,
|
|
|
- default: ''
|
|
|
- },
|
|
|
- visible: {
|
|
|
- type: Boolean,
|
|
|
- default: false
|
|
|
- },
|
|
|
- id: {
|
|
|
- type: Number,
|
|
|
- default: 0
|
|
|
- },
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- Delay_to_open:false,//打开抽屉
|
|
|
-
|
|
|
- loading: false,
|
|
|
- workDetailData:{},
|
|
|
- weekList: ['一', '二', '三', '四', '五', '六', '日'],
|
|
|
- }
|
|
|
- },
|
|
|
- components: {},
|
|
|
- watch:{},
|
|
|
- mounted() {
|
|
|
- this.getData()
|
|
|
- this.Delay_to_open = this.visible//更换打开抽屉时机,避免打开两次
|
|
|
- },
|
|
|
- methods: {
|
|
|
- dayTime(item){
|
|
|
- return item > 9 ? item + ': 00' : '0' + item + ': 00'
|
|
|
- },
|
|
|
- // 关闭弹窗
|
|
|
- handleClose(){
|
|
|
- this.$emit('update:visible', false)
|
|
|
- },
|
|
|
- // 获取数据
|
|
|
- getData(){
|
|
|
- let self = this
|
|
|
- self.loading = true
|
|
|
- let data = {schedule_id: this.id}
|
|
|
- self.$axios('get','/api/integral/schedule',data
|
|
|
- ).then(res => {
|
|
|
+export default {
|
|
|
+ name: 'repeatTaskDetailsPopup',
|
|
|
+ props: {
|
|
|
+ title: {
|
|
|
+ type: String,
|
|
|
+ default: ''
|
|
|
+ },
|
|
|
+ visible: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
+ },
|
|
|
+ id: {
|
|
|
+ type: Number,
|
|
|
+ default: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ Delay_to_open: false, //打开抽屉
|
|
|
+
|
|
|
+ loading: false,
|
|
|
+ workDetailData: {},
|
|
|
+ weekList: ['一', '二', '三', '四', '五', '六', '日']
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getData();
|
|
|
+ this.Delay_to_open = this.visible; //更换打开抽屉时机,避免打开两次
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ dayTime(item) {
|
|
|
+ return item > 9 ? item + ': 00' : '0' + item + ': 00';
|
|
|
+ },
|
|
|
+ // 关闭弹窗
|
|
|
+ handleClose() {
|
|
|
+ this.$emit('update:visible', false);
|
|
|
+ },
|
|
|
+ // 获取数据
|
|
|
+ getData() {
|
|
|
+ let self = this;
|
|
|
+ self.loading = true;
|
|
|
+ let data = { schedule_id: this.id };
|
|
|
+ self.$axios('get', '/api/integral/schedule', data)
|
|
|
+ .then(res => {
|
|
|
if (res.data.code == 1) {
|
|
|
- self.workDetailData = res.data.data
|
|
|
- }
|
|
|
- self.loading = false
|
|
|
- }).finally(()=>{
|
|
|
- self.loading = false
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ self.workDetailData = res.data.data;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ self.loading = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang="scss" scoped="scoped">
|
|
|
- .details_content{
|
|
|
- & .d_userMessage{
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
- & .d_userMessage div:nth-child(1){
|
|
|
- font-size: 16px;
|
|
|
- margin-bottom: 8px;
|
|
|
- }
|
|
|
- & .d_userMessage div:nth-child(2){
|
|
|
- font-size: 12px;
|
|
|
- color: #909399;
|
|
|
- }
|
|
|
- & .d_progress{
|
|
|
- padding: 12px 0;
|
|
|
- border-bottom: 1px solid #f1f1f1;
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
- & ul{
|
|
|
- padding: 12px 0;
|
|
|
- border-bottom: 1px solid #f1f1f1;
|
|
|
- & li{
|
|
|
- padding: 6px 0;
|
|
|
- }
|
|
|
- & .label{
|
|
|
- width: 80px;
|
|
|
- text-align: left;
|
|
|
- color: #909399;
|
|
|
- }
|
|
|
- & .content_text{
|
|
|
- flex:1
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .fontColorF{
|
|
|
- color:#909399;
|
|
|
- }
|
|
|
- .details_content {
|
|
|
- padding: 20px;
|
|
|
- height: calc(100vh - 60px);
|
|
|
- overflow: auto;
|
|
|
- .row_title {
|
|
|
- position: relative;
|
|
|
- margin: 0 0 20px 0;
|
|
|
- padding-top: 12px;
|
|
|
- font-size: 16px;
|
|
|
- color: #303133;
|
|
|
- line-height: 22px;
|
|
|
- }
|
|
|
- .row_title:before {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- content: ' ';
|
|
|
- width: 100%;
|
|
|
- border-top: 1px #f8f8f8 solid;
|
|
|
- }
|
|
|
- .el-row {
|
|
|
- margin-bottom: 10px;
|
|
|
- font-size: 14px;
|
|
|
- .el-col-4 {
|
|
|
- color: #606266;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .details_title {
|
|
|
- font-size: 18px;
|
|
|
- padding: 20px;
|
|
|
- border-bottom: 1px #efefef solid;
|
|
|
- }
|
|
|
+.details_content {
|
|
|
+ & .d_userMessage {
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ & .d_userMessage div:nth-child(1) {
|
|
|
+ font-size: 16px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+ & .d_userMessage div:nth-child(2) {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #909399;
|
|
|
+ }
|
|
|
+ & .d_progress {
|
|
|
+ padding: 12px 0;
|
|
|
+ border-bottom: 1px solid #f1f1f1;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+ & ul {
|
|
|
+ padding: 12px 0;
|
|
|
+ border-bottom: 1px solid #f1f1f1;
|
|
|
+ & li {
|
|
|
+ padding: 6px 0;
|
|
|
+ }
|
|
|
+ & .label {
|
|
|
+ width: 80px;
|
|
|
+ text-align: left;
|
|
|
+ color: #909399;
|
|
|
+ }
|
|
|
+ & .content_text {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.fontColorF {
|
|
|
+ color: #909399;
|
|
|
+}
|
|
|
+.details_content {
|
|
|
+ padding: 20px;
|
|
|
+ height: calc(100vh - 60px);
|
|
|
+ overflow: auto;
|
|
|
+ .row_title {
|
|
|
+ position: relative;
|
|
|
+ margin: 0 0 20px 0;
|
|
|
+ padding-top: 12px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #303133;
|
|
|
+ line-height: 22px;
|
|
|
+ }
|
|
|
+ .row_title:before {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ content: ' ';
|
|
|
+ width: 100%;
|
|
|
+ border-top: 1px #f8f8f8 solid;
|
|
|
+ }
|
|
|
+ .el-row {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ font-size: 14px;
|
|
|
+ .el-col-4 {
|
|
|
+ color: #606266;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.details_title {
|
|
|
+ font-size: 18px;
|
|
|
+ padding: 20px;
|
|
|
+ border-bottom: 1px #efefef solid;
|
|
|
+}
|
|
|
</style>
|