thoth-frontend-test/src/views/projectManage/taskList/taskViewDetails.vue

<template>
  <div>
    <div class="bgbugTa" style="background-color:#F2F3F6;display:flex;align-items: center;justify-content: center;">
      <el-container>
        <div v-if="isHeadShow" style="width:98%;margin:1% auto 0 auto;height:53px;background:rgba(255,255,255,1);border-radius:7px;color:#F56C6C;font-size:16px;display: flex;align-items: center;">
          <i class="el-icon-warning-outline" style="margin-left: 20px;" />
          <span style="margin-left: 4px;">请将排期事件里的排期填写完整，否则无法判断任务健康状态，健康状态会显示未知。</span>
        </div>
        <el-header class="bgborder bgborderButton" style=" margin: 1%; min-height:60px;display: flex; justify-content: space-between; align-items: center;">
          <div style="float: left;display: flex; justify-content: space-between; align-items: center;">
            <span :style="{ background: bgStyle, color:colorStyle } " class="timeStyle">
              {{ task_form.stageString }}
              <br>
              {{ task_form.lateMsg }}
            </span>
            <el-tooltip :disabled="task_form.name && task_form.name.length < 19 ? true : false" class="item" effect="dark" :content="task_form.name" placement="bottom">
              <span style="font-size:20px;font-family:MicrosoftYaHei;color:rgba(51,51,51,1);">任务 : {{ task_form.name | ellipsis }}</span>
            </el-tooltip>
            <el-dropdown trigger="click" placement="bottom" @command="handleCommand">
              <el-button size="mini" style="cursor: pointer;margin-left:15px">
                {{ task_form.statusString }}
                <i class="el-icon-arrow-down el-icon--right" />
              </el-button>
              <el-dropdown-menu slot="dropdown" align="center">
                <el-dropdown-item
                  v-for="item in taskStatus"
                  :key="item.value"
                  :command="{value:item.code,label:item.msg}"
                  :disabled="task_form.statusString === item.msg? true: false"
                >{{ item.msg }}</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
          <span style="float: right;">
            <el-button size="mini" @click="centerDialogVisible_task = true">删除任务</el-button>
            <el-dropdown trigger="click" placement="bottom" style="margin-left: 10px;">
              <el-button size="mini" type="primary">
                新建
                <i class="el-icon-arrow-down el-icon--right" />
              </el-button>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item @click.native="createReport(4, task_form)">新建Bug</el-dropdown-item>
                <el-dropdown-item @click.native="createReport(1, task_form)">新建提测报告</el-dropdown-item>
                <el-dropdown-item @click.native="createReport(2, task_form)">新建测试报告</el-dropdown-item>
                <el-dropdown-item @click.native="createReport(3, task_form)">新建准出报告</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </span>
        </el-header>
        <el-container>
          <el-aside class="bgborder" style="overflow: hidden; margin:0 1%;minWidth: 55%;">
            <div style="display:flex;align-items: center;margin-bottom:20px;margin: 20px 0 50px 20px;">
              <div style="width:4px;height:17px;background:#409EFF;border-radius:1px;" />
              <div style="width:83px;height:20px;font-size:16px;font-family:MicrosoftYaHei;color:rgba(51,59,74,1);margin-left:6px">数据统计</div>
            </div>
            <div style="display: flex; justify-content: space-between; align-items: center;">
              <span style="text-align: center; margin-left: 8%; border-right:1px solid #BBBBBB; padding-right: 8%;">
                <p style="width: 70px;">bug数量</p>
                <p style="font-size: 70px;">{{ totalCount }}</p>
                <p v-show="fixInFutureCount <= 0? false: true">
                  <span style="color: #F56C6C; width: 100px;">以后修复{{ fixInFutureCount }}个</span>
                </p>
              </span>
              <div id="div1" style="width:100%;height:300px;margin-bottom: 3%;" />
            </div>
          </el-aside>
          <el-container>
            <el-main class="bgborder form_e special-button" style="overflow: hidden;margin: 0 2.1% 0 0;min-height: 50vh;">
              <div style="display:flex;align-items: center;margin-bottom:20px;margin: 20px 0 0 20px;">
                <div style="width:4px;height:17px;background:#409EFF;border-radius:1px;" />
                <div style="width:83px;height:20px;font-size:16px;font-family:MicrosoftYaHei;color:rgba(51,59,74,1);margin-left:6px">基础信息</div>
              </div>
              <el-form label-position="left" label-width="150px" style="margin: 0 4%;font-size: 14px;color: rgb(102, 102, 102);" :model="task_form">
                <div style="text-align: right;">
                  <el-button size="mini" @click="open_created(task_form.describe)">修改</el-button>
                </div>
                <el-row :gutter="20">
                  <el-col :span="19">
                    <el-form-item label="所属项目：" style="word-break: break-all;">
                      <span v-show="task_form.projectName !== '无归属项目'" style="color: #409EFF;cursor: pointer;" @click="devUrl_tow(1, task_form.projectId)">{{ task_form.projectName }}</span>
                      <span v-show="task_form.projectName === '无归属项目'">{{ task_form.projectName }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-form-item label="所属需求：" label-width="150px">
                  <span v-show="task_form.requireName !== '无归属需求'" style="color: #409EFF;cursor: pointer;" @click="devUrl_tow(3, task_form.requireId)">{{ task_form.requireName }}</span>
                  <span v-show="task_form.requireName === '无归属需求'">{{ task_form.requireName }}</span>
                </el-form-item>
                <el-form-item label="模块：">{{ task_form.moduleInfoName }}</el-form-item>
                <el-form-item label="是否免测：">{{ task_form.noTestString }}</el-form-item>
                <el-form-item label="开发负责人：">{{ task_form.rdObject === null? '' : task_form.rdObject.name }}</el-form-item>
                <el-form-item label="测试负责人：">{{ task_form.qaObject === null? '' : task_form.qaObject.name }}</el-form-item>
                <el-form-item label="涉及的客户端：">{{ task_form.involveAppString }}</el-form-item>
                <el-form-item label="技术文档：" style="word-break: break-all;">
                  <span style="color: #409EFF;cursor: pointer;" @click="devUrl_tow(2, task_form.devUrl)">{{ task_form.devUrl }}</span>
                </el-form-item>
              </el-form>
            </el-main>
          </el-container>
        </el-container>
        <el-header class="bgborder" style="margin: 1%;height: auto; padding: 0;">
          <div style="display:flex;align-items: center;margin-bottom:20px;margin: 20px 0 20px 20px;">
            <div style="width:4px;height:17px;background:#409EFF;border-radius:1px;" />
            <div style="width:83px;height:20px;font-size:16px;font-family:MicrosoftYaHei;color:rgba(51,59,74,1);margin-left:6px">排期事件</div>
          </div>
          <div style="margin: 2% 20px; display: flex; align-items: center; justify-content: space-between;">
            <el-button size="mini" type="primary" plain icon="el-icon-plus" @click="add_Event">添加事件</el-button>
            <el-radio-group v-model="radio" size="mini" style="margin-left: 5%">
              <el-radio-button label="列表" @click.native="GanttChart(1)" />
              <el-radio-button label="甘特图" @click.native="GanttChart(2)" />
            </el-radio-group>
          </div>
          <div style=" margin: 0 20px; color: #333B4A;">
            <div v-show="Gantt" style="padding:0 46px">
              <gantt v-if="ganttData" :table-data="ganttData" string-type="事件" :versions="appVersion" />
            </div>
            <el-table v-show="table_show" :data="arr_event" style="width: 100%;" size="small" :header-cell-style="{ background: '#E9E9E9', color: '#333B4A' }" show-overflow-tooltip="true">
              <el-table-column label="事件类型" min-width="100" align="center">
                <template slot-scope="scope">{{ scope.row.name }}</template>
              </el-table-column>
              <el-table-column label="描述" min-width="200" align="center">
                <template slot-scope="scope">{{ scope.row.desc }}</template>
              </el-table-column>
              <el-table-column label="排期" min-width="200" align="center">
                <template slot-scope="scope">{{ scope.row.startTime | naspOut }} - {{ scope.row.endTime | naspOut }}</template>
              </el-table-column>
              <el-table-column label="人员" min-width="200" align="center">
                <template slot-scope="scope">
                  <div v-for="item of scope.row.peopleObject" :key="item.idapId">{{ item.name }}</div>
                </template>
              </el-table-column>
              <el-table-column label="操作" min-width="200">
                <template slot-scope="scope">
                  <el-button size="mini" type="primary" plain @click="event_query(scope.row.id)">编辑</el-button>
                  <el-button v-if="scope.row.canDelete === 1? false : true" size="mini" type="primary" plain @click="event_delete(scope.row.id)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
            <div class="dateSet">排期汇总：{{ tiem_date.startTime | naspOut }} ～ {{ tiem_date.endTime | naspOut }}</div>
            <div class="dateSet" style=" display: flex; justify-content: start; align-items: center;">
              <div style="flex:1">实际提测时间：{{ task_form.launchTestRealTime | naspOut }}</div>
              <div style="flex:1">实际准出时间：{{ task_form.testFinishRealTime | naspOut }}</div>
              <div style="flex:1">实际上线完成时间：{{ task_form.onlineRealTime | naspOut }}</div>
            </div>
            <div class="dateSet">预计上线版本：{{ task_form.preOnlineVersion }}</div>
          </div>
        </el-header>
        <el-footer class="footer" style=" height: auto;">
          <span style="text-align: right; margin: 1% 0 -3% 0;float:right;">
            <el-button size="mini" type="primary" plain icon="el-icon-plus" @click="createReport(4, task_form)">提Bug</el-button>
            <el-dropdown>
              <el-button size="mini" type="primary" plain>
                新建
                <i class="el-icon-arrow-down el-icon--right" />
              </el-button>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item @click.native="createReport(1, task_form)">新建提测报告</el-dropdown-item>
                <el-dropdown-item @click.native="createReport(2, task_form)">新建测试报告</el-dropdown-item>
                <el-dropdown-item @click.native="createReport(3, task_form)">新建准出报告</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </span>
          <el-tabs tab-position="top" @tab-click="click_launchTestInfoDOS">
            <el-tab-pane label="Bug" style="position: relative;">
              <div style="padding: 1.5% 0;font-family: MicrosoftYaHei;color: rgba(51,51,51,1);font-size: 14px;align-items: center;display: flex; justify-content: space-start; align-items: center;border-top: 1px solid #E9E9E9;">
                <span>快速筛选：</span>
                <span v-for="(item, code) of bugStatus" :key="code" class="status" @click="bug_list(item.code)">
                  <span :class="[item.code === codeCache ? 'selected' :'']">{{ item.msg }}</span>
                </span>
              </div>
              <el-table size="mini" :data="bugBaseInfoDOList" min-height="200" style="width: 100%; font-size: 14px; color:rgba(102,102,102,1);" show-overflow-tooltip="true" :default-sort="{prop: 'priorityCode'}" :header-cell-style="{ background: '#E9E9E9', color: '#333B4A', fontSize: '14px', fontWeight: '500',borderTop: '0.5px solid #EEF0F5'}">
                <el-table-column label="优先级" prop="priorityCode" sortable align="center">
                  <template slot-scope="scope">
                    <div class="div_priority" :style="{background: priorityColors[scope.row.priorityCode]}">{{ scope.row.priorityLevel | oneA }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="bugName" label="缺陷标题" min-width="180" align="left" show-overflow-tooltip>
                  <template slot-scope="scope">
                    <span style=" color: #A7AEBC; font-size; 12px;">{{ 'BUG-' + scope.row.id }}</span><br>
                    <span class="bugNameSty" @click.stop="click_bugName(scope.row.id)">{{ scope.row.bugName }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="bizName" label="业务线" align="center" />
                <el-table-column prop="priorityName" label="缺陷等级" align="center" />
                <el-table-column prop="bugStatusName" label="状态" align="center">
                  <template slot-scope="scope">
                    <div :style="{color: statusColors[scope.row.status]}">{{ scope.row.bugStatusName }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="creatorList" label="提报人" align="center" />
                <el-table-column prop="assignerList" label="责任人" align="center" />
                <el-table-column prop="currentHandlerList" label="修复人" align="center" />
                <el-table-column prop="gmtCreate" label="创建日期" align="center">
                  <template slot-scope="scope">
                    {{ scope.row.gmtCreate | naspOut }}
                  </template>
                </el-table-column>
              </el-table>
              <div style="display:flex;align-items: center;justify-content: flex-end;">
                <el-pagination background :current-page="currentPage" :page-sizes="[15, 20, 25]" :page-size="15" layout="total, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
              </div>
            </el-tab-pane>
            <el-tab-pane label="提测报告">
              <el-table :data="launchTestInfoDOS" size="small" :header-cell-style="{ background: '#E9E9E9', color: '#333B4A' }" show-overflow-tooltip="true">
                <el-table-column label="标题名称" min-width="100" align="center">
                  <template slot-scope="scope">
                    <a href="javascript:void(0)" style="color:#20a0ff" @click="toReportView(scope.row, 2)">{{ scope.row.name }}</a>
                  </template>
                </el-table-column>
                <el-table-column label="状态" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.statusString }}</template>
                </el-table-column>
                <el-table-column label="创建人" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.createrObject.name }}</template>
                </el-table-column>
                <el-table-column label="创建日期" min-width="200" align="center">
                  <template slot-scope="scope">{{ scope.row.gmtCreate }}</template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="300">
                  <template slot-scope="scope">
                    <div>
                      <el-button size="mini" type="primary" plain @click="pass(1,scope.row.id)">通过</el-button>
                      <el-button size="mini" type="danger" plain @click="back(2,scope.row.id)">打回</el-button>
                      <el-dialog title="打回原因" :visible.sync="dialog_launchTestInfoDOS" width="30%" :close-on-click-modal="false">
                        <el-input v-model="CallBackTheReason" type="textarea" :rows="3" />
                        <span slot="footer" class="dialog-footer">
                          <el-button type="primary" size="mini" @click="passOrBackSend()">确 定</el-button>
                          <el-button type="danger" size="mini" @click="dialog_launchTestInfoDOS = false">取 消</el-button>
                        </span>
                      </el-dialog>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
              <div align="right">
                <el-pagination background :current-page="currentPage" :page-sizes="[15, 20, 25]" :page-size="15" layout="total, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
              </div>
            </el-tab-pane>
            <el-tab-pane label="测试报告">
              <el-table :data="dailyTestReports" size="small" :header-cell-style="{ background: '#E9E9E9', color: '#333B4A' }" show-overflow-tooltip="true">
                <el-table-column label="标题名称" min-width="100" align="center">
                  <template slot-scope="scope">
                    <a href="javascript:void(0)" style="color:#20a0ff" @click="toReportView(scope.row, 0)">{{ scope.row.reportName }}</a>
                  </template>
                </el-table-column>
                <el-table-column label="状态" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.statusString }}</template>
                </el-table-column>
                <el-table-column label="创建人" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.createrObject.name }}</template>
                </el-table-column>
                <el-table-column label="创建日期" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.gmtCreate }}</template>
                </el-table-column>
              </el-table>
              <div align="right">
                <el-pagination background :current-page="currentPage" :page-sizes="[15, 20, 25]" :page-size="15" layout="total, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
              </div>
            </el-tab-pane>
            <el-tab-pane label="准出报告">
              <el-table :data="projectTestReportDOS" size="small" :header-cell-style="{ background: '#E9E9E9', color: '#333B4A' }" show-overflow-tooltip="true">
                <el-table-column label="标题名称" min-width="100" align="center">
                  <template slot-scope="scope">
                    <a href="javascript:void(0)" style="color:#20a0ff" @click="toReportView(scope.row, 1)">{{ scope.row.reportName }}</a>
                  </template>
                </el-table-column>
                <el-table-column label="状态" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.reportStatusString }}</template>
                </el-table-column>
                <el-table-column label="创建人" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.createrObject.name }}</template>
                </el-table-column>
                <el-table-column label="创建日期" min-width="100" align="center">
                  <template slot-scope="scope">{{ scope.row.gmtCreate }}</template>
                </el-table-column>
              </el-table>
              <div align="right">
                <el-pagination background :current-page="currentPage" :page-sizes="[15]" :page-size="15" layout="total, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
              </div>
            </el-tab-pane>
            <el-tab-pane label="评论">
              <p v-show="commentShow" style="color:#9B9B9B">还没有评论，快来评论吧！</p>
              <div v-for="(item, value) of commentTxt" :key="value" class="animated bounceInRight">
                <span style="color: #333B4A; font-size:14px;margin-left:1%;">{{ item.commentInfo.name }}</span>
                <span style="color: #9B9B9B; font-size:12px;margin-left:1%;">{{ item.commentInfo.gmtCreater }}</span>
                <p style="color: #333B4A; font-size:14px;margin-left:2%;">{{ item.commentInfo.content }}</p>
              </div>
              <el-input v-model="content" rows="6" type="textarea" placeholder="请输入评论内容..." show-word-limit />
              <p style="text-align: right;">
                <el-button size="small" type="primary" @click="comment(content)">发表评论</el-button>
              </p>
            </el-tab-pane>
          </el-tabs>
        </el-footer>
      </el-container>
      <el-dialog :visible.sync="centerDialogVisible" width="30%" center :close-on-click-modal="false">
        <div align="center">确定要删除此项目吗？</div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="centerDialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
        </span>
      </el-dialog>
      <el-dialog :visible.sync="dialogFormVisible" :close-on-click-modal="false">
        <div style="margin: 0% 7% 3% 2%; font-size: 18px; white-space: nowrap;color:rgba(51,59,74,1);">
          <b style="color: #409EFF;margin: 0 0.5%;font-weight: 600; ">|</b>{{ even }}
        </div>
        <el-form ref="form" :model="form" :rules="form_rules" label-width="100px">
          <el-form-item label="事件类型" prop="type">
            <el-select v-show="even === '新建事件'" v-model="form.type" :loading="loading" clearable placeholder="请选择" style="width: 100%">
              <el-option v-for="item in taskScheduleEvent" :key="item.code" :label="item.msg" :value="item.code" />
            </el-select>
            <el-input v-show="even === '编辑事件'" v-model="form.name" :disabled="fal_se" />
          </el-form-item>
          <el-form-item label="事件描述">
            <el-input v-model="form.desc" autocomplete="off" placeholder="请输入描述信息" />
          </el-form-item>
          <el-form-item label="排期" prop="date_start">
            <el-date-picker v-model="form.date_start" type="daterange" range-separator="～" start-placeholder="请选择开始日期" end-placeholder="请选择结束日期" />
            <el-checkbox v-model="form.noHoliday" style="margin-left: 10px;">排除周末</el-checkbox>
          </el-form-item>
          <el-form-item label="参与人员">
            <el-select v-model="form.peoples" multiple filterable remote reserve-keyword placeholder="请输入姓名或者邮箱前缀" :remote-method="remoteMethod" :loading="loading" style="width: 100%">
              <el-option v-for="item in options" :key="item.idap" :label="item.name" :value="test2(item, 0)">
                <div style="display: flex;justify-content: start;">
                  <div style="min-width:100px;color: #8492a6; font-size: 13px; overflow:hidden">{{ item.deptName }}</div>
                  <div style="min-width:80px">{{ item.name }}</div>
                  <div style="min-width:100px;color: #8492a6; font-size: 13px; overflow:hidden">{{ item.idap }}</div>
                </div>
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="even === '新建事件'? event_created(form):event_update(form)">确 定</el-button>
        </div>
      </el-dialog>
      <el-dialog :visible.sync="centerDialogVisible_status" width="30%" center :close-on-click-modal="false">
        <div align="center" style="margin-bottom: 8%; font-weight: 600;">状态变更：已上线</div>
        <div style=" margin: 2% 3%; display: flex; justify-content: space-between; align-items: center; white-space:nowrap;">
          <span>实际上线时间：</span>
          <el-date-picker v-model="NewDate" type="date" style="width:100%;" placeholder="选择日期" format="yyyy 年 MM 月 dd 日" />
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button size="mini" @click="centerDialogVisible_status = false">关 闭</el-button>
          <el-button size="mini" type="primary" @click="task_status_uptate(NewDate)">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 删除 -->
      <el-dialog
        :visible.sync="centerDialogVisible_task"
        width="30%"
        center
        :close-on-click-modal="false"
        title="提示"
        top="35vh"
      >
        <div align="center">
          确定要删除<span style="color:red;">{{ task_form.name }}</span> 的任务吗?
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="centerDialogVisible_task = false">关 闭</el-button>
          <el-button type="primary" @click="task_delete(task_form.id )">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 弹窗 -->
      <openDialog v-if="dialog_open" ref="task_createdUpdata" />
      <createdBug v-if="modalShow" ref="createdBug" @reloadList="bug_list(codeCache)" />
      <TestReport v-if="dialogVisible1" ref="TestReport" />
      <DailyReport v-if="dialogDaily" ref="DailyReport" />
      <ClientReport v-if="dialogClient" ref="ClientReport" />
    </div>
    <el-drawer :visible.sync="drawerShow" :modal="false" :with-header="false" size="50%" class="bug_manage_drawer" @click.stop>
      <div @click.stop>
        <bug-details :id="bugId + ''" ref="bugDetails" :init-count="initCount + ''" :type="'drawer'" @close="drawerShow = false" @delete="drawerShow = false;bug_list(codeCache)" @update="bug_list(codeCache)" />
      </div>
    </el-drawer>
  </div>
</template>

<script>
import BugDetails from '@/views/projectManage/bugList/details/index.vue'
import {
  taskGet,
  memberQueryMemberInfoByIDAPorName,
  bugGetBugStatusMapInfo,
  configShowTaskEnum,
  ScheduleCreate,
  tasktaskDelete,
  taskUpdate,
  ScheduleUpdate,
  commentCreate,
  commentList,
  deleteEvent,
  projectTestReport,
  dailyReport,
  launchTest
} from '@/api/taskIndex' // ajax
import openDialog from '@/views/projectManage/dialog_vue'
import Utils from '../../../util.js'
import { launchTestUpdate } from '@/api/projectPage.js'
import { bugList, bugGetEnum } from '@/api/defectManage'
import echarts from 'echarts'
import dayjs from 'dayjs'
import { releaseScheduleList } from '@/api/teamBench'
import Gantt from '@/views/gantta/gantta'
import createdBug from '@/views/projectManage/bugList/file/createdBug' // bug缺陷
import TestReport from '@/views/Platform/presentation/Templates/TestReport' // 提测
import DailyReport from '@/views/Platform/presentation/Templates/DailyReport' // 日报
import ClientReport from '@/views/Platform/presentation/Templates/ClientReport' // 准出
export default {
  components: {
    openDialog,
    Gantt,
    createdBug,
    TestReport,
    BugDetails,
    DailyReport,
    ClientReport
  },
  filters: {
    ellipsis(value) {
      if (!value) return ''
      if (value.length > 20) {
        return value.slice(0, 20) + '...'
      }
      return value
    },
    oneA(value) {
      if (!value) return ''
      var da = value.substring(0, 1)
      return da
    },
    naspOut(value) {
      if (!value) return ''
      var da = value.split(/\s+/)
      return da[0]
    }
  },
  data() {
    return {
      codeCache: null,
      bugId: 0,
      initCount: 0,
      drawerShow: false,
      dialog_open: false,
      priorityColors: ['#F56C6C', '#FF8952', '#7ED321'],
      statusColors: ['#6AB4FF', '#6AB4FF', '#FFCC66', '#7ED321', '#F56C6C'],
      curIndex: 1,
      pageSize: 15,
      task_form: {
        statusString: '未开始',
        describe: '',
        qaObject: {
          name: ''
        },
        rdObject: {
          name: ''
        }
      },
      dialogVisible1: false, // 提测弹窗
      isHeadShow: false,
      radio: '列表',
      modalShow: false, // 弹窗（新建）
      CallBackTheReason: '', // 打回原因
      NewDate: new Date(),
      content: '', // 评论
      // comment_content: '', // 评论内容
      commentTxt: [],
      commentShow: true, // 评论为空默认显示
      dialog_launchTestInfoDOS: false, // 打回弹窗
      centerDialogVisible_status: false, // status
      currentPage: 0,
      tiem_date: { // 排期汇总
        startTime: '',
        endTime: ''
      },
      userInformation: localStorage.getItem('username'),
      userNames: localStorage.getItem('realname'),
      form_rules: {
        type: [{ required: true, message: '事件类型不能为空', trigger: 'blur' }],
        date_start: [{ required: true, message: '排期不能为空', trigger: 'blur' }]
      },
      fal_se: true,
      arr_event: [], // 事件table
      options: [], // 人员信息
      bugBaseInfoDOList: [], // bug
      launchTestInfoDOS: [], // 提测
      dailyTestReports: [], // 测试
      projectTestReportDOS: [], // 准出
      loading: false,
      table_show: true, // 表格（显示）
      Gantt: false, // 甘特图（显示）
      taskScheduleEvent: [], // 事件类型
      total: 0,
      show2: true,
      describe: false,
      describe1: false,
      dialogFormVisible: false,
      centerDialogVisible: false,
      centerDialogVisible_task: false, // 任务dialog
      options1: [],
      pauseName: '', // gantta
      ganttData: null,
      colorSty: '#6AB4FF',
      appVersion: {},
      even: '', // 添加事件
      form: {
        name: '',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: ''
      },
      tasktId: '',
      echarts_name: [], // echarts_name
      echarts_value: [], // echats_value
      fixInFutureCount: '', // 已延期
      totalCount: '', // bug总数
      bugStatus: [],
      test: {},
      taskStatus: [],
      CallBackStatus: '',
      CallBackId: '',
      bgStyle: '',
      colorStyle: '',
      dialogDaily: false,
      dialogClient: false
    }
  },
  computed: {
    clickCount() {
      return this.$store.state.app.clickCount
    }
  },
  watch: {
    clickCount(newVal, oldVal) {
      this.drawerShow = false
    }
  },
  created() {
    this.get_list()
    this.$store.state.data.status = true
    this.$store.state.data.bizId = true
  },
  mounted() {
    this.get_echarts()
  },
  destroyed() {
    this.$store.state.data.status = false
    this.$store.state.data.bizId = false
  },
  methods: {
    click_launchTestInfoDOS(e) {
      var url = window.location.href // 获取url中"?"符后的字
      this.taskId = url.split('?id=')
      switch (e.index) {
        case '1':
          launchTest({ taskId: this.taskId[1], curIndex: this.curIndex, pageSize: this.pageSize }).then(res => {
            this.launchTestInfoDOS = res.data.list // 准出
            this.total = res.data.total
          })
          break
        case '2':
          dailyReport({ taskId: this.taskId[1], curIndex: this.curIndex, pageSize: this.pageSize }).then(res => {
            this.dailyTestReports = res.data.list
            this.total = res.data.total
          })
          break
        case '3':
          projectTestReport({ taskId: this.taskId[1], curIndex: this.curIndex, pageSize: this.pageSize }).then(res => {
            this.projectTestReportDOS = res.data.list
            this.total = res.data.total
          })
          break
      }
    },
    toReportView(ele, index) {
      switch (index) {
        case 0:
          this.dialogDaily = true
          this.$nextTick(() => {
            this.$refs.DailyReport.init(3, ele)
          })
          break
        case 1:
          this.dialogClient = true
          this.$nextTick(() => {
            this.$refs.ClientReport.init(3, ele)
          })
          break
        case 2:
          this.dialogVisible1 = true
          this.$nextTick(() => {
            this.$refs.TestReport.init(3, ele)
          })
          break
      }
    },
    click_bugName(id) {
      this.bugId = id
      this.initCount++
      this.drawerShow = true
    },
    test2(item, e) {
      // 获取团队人员信息
      if (typeof this.test[item.idap] === 'undefined') {
        item.role = e
        this.test[item.idap] = item
      }
      return item.idap
    },
    get_list() {
      var url = window.location.href // 获取url中"?"符后的字
      this.taskId = url.split('?id=')
      configShowTaskEnum().then(res => {
        this.taskScheduleEvent = res.data.taskScheduleEvent
        this.taskStatus = res.data.taskStatus
        this.bugStatus = res.data.bugStatus
        this.bugStatus.unshift({ code: -1, msg: '全部' })
      })
      taskGet(this.taskId[1]).then(res => {
        if (res.code === 200) {
          if (res.data.bizId !== Number(localStorage.getItem('bizId'))) {
            Utils.$emit('demo', res.data.bizId)
          }
          this.pauseName = res.data.involveAppString === null ? '' : res.data.involveAppString
          this.task_form = res.data
          this.total = res.total
          this.tiem_date.startTime = res.data.scheduleListResponse.startTime // 开始时间
          this.tiem_date.endTime = res.data.scheduleListResponse.endTime // 结束时间
          this.arr_event = res.data.scheduleListResponse.schedulDetailResponseList
          this.table_loading = false
          this.bug_list(-1)
          this.task_form.bugBaseInfoDOList !== null ? (this.bugBaseInfoDOList = res.date.bugBaseInfoDOList) : (this.bugBaseInfoDOList = []) // bug
          const param = {
            appType: Number(res.data.involveApp),
            startTime: res.data.scheduleListResponse.startTime,
            endTime: res.data.scheduleListResponse.endTime
          }
          this.ganttData = this.tableDeal(
            res.data.scheduleListResponse.schedulDetailResponseList
          )
          releaseScheduleList(param).then(res => {
            if (res.code === 200) {
              this.appVersion = this.versionDeal(res.data)
            }
          })
          if (this.task_form.stageString === '未知') {
            this.bgStyle = '#f4f4f5'
            this.colorStyle = '#909399'
            this.isHeadShow = true
          }
          this.task_form.stageString === '正常' ? this.bgStyle = '#69B3FF' : ''
          this.task_form.stageString === '延期' ? this.bgStyle = '#FF8952' : ''
          this.task_form.stageString === '已延期' ? this.bgStyle = '#F56C6C' : ''
        } else {
          this.$message({ message: res.msg, type: 'error', offset: 150 })
        }
      })
      commentList({ type: 3, joinId: this.taskId[1] }).then(res => {
        this.commentTxt = res.data
        this.commentTxt !== '' ? (this.commentShow = false) : (this.commentShow = true)
      })
    },
    tableDeal(arr) {
      if (arr === null) {
        arr = null
      } else {
        return arr.map(eachData => ({
          task: { description: eachData.name || '' },
          schedules: [
            {
              taskName: eachData.name || '', event: eachData.desc,
              schedule: dayjs(eachData.startTime).format('YYYY.MM.DD') + ' - ' + dayjs(eachData.endTime).format('YYYY.MM.DD'),
              startDate: dayjs(eachData.startTime).format('YYYY-MM-DD'),
              length: (dayjs(eachData.endTime) - dayjs(eachData.startTime)) / 86400000 + 1,
              owners: eachData.peopleObject === null ? [] : eachData.peopleObject.map(eachMember => eachMember.name),
              taskId: eachData.taskId
            }
          ]
        }))
      }
    },
    versionDeal(arr) {
      arr === null ? arr = 0 : ''
      const result = {}
      for (let i = 0; i < arr.length; i++) {
        let pauseTime = dayjs(arr[i].startTime).format('YYYY-MM-DD')
        while (pauseTime <= dayjs(arr[i].endTime).format('YYYY-MM-DD')) {
          if (this.pauseName !== null && this.pauseName !== '') {
            result[pauseTime] = this.pauseName + arr[i].version + arr[i].name
          } else {
            result[pauseTime] = ''
          }
          // result[pauseTime] = (this.pauseName || '') + arr[i].version + arr[i].name
          pauseTime = dayjs(pauseTime).add(1, 'day').format('YYYY-MM-DD')
        }
      }
      return result
    },
    open_created(e) {
      // 打开弹窗
      var url = window.location.href // 获取url中"?"符后的字串
      this.taskId = url.split('?id=')
      this.dialog_open = true
      this.$nextTick(() => {
        this.$refs.task_createdUpdata.init(3, this.taskId)
      })
    },
    get_echarts() {
      bugGetBugStatusMapInfo({ taskId: this.taskId[1] }).then(res => {
        this.fixInFutureCount = res.data.fixInFutureCount
        this.totalCount = res.data.totalCount
        res.data.statusInfoList.map(item => {
          this.echarts_name.push(item.statusString)
          this.echarts_value.push(item.count)
        })
      })
      setTimeout(() => {
        var myChart = echarts.init(document.getElementById('div1'))
        myChart.setOption({
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'shadow'
            }
          },
          xAxis: { type: 'category', data: this.echarts_name,
            axisTick: { alignWithLabel: true, show: false },
            axisLine: { show: true, lineStyle: { type: 'dashed' }}
          },
          yAxis: [
            {
              gridIndex: 0,
              axisTick: { show: false },
              axisLabel: { show: false },
              splitLine: { show: false },
              axisLine: { show: false }
            }
          ],
          series: [
            {
              data: this.echarts_value,
              barWidth: '60%',
              type: 'bar',
              itemStyle: { normal: { color: '#409EFF' }},
              label: {
                show: true,
                position: 'inside',
                formatter: function(params) {
                // 如果值大于0 正常显示，否则不显示
                  if (params.value > 0) {
                    return params.value
                  } else {
                    return ''
                  }
                }
              }
            }
          ]
        })
        window.onresize = myChart.resize
      }, 500)
    },
    handleCommand(command) {
      if (command.label === '已上线') {
        this.centerDialogVisible_status = true
        return
      } else {
        this.task_form.statusString = command.label
        var taskInfoDO = this.task_form
        taskInfoDO.status = command.value
        var user = { name: this.userNames, ename: this.userInformation, id: '' }
        taskUpdate({ taskInfoDO, user }).then(res => {
          if (res.code === 200) {
            this.$message({ message: res.msg, type: 'success', offset: 150 })
          }
        })
      }
    },
    task_status_uptate(e) {
      this.task_form.statusString = '已上线'
      var resDate = e.getFullYear() + '-' + (e.getMonth() + 1) + '-' + e.getDate() + ' ' + e.getHours() + ':' + e.getMinutes() + ':' + e.getSeconds()
      var taskInfoDO = this.task_form
      taskInfoDO.status = 5
      taskInfoDO.onlineRealTime = resDate
      var user = { name: this.userNames, ename: this.userInformation, id: '' }
      taskUpdate({ taskInfoDO, user }).then(res => {
        this.centerDialogVisible_status = false
        if (res.code === 200) {
          this.centerDialogVisible_status = false
        }
        this.$message({ message: res.msg, type: 'success', offset: 150 })
      })
    },
    // 事件删除
    event_delete(id) {
      var user = { name: this.userNames, ename: this.userInformation, id: '' }
      deleteEvent(id, user).then(res => {
        if (res.code === 200) {
          this.get_list()
          this.$message({ message: res.msg, type: 'success', offset: 150 })
        } else {
          this.$message({ message: res.msg + '请联系开发人员', type: 'error', offset: 150 })
        }
      })
    },
    event_query(e) {
      // 编辑事件（添加事件）
      this.even = '编辑事件'
      var eventID = {}
      this.arr_event.map(item => {
        item.id === e ? (eventID = item) : ''
      })
      this.dialogFormVisible = true
      var start1 = eventID.startTime !== null ? eventID.startTime.split(/\s+/) : ''
      var start2 = eventID.endTime !== null ? eventID.endTime.split(/\s+/) : ''

      this.form = eventID
      if (eventID.startTime !== null) {
        this.$set(this.form, 'date_start', [start1[0] + 'T' + start1[1] + '.000Z', start2[0] + 'T' + start2[1] + '.000Z'])
      } else {
        this.$set(this.form, 'date_start', '')
      }
      this.options = this.form.peopleObject
      if (this.form.peopleObject !== null && this.form.peopleObject !== '') {
        const peopleArr = this.form.peopleObject.map((eachPeople) => eachPeople.idap)
        this.$set(this.form, 'peoples', peopleArr)
      }
      this.form.noHoliday === 1 ? (this.form.noHoliday = false) : (this.form.noHoliday = true)
    },
    blur_describe(e) {
      this.describe = false
      this.describe1 = true
      this.$set(this.task_form, 'describe', e)
    },
    remoteMethod(query) {
      // 人员查询
      if (query !== '') {
        this.loading = true
        setTimeout(() => {
          this.loading = false
          memberQueryMemberInfoByIDAPorName({ memberIDAP: query }).then(res => {
            const obj = {}
            this.options = res.data.reduce((cur, next) => {
              obj[next.idap] ? '' : obj[next.idap] = true && cur.push(next)
              return cur
            }, [])
          })
        }, 200)
      } else {
        this.options = []
      }
    },
    task_delete(e) {
      // 删除任务
      var user = { name: this.userNames, ename: this.userInformation, id: '' }
      tasktaskDelete(user, e).then(res => {
        if (res.code === 200) {
          this.$router.push({ name: '任务', query: {}})
          this.$message({
            message: res.msg,
            type: 'success',
            duration: 1000,
            offset: 150
          })
        } else {
          this.$message({
            message: res.msg + '请联系开发人员',
            type: 'error',
            duration: 1000,
            offset: 150
          })
        }
      })
    },
    event_update(e) {
      // 编辑事件
      this.even = '编辑事件'
      this.$refs['form'].validate(valid => {
        if (valid) {
          var schedule = e
          e.noHoliday === true ? (schedule.noHoliday = 0) : (schedule.noHoliday = 1)
          schedule.peopleObject = e.peoples
          schedule.startTime = e.date_start[0]
          schedule.endTime = e.date_start[1]
          schedule.taskId = Number(this.taskId[1])
          this.taskScheduleEvent.map(item => {
            item.code === e.type ? (schedule.name = item.msg) : ''
          })
          var user = { name: this.userNames, ename: this.userInformation, id: '' }
          ScheduleUpdate({ schedule, user }).then(res => {
            if (res.code === 200) {
              this.dialogFormVisible = false
              this.$message({
                message: res.msg,
                type: 'success',
                duration: 1000,
                offset: 150
              })
              this.get_list()
            }
          })
        }
      })
    },
    event_created(e) {
      // 添加事件
      this.even = '新建事件'
      this.$refs['form'].validate(valid => {
        if (valid) {
          var schedule = e
          e.noHoliday === true
            ? (schedule.noHoliday = 0)
            : (schedule.noHoliday = 1)
          schedule.startTime = e.date_start[0]
          schedule.endTime = e.date_start[1]
          schedule.taskId = Number(this.taskId[1])
          this.taskScheduleEvent.map(item => {
            item.code === e.type ? (schedule.name = item.msg) : ''
          })
          var user = {
            name: this.userNames,
            ename: this.userInformation,
            id: ''
          }
          ScheduleCreate({ schedule, user }).then(res => {
            if (res.code === 200) {
              this.dialogFormVisible = false
              this.$message({
                message: res.msg,
                type: 'success',
                duration: 1000,
                offset: 150
              })
              this.get_list()
            }
          })
        }
      })
    },
    bug_list(e) {
      this.codeCache = e
      // bug查询
      bugGetEnum().then(res => {
        this.priorityLevelEnumList = res.data.priorityLevelEnumList // 优先级
      })
      if (e === -1) {
        bugList({ taskId: this.taskId[1], pageSize: this.pageSize, curIndex: this.curIndex }).then(res => {
          if (res.code === 200) {
            if (res.data) {
              this.colorSty = '#6AB4FF'
              this.bugBaseInfoDOList = res.data
              this.total = res.total
              this.bugBaseInfoDOList.map(item1 => {
                this.priorityLevelEnumList.map(item => {
                  item1.priorityLevel !== null ? item1.priorityLevel === item.name ? item1.priorityCode = item.code : '' : ''
                })
              })
            }
          }
        })
      } else {
        this.curIndex = 1
        bugList({ status: e, taskId: Number(this.taskId[1]), pageSize: this.pageSize, curIndex: this.curIndex }).then(res => {
          if (res.code === 200) {
            if (res.data !== null) {
              this.colorSty = ''
              this.bugBaseInfoDOList = res.data
              this.total = res.total
              this.bugBaseInfoDOList.map(item1 => {
                this.priorityLevelEnumList.map(item => {
                  item1.priorityLevel !== null ? item1.priorityLevel === item.name ? item1.priorityCode = item.code : '' : ''
                })
              })
            } else {
              this.bugBaseInfoDOList = []
            }
          }
        })
      }
    },
    comment(e) {
      this.content = ''
      this.commentShow = false
      var commentInfo = {
        joinId: this.taskId[1],
        content: e,
        type: 3,
        fatherId: 0,
        name: this.userNames,
        email: this.userInformation
      }
      var user = { name: this.userNames, ename: this.userInformation, id: '' }
      commentCreate({ commentInfo, user }).then(res => {
        if (res.code === 200) {
          this.get_list()
          this.$message({ message: res.msg, type: 'success', offset: 150 })
        }
      })
    },
    GanttChart(e) {
      switch (e) {
        case 1:
          this.table_show = true
          this.Gantt = false
          break
        case 2:
          this.table_show = false
          this.Gantt = true
          break
      }
    },
    add_Event() {
      // 添加事件（排期）
      this.even = '新建事件'
      this.dialogFormVisible = true
      this.form = {}
      this.$nextTick(() => { this.$refs['form'].clearValidate() })
    },
    devUrl_tow(e, ele) {
      // 技术文档
      switch (e) {
        case 1:
          this.$router.push({ name: '项目详情', query: { id: ele }})
          break
        case 2:
          window.open(ele, '_blank')
          break
        case 3:
          this.$router.push({ name: '需求详情', params: { id: ele + '' }})
          break
      }
    },
    // 打回
    back(e, ele) {
      this.dialog_launchTestInfoDOS = true
      this.CallBackStatus = e
      this.CallBackId = ele
    },
    // 通过
    pass(e, ele) {
      this.CallBackStatus = e
      this.CallBackId = ele
      this.passOrBackSend()
    },
    passOrBackSend() {
      this.dialog_launchTestInfoDOS = false
      const tt = { status: this.CallBackStatus, id: this.CallBackId }
      var userData = { id: '', ename: this.userInformation, name: this.userNames }
      var objData = { launchTestInfo: tt, user: userData }
      launchTestUpdate(objData).then(res => {
        res.code === 200 ? this.$message({ message: res.msg, type: 'success', offset: 150 }) : this.$message({ message: res.msg, type: 'error', offset: 150 })
        this.get_List()
      })
    },
    handleSizeChange(size) { //  分页
      this.pageSize = size
      this.get_list()
    },
    handleCurrentChange(curIndex) { //  分页
      this.curIndex = curIndex
      this.get_list()
    },
    createReport(e, ele) {
      switch (e) {
        case 1: // 提测
          if (this.task_form.statusString !== '开发中') {
            this.$message({ message: '存在状态不是【开发中】的任务，请将任务状态为【开发中】才可测试，请检查！', type: 'warning' })
          } else {
            this.dialogVisible1 = true
            this.$nextTick(() => { this.$refs.TestReport.init(1, ele) })
          }
          break
        case 2: // 日报
          if (this.task_form.statusString !== '测试中') {
            this.$message({ message: '存在状态不是【测试中】的任务，请将任务状态为【测试中】才可准出，请检查！', type: 'warning' })
          } else {
            this.dialogDaily = true
            this.$nextTick(() => { this.$refs.DailyReport.init(1) })
          }
          break
        case 3:
          if (this.task_form.statusString !== '测试中') {
            this.$message({ message: '存在状态不是【测试中】的任务，请将任务状态为【测试中】才可准出，请检查！', type: 'warning' })
          } else {
            this.dialogClient = true
            this.$nextTick(() => { this.$refs.ClientReport.init(1, ele) })
          }
          break
        case 4:
          this.modalShow = true
          this.$nextTick(() => { this.$refs.createdBug.init(1, ele) })
          break
      }
    }
  }
}
</script>

<style lang="scss">
.footer .el-tabs__nav-wrap::after {
  background-color: #FFFFFF !important;
}
.footer .el-tabs__header {
  padding: 0;
  position: relative;
  margin: 0 0 15px;
  width: 80%;
}
</style>
<style lang="stylus" scoped>
.selected {
  color: rgb(106, 180, 255)
}
.bgborderButton .el-button--info.is-plain:hover {
  background: #3f9eff !important;
  border-color: #3f9eff !important;
}

.special-button .el-button--info.is-plain:hover {
  background: #3f9eff !important;
  border-color: #3f9eff !important;
}

.special-button .el-button--info.is-plain {
  background: white !important;
}

.bgborder {
  background-color: #FFFFFF;
  border-radius: 4px;
}

.footer {
  margin: 0 1% 1% 1%;
  background-color: #FFFFFF;
  border-radius: 4px;
}

.aside {
  font-size: 14px;
  margin: 5%;
  cursor: pointer;
}

.aside:hover {
  color: #409EFF;
}

.bgbugTa .el-main {
  padding: 0 !important;
}

.el-tooltip__popper {
  max-width: 200px;
}

.test {
  height: 50vh;
  color: #666666;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.el-dropdown-menu__item:not(.is-disabled):hover {
  background-color: #f6f7fa;
  color: #606266;
}

.bgbugTa .el-divider--horizontal {
  display: block;
  height: 1px;
  width: 100%;
  position: absolute !important;
  margin: 0 !important;
}

.form_e .el-form-item {
  margin-bottom: 0px;
}

.form_e label{
  font-weight 400
}

.status {
  margin-left: 2%;
  cursor: pointer;
}

.status:hover {
  color: #6AB4FF;
}

.timeStyle {
   text-align: center;
   padding: 5px;
   border-radius: 4px;
   min-height: 34px;
   min-width: 74px;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #FFF;
   font-size:14px;
   margin-right:20px;
   font-family:MicrosoftYaHei;
   color:rgba(255,255,255,1);
}

.dateSet {
  font-size: 14px;
  color: #333B4A;
  margin: 1.5% 0;
  padding-bottom:1.5%;
  border-bottom:1px solid #E9E9E9;
}
.div_priority {
  color: #ffffff;
  width: 35px;
  padding: 0 12px;
  border-radius: 4px;
  margin: auto;
  margin-right: 46%;
}
.bgborder >>> .el-table .cell {
  margin: -2px 0 -2px 0 !important
}
.drop_down {
  color: #606266
}
</style>