<template>
  <div>
    <gantt-elastic ref="acedd" :options="options" :tasks="tasks" style="height: 822px" @tasks-changed="tasksUpdates"
      @options-changed="optionsUpdate" @dynamic-style-changed="styleUpdate">
      <gantt-header slot="header">
        <el-row slot="headerOperationList" style="display: flex;align-items: center">
          <span style="margin-left: 20px">月份</span>
          <el-date-picker v-model="contractNoValue_Date" :clearable="false" format="yyyy-MM" placeholder="选择月"
            style="margin: 0 10px" type="month" value-format="yyyy-MM" @change="searchTable()" />
          <span>负责人</span>
          <el-select v-model="peopleName" filterable placeholder="负责人" style="width: 200px;margin: 0 10px"
            @change="searchTable()">
            <el-option v-for="item in peopleNames" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
          <!--      <span>日期排序</span>-->
          <!--      <el-select-->
          <!--        v-model="orderByType"-->
          <!--        style="width: 200px"-->
          <!--        filterable-->
          <!--        value-key="默认"-->
          <!--        @change="orderByTable()"-->
          <!--      >-->
          <!--        <el-option key="默认" label="默认" value="默认" />-->
          <!--        <el-option key="近期" label="近期" value="近期" />-->
          <!--        <el-option key="远期" label="远期" value="远期" />-->
          <!--      </el-select>-->
          <el-button icon="el-icon-search" type="success" @click="searchTable">查询</el-button>
          <el-button icon="el-icon-edit" type="warning" @click="writeDayContent">写日报</el-button>
          <!-- 分页组件 -->
          <!--      <el-pagination-->
          <!--        :current-page="currentPage"-->
          <!--        :page-sizes="[5, 10, 20, 30, 50, 100]"-->
          <!--        :page-size="pageSize"-->
          <!--        :total="paIndex"-->
          <!--        class="pagiantion"-->
          <!--        background-->
          <!--        layout="total, sizes, prev, pager, next, jumper"-->
          <!--        @size-change="pageHandleSizeChange"-->
          <!--        @current-change="pageHandleCurrentChange"-->
          <!--      />-->

        </el-row>
      </gantt-header>
    </gantt-elastic>
    <!--    右键菜单-->
    <ul id="menu" ref="msgRightMenu">
      <li @click="editTask">编辑</li>
      <hr>
      <li @click="deleteTask">删除</li>
      <hr>
      <li @click="searchWord">文件</li>
      <hr>
    </ul>
    <!--    文件列表-->
    <el-dialog v-el-drag-dialog :visible.sync="dialogVisible" center title="文件列表(点击文件名查看)" top="1vh" width="1800px">
      <div style="height: 800px">
        <el-col :span="6">
          <div style="display: flex">
            <el-upload :action="action" :before-upload="beforeUpload" :file-list="fileList" :on-error="uploadFailure"
              :on-success="uploadSuccess" :show-file-list="showFileList" class="upload-demo" multiple>
              <el-button v-show="parseInt(id) === parseInt(currentData.rowsa)" type="primary"
                @click="batchImportOfDrawings">选择文件上传
              </el-button>
            </el-upload>
            <el-button style="margin-left: 10px" @click="dialogVisible = false">关闭</el-button>
          </div>
          <el-table :data="hadFile" :header-cell-style="{ background: '#F5F5F5' }" border max-height="758px"
            style="width: 98%; border: 1px solid #9e9b9b" tooltip-effect="dark">
            <el-table-column align="left" label="文件名称" min-width="100px">
              <template slot-scope="scope">
                <div style="display: flex;align-items: center;">
                  <div style="width: 30px;height: 30px">
                    <div v-if="scope.row.suffix === 'pdf'" class="icon">
                      <svg-icon icon-class="pdf" />
                    </div>
                    <div v-else-if="scope.row.suffix === 'docx' || scope.row.suffix === 'doc'" class="icon">
                      <svg-icon icon-class="doc" />
                    </div>
                    <div v-else-if="scope.row.suffix === 'txt'" class="icon">
                      <svg-icon icon-class="txt" />
                    </div>
                    <div v-else-if="scope.row.suffix === 'xlsx' || scope.row.suffix === 'xls'" class="icon">
                      <svg-icon icon-class="excel" />
                    </div>
                    <div v-else-if="scope.row.suffix === 'pptx' || scope.row.suffix === 'ppt'" class="icon">
                      <svg-icon icon-class="ppt" />
                    </div>
                    <div
                      v-else-if="scope.row.suffix === 'jpg' || scope.row.suffix === 'jpeg' || scope.row.suffix === 'png'"
                      class="icon">
                      <svg-icon icon-class="pic" />
                    </div>
                    <div v-else class="icon">
                      <svg-icon icon-class="file" />
                    </div>
                  </div>
                  <span>{{ scope.row.name }}</span>
                </div>
              </template>
            </el-table-column>
            <el-table-column align="center" label="编辑" width="120px">
              <template slot-scope="scope">
                <el-button icon="el-icon-view" size="mini" type="text" @click="searchProject_info_File(scope.row)" />
                <el-button icon="el-icon-download" size="mini" style="font-size: large" type="text"
                  @click="downLoadFile(scope.row)" />
                <el-button icon="el-icon-delete" size="mini" style="font-size: large;color: red" type="text"
                  @click="deleteFileData(scope.row)" />
              </template>
            </el-table-column>
          </el-table>
        </el-col>
        <el-col :span="18">
          <span v-if="fileName !== ''" style="font-size: 18px;font-weight: bolder">{{ fileName }}</span>
          <span v-else style="font-size: 18px;font-weight: bolder">请选择左侧文件进行预览（部分格式需要点击两次预览，才会显示出来，正在修改此bug）</span>
          <div style="max-height: 780px;overflow: auto;">
            <div style="height: 780px;border: 1px solid #a1a1a1">
              <div v-show="fileContent !== ''">
                <el-image v-if="isImageType" :preview-src-list="evaluatePictureList" :src="fileContentImg" fit="fill"
                  lazy />
                <div v-else-if="isPdfType">
                  <iframe :src="fileContentPdf" height="810px" width="100%" />
                </div>
                <div v-else-if="isTxtType">
                  <el-input :rows="22" :value="fileContentTxt" readonly type="textarea" />
                </div>
                <div v-else-if="isWordType">
                  <div v-scale ref="wordPreview" style="width:100%;height: 475px" />
                </div>
                <div v-else-if="isExcelType">
                  <div id="luckysheetShow" />
                </div>
                <div v-else-if="isPptype">
                  <div id="uploadFileInput" style="width: 1200px;height: 750px" />
                </div>
                <div v-else class="noView">不支持的预览格式</div>
              </div>
            </div>
          </div>
        </el-col>
      </div>
    </el-dialog>
    <!--    筛选-->
    <el-drawer :modal="false" :visible.sync="drawer" direction="ttb" size="14%">
      <span style="margin-left: 20px">项目名称</span>
      <el-select v-model="contractNoValue" clearable filterable placeholder="项目名称" style="width: 200px"
        @change="searchTable()">
        <el-option v-for="item in contractNo" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
      <span>负责人</span>
      <el-select v-model="peopleName" clearable filterable placeholder="负责人" style="width: 200px"
        @change="searchTable()">
        <el-option v-for="item in peopleNames" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
    </el-drawer>
    <!--    备注的查看-->
    <el-dialog v-el-drag-dialog :title="searchTitle" :visible.sync="dialogVisible1" center width="20%">
      <el-input :rows="11" :value="remark" readonly style="font-size: 16px" type="textarea" />
    </el-dialog>
    <!--    日报填写-->
    <el-dialog :title="titleForDayContent" :visible.sync="dialogFormVisible1" center width="600px">
      <el-form ref="form1" :model="form1" :rules="rules1" label-position="right" label-width="90px"
        style="width: 100%;margin: auto">
        <el-form-item label="日期" prop="日期">
          <div style="display: flex; align-items: baseline">
            <el-date-picker v-model="form1.日期" :clearable="false" format="yyyy-MM-dd" placeholder="选择日期"
              style="width: 40%" type="date" value-format="yyyy-MM-dd" />
            <el-time-select v-model="form1.工作时间[0]" :clearable="false" :picker-options="{
              start: '07:00',
              step: '00:10',
              end: '23:50',
            }" format="HH:mm" placeholder="起始时间" range-separator="-" style="width: 28%;margin: 0 0 0 5px"
              value-format="HH:mm" />
            &nbsp;-&nbsp;
            <el-time-select v-model="form1.工作时间[1]" :clearable="false" :picker-options="{
              start: '07:00',
              step: '00:10',
              end: '23:50',
            }" format="HH:mm" placeholder="结束时间" range-separator="-" style="width: 28%" value-format="HH:mm" />
            <!--<el-time-picker-->
            <!--  v-model="form1.工作时间"-->
            <!--  :clearable="false"-->
            <!--  is-range-->
            <!--  value-format="HH:mm"-->
            <!--  format="HH:mm"-->
            <!--  range-separator="-"-->
            <!--  start-placeholder="开始时间"-->
            <!--  end-placeholder="结束时间"-->
            <!--  placeholder="选择时间范围"/>-->
          </div>
        </el-form-item>
        <el-row>
          <div style="display: flex">
            <el-form-item label="填报项目" prop="填报项目">
              <el-select v-model="form1.填报项目" filterable placeholder="填报项目" style="width: 100%"
                @change="searchProject_Info()">
                <el-option v-for="item in projectList" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
            <el-form-item label="工作状态" prop="状态">
              <el-select v-model="form1.状态" placeholder="工作状态" style="width: 100%">
                <el-option v-for="item in stateValue" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
          </div>
        </el-row>
        <el-form-item label="子项目" prop="子项目">
          <el-select v-model="form1.子项目" filterable placeholder="填报项目" style="width: 100%;margin-top: 5px">
            <el-option v-for="item in projectList_Info" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="工作内容" prop="工作内容">
          <el-input v-model="form1.工作内容" :rows="5" clearable placeholder="备注" style="width: 100%" type="textarea" />
        </el-form-item>
        <el-form-item label="备注" prop="备注">
          <el-input v-model="form1.备注" :rows="3" clearable placeholder="备注" style="width: 100%" type="textarea" />
        </el-form-item>
        <el-row style="text-align: center;margin-top: 10px">
          <el-button @click="callOff('form1')">取消</el-button>
          <el-button :disabled="submitNoOk" type="primary" @click="submitOrderDay('form1')">提交
          </el-button>
        </el-row>
      </el-form>
    </el-dialog>
    <!--    日报填写编辑-->
    <el-dialog :title="titleForDayContent" :visible.sync="dialogFormVisible" center width="600px">
      <el-form ref="form" :model="form" :rules="rules" label-position="right" label-width="90px"
        style="width: 100%;margin: auto">
        <el-form-item label="日期" prop="日期">
          <div style="display: flex;align-items: baseline">
            <el-date-picker v-model="form.日期" :disabled="true" format="yyyy-MM-dd" placeholder="选择日期" readonly
              style="width: 40%" type="date" value-format="yyyy-MM-dd" />
            <el-time-select v-model="form.工作时间[0]" :clearable="false" :picker-options="{
              start: '07:00',
              step: '00:10',
              end: '23:50',
            }" format="HH:mm" placeholder="起始时间" range-separator="-" style="width: 28%;margin: 0 0 0 5px"
              value-format="HH:mm" />
            &nbsp;-&nbsp;
            <el-time-select v-model="form.工作时间[1]" :clearable="false" :picker-options="{
              start: '07:00',
              step: '00:10',
              end: '23:50',
            }" format="HH:mm" placeholder="结束时间" range-separator="-" style="width: 28%" value-format="HH:mm" />
            <!--<el-time-picker-->
            <!--  v-model="form.工作时间"-->
            <!--  :clearable="false"-->
            <!--  is-range-->
            <!--  value-format="HH:mm"-->
            <!--  format="HH:mm"-->
            <!--  range-separator="-"-->
            <!--  start-placeholder="开始时间"-->
            <!--  end-placeholder="结束时间"-->
            <!--  placeholder="选择时间范围"/>-->
          </div>
        </el-form-item>
        <el-row>
          <div style="display: flex">
            <el-form-item label="填报项目" prop="填报项目">
              <el-select v-model="form.填报项目" :disabled="true" filterable placeholder="填报项目" style="width: 100%"
                @change="searchProject_Info()">
                <el-option v-for="item in projectList" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
            <el-form-item label="工作状态" prop="状态">
              <el-select v-model="form.状态" placeholder="工作状态" style="width: 100%">
                <el-option v-for="item in stateValue" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
          </div>
        </el-row>
        <el-form-item label="子项目" prop="子项目">
          <el-select v-model="form.子项目" filterable placeholder="填报项目" style="width: 100%;margin-top: 5px">
            <el-option v-for="item in projectList_Info" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="工作内容" prop="工作内容">
          <el-input v-model="form.工作内容" :rows="5" clearable placeholder="备注" style="width: 100%" type="textarea" />
        </el-form-item>
        <el-form-item label="备注" prop="备注">
          <el-input v-model="form.备注" :rows="3" clearable placeholder="备注" style="width: 100%" type="textarea" />
        </el-form-item>
        <el-row style="text-align: center;margin-top: 10px">
          <el-button @click="callOff('form')">取消</el-button>
          <el-button type="primary" @click="submitOrder('form')">提交</el-button>
        </el-row>
      </el-form>
    </el-dialog>
  </div>
</template>

<style></style>
<script>
import GanttElastic from '@/GanttElastic'
import ProjectManagement from './ProjectManagement'
import GanttHeader from '@/components/Gantt_Header/Header.vue'
import { mapGetters } from 'vuex'
import { MESDeleteFile, MESDownloadFile, MESUploadFileProject } from '@/utils/request'
import DayCount from './dayCount.vue'
import TodayCount from './TodayCount.vue'
import axios from 'axios'
import LuckyExcel from 'luckyexcel'
// import VueOfficeDocx from '@vue-office/docx'
// import '@vue-office/docx/lib/index.css'
// import VueOfficeExcel from '@vue-office/excel'
// import '@vue-office/excel/lib/index.css'
// tasks是数据 真实的项目需要接口赋值数据
let that
const docx = require('docx-preview')
const options = {
  taskMapping: {
    progress: 'percent'
  },
  maxRows: 10,
  maxHeight: 500,
  // title: {
  //   label: "Your project title as html (link or whatever...)",
  //   html: false
  // },
  row: {
    height: 30 // 设置行高
  },
  times: {
    timeScale: 60 * 1000,
    timeZoom: 20
  },

  chart: {
    grid: {
      horizontal: {
        gap: 6
      }
    },
    text: {
      offset: 4,
      xPadding: 10,
      display: true
    },

    expander: {
      type: 'chart',
      display: true,
      displayIfTaskListHidden: true,
      offset: 4,
      size: 18
    }
  },

  taskList: {
    // expander: {
    //   straight: true,
    // },
    columns: [
      {
        id: 1,
        label: 'ID',
        value: 'id',
        width: 0
      },
      {
        id: 2,
        label: '工作内容',
        value: 'label',
        width: 250,
        expander: true,
        html: true,
        events: {
          click({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            if (data.type === 'task') {
              that.searchLabel(data.label, '工作内容')
            }
          },
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      {
        id: 4,
        label: '项目名称',
        value: 'projectName',
        width: 150,
        html: true,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'left',
            width: '100%'
          }
        },
        events: {
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      {
        id: 7,
        label: '子项目内容',
        value: 'project_info',
        width: 150,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'left',
            width: '100%'
          }
        },
        events: {
          click({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      {
        id: 3,
        label: '状态',
        value: 'nums',
        width: 80,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'center',
            width: '100%'
          }
        },
        events: {
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
        // expander: true,
        // html: true,
      },
      {
        id: 5,
        label: '开始时间',
        value: 'start',
        width: 140,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'center',
            width: '100%'
          }
        },
        events: {
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      {
        id: 6,
        label: '结束时间',
        value: 'end',
        width: 140,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'center',
            width: '100%'
          }
        },
        events: {
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      // {
      //   id: 7,
      //   label: '类型',
      //   value: 'type',
      //   width: 78,
      //   events: {
      //     click1({ data, column }) {
      //       // if (that.flags !== '1') {
      //       //   that.showDialog(data)
      //       // }
      //       that.currentRow(data)
      //     },
      //     rightShow({ data, column }) {
      //       that.rightShow(data)
      //       // if (data) {
      //       //   this.rightShow(data)
      //       // }
      //     }
      //   }
      // },
      {
        id: 8,
        label: '耗时(h)',
        value: 'time',
        width: 80,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'center',
            width: '100%'
          }
        },
        events: {
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      {
        id: 11,
        label: '文件',
        html: true,
        value: 'fileCount',
        width: 80,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'center',
            width: '100%'
          },
          'gantt-elastic__task-list-item-value': {
            'color': '#409EFF'
          }
        },
        events: {
          click({ data, column }) {
            that.currentData = data
            that.taskID = data.id
            that.searchWord(data)
          },
          click1({ data, column }) {
          },
          rightShow({ data, column }) {
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      {
        id: 9,
        label: '备注',
        value: 'remark',
        width: 150,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'left',
            width: '100%'
          }
        },
        events: {
          click({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.searchLabel(data.remark, '备注')
          },
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      },
      {
        id: 10,
        label: '修改时间',
        value: 'updateTime',
        width: 150,
        style: {
          'task-list-header-label': {
            'text-align': 'center',
            width: '100%'
          },
          'task-list-item-value-container': {
            'text-align': 'center',
            width: '100%'
          }
        },
        events: {
          click1({ data, column }) {
            // if (that.flags !== '1') {
            //   that.showDialog(data)
            // }
            that.currentRow(data)
          },
          rightShow({ data, column }) {
            that.rightShow(data)
            // if (data) {
            //   this.rightShow(data)
            // }
          }
        }
      }
    ]
  },

  startTime: null,
  endTime: null,

  calendar: {
    workingDays: [1, 2, 3, 4, 5, 6],
    gap: 0,
    strokeWidth: 5,
    hour: {
      display: true
    }
  },

  locale: {
    weekdays: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
    months: [
      '一月',
      '二月',
      '三月',
      '四月',
      '五月',
      '六月',
      '七月',
      '八月',
      '九月',
      '十月',
      '十一月',
      '十二月'
    ],
    Now: 'Now',
    'X-Scale': 'Zoom-X',
    'Y-Scale': 'Zoom-Y',
    'Task list width': 'Task list',
    'Before/After': 'Expand',
    'Display task list': 'Task list'
  }
}
export default {
  //   name: "Gantt",
  components: {
    DayCount,
    TodayCount,
    GanttHeader,
    GanttElastic,
    ProjectManagement
    // VueOfficeDocx,
    // VueOfficeExcel
  },
  props: {
    gantData: {
      type: Object,
      default: () => ({})
    },
    flags: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      imageType: ['bmp', 'jpg', 'png', 'gif', 'jpeg', 'BMP', 'JPG', 'PNG', 'GIF', 'JPEG'],
      pdfType: ['pdf', 'PDF'],
      txtType: ['txt', 'TXT'],
      wordType: ['docx', 'DOCX'],
      excelType: ['xlsx', 'XLSX'],
      pptType: ['pptx', 'PPTX'],
      currentDownLoadUrl: '',
      fileName: '',
      fileType: '',
      fileContent: '',
      evaluatePictureList: [],
      fileContentImg: null,
      fileContentPdf: null,
      fileContentTxt: null,
      fileContentWord: null,
      fileContentExcel: null,
      fileContentPpt: null,
      isImageType: false,
      isPdfType: false,
      isTxtType: false,
      isWordType: false,
      isExcelType: false,
      isPptype: false,
      activeName: 'first',
      dragState: 0,
      setParentId: '',
      oldTaskId: '',
      drawer: false,
      hadFile: [],
      showFileList: false,
      fileList: [],
      action: '',
      taskID: '',
      parentID: '',
      startTime: '',
      endTime: '',
      state: '',
      type: '',
      remarks: '',
      remark: '',
      people: '',
      nowD: '',
      contractNoValue: '',
      contractNoValue_Date: '',
      contractNo: [],
      peopleName: '',
      peopleNames: [],
      orderByType: '默认',
      dataBackups: [],
      projectName: '',
      // 总根节点数
      paIndex: 0,
      // 当前页
      currentPage: 1,
      // 一页几条
      pageSize: 10,
      projectListName: '',
      projectListName_Info: '',
      projectList: [],
      projectList_Info: [],
      //
      stateValue: [
        {
          label: '未开始',
          value: '未开始'
        },
        {
          label: '进行中',
          value: '进行中'
        },
        {
          label: '暂停中',
          value: '暂停中'
        },
        {
          label: '已完成',
          value: '已完成'
        }
      ],
      typeValue: [
        {
          label: 'project',
          value: 'project'
        },
        {
          label: 'milestone',
          value: 'milestone'
        },
        {
          label: 'task',
          value: 'task'
        }
      ],
      title: '',
      titleForDayContent: '',
      dialogFormVisible: false,
      dialogFormVisible1: false,
      currentData: {},
      form: {
        填报人员: '',
        填报项目: '',
        子项目: '',
        ID: '',
        日期: '',
        工作内容: '',
        状态: '',
        工作时间: [],
        备注: ''
      },
      rules: {
        填报人员: [{ required: true, message: '请选择填报人员', trigger: 'change' }],
        日期: [{ required: true, message: '请选择工作日期', trigger: 'change' }],
        工作内容: [{ required: true, message: '请填写工作内容', trigger: 'blur' }],
        状态: [{ required: true, message: '请选择工作状态', trigger: 'change' }],
        子项目: [{ required: true, message: '请选择子项目', trigger: 'change' }],
        工作时间: [{ required: true, message: '请选择工作时间', trigger: 'change' }]
      },
      form1: {
        填报人员: '',
        填报项目: '',
        子项目: '',
        日期: '',
        工作内容: '',
        状态: '',
        工作时间: [],
        备注: ''
      },
      rules1: {
        填报人员: [{ required: true, message: '请选择填报人员', trigger: 'change' }],
        填报项目: [{ required: true, message: '请选择填报项目', trigger: 'change' }],
        子项目: [{ required: true, message: '请选择子项目', trigger: 'change' }],
        日期: [{ required: true, message: '请选择工作日期', trigger: 'change' }],
        工作内容: [{ required: true, message: '请填写工作内容', trigger: 'blur' }],
        状态: [{ required: true, message: '请选择工作状态', trigger: 'change' }],
        工作时间: [{ required: true, message: '请选择工作时间', trigger: 'change' }]
      },
      isPersoncontextMenus: false,
      showGantt: true,
      dialogVisible: false,
      dialogVisible1: false,
      searchTitle: '',
      orderModal: false,
      TaskData: [],
      sontaskData: '',
      nowWorkStatus: '',
      backWorkStatus: '',
      timeItem: '',
      tasks: [],
      options,
      dynamicStyle: {},
      successStyle: {
        base: {
          fill: '#1EBC61',
          stroke: '#0EAC51'
        }
      },
      unfinishedStyle: {
        base: {
          fill: '#dfe6ec',
          stroke: '#dfe6ec'
        }
      },
      comName: 'newSelectProdct',
      titles: '新品选品',
      flag: true,
      submitNoOk: false
    }
  },
  computed: {
    ...mapGetters(['id', 'token', 'name', 'clickItemData', 'personList'])
  },
  watch: {
    isPersoncontextMenus(value) {
      if (value) {
        document.body.addEventListener('click', this.closeMenu)
      } else {
        document.body.removeEventListener('click', this.closeMenu)
      }
    }
  },
  created() {
    // this.searchContract()
    this.searchPeople()
    this.searchProject()
  },
  mounted() {
    that = this
    this.contractNoValue_Date = this.getTody(new Date(), 0)
    window.luckysheet.destroy()
  },
  methods: {
    renderedHandler() {
      console.log('渲染完成')
    },
    errorHandler() {
      console.log('渲染失败')
    },
    searchProject_info_File(row) {
      axios({
        method: 'get',
        url: MESDownloadFile,
        params: {
          id: row.idd + '.' + row.suffix
        },
        responseType: 'blob'
      }).then(res => {
        console.log(row)
        const that = this
        this.fileName = row.name
        this.fileType = row.suffix
        this.fileContent = res.data
        this.fileContentImg = ''
        this.fileContentPdf = ''
        this.fileContentTxt = ''
        this.fileContentPpt = ''
        window.luckysheet.destroy()
        if ($('#uploadFileInput')) $('#uploadFileInput').empty()
        this.evaluatePictureList = []
        if (this.imageType.indexOf(this.fileType) !== -1) {
          this.isImageType = true
          this.isTxtType = false
          this.isPdfType = false
          this.isWordType = false
          this.isExcelType = false
          this.isPptype = false
          this.fileContentImg = window.URL.createObjectURL(res.data)
          this.evaluatePictureList.push(this.fileContentImg)
        } else if (this.pdfType.indexOf(this.fileType) !== -1) {
          this.isImageType = false
          this.isTxtType = false
          this.isPdfType = true
          this.isWordType = false
          this.isExcelType = false
          this.isPptype = false
          this.fileContentPdf = window.URL.createObjectURL(new Blob([res.data], { type: 'application/pdf;chartset=UTF-8' }))
        } else if (this.txtType.indexOf(this.fileType) !== -1) {
          this.isImageType = false
          this.isPdfType = false
          this.isTxtType = true
          this.isWordType = false
          this.isExcelType = false
          this.isPptype = false
          const READER = new FileReader()
          READER.addEventListener('loadend', function (e) {
            that.fileContentTxt = e.target.result
          })
          READER.readAsText(res.data)
        } else if (this.wordType.indexOf(this.fileType) !== -1) {
          this.isImageType = false
          this.isPdfType = false
          this.isTxtType = false
          this.isWordType = true
          this.isExcelType = false
          this.isPptype = false
          docx.renderAsync(res.data, that.$refs.wordPreview, null, {
            className: 'docx', // 默认和文档样式类的类名/前缀
            inWrapper: true, // 启用围绕文档内容呈现包装器
            ignoreWidth: false, // 禁用页面的渲染宽度
            ignoreHeight: false, // 禁用页面的渲染高度
            ignoreFonts: false, // 禁用字体渲染
            breakPages: true, // 在分页符上启用分页
            ignoreLastRenderedPageBreak: true, // 在lastRenderedPageBreak元素上禁用分页
            experimental: false, // 启用实验功能（制表符停止计算）
            trimXmlDeclaration: true, // 如果为true，则在解析之前将从xml文档中删除xml声明
            useBase64URL: false, // 如果为true，图像、字体等将转换为base 64 URL，否则使用URL.createObjectURL
            useMathMLPolyfill: false, // 包括用于铬、边等的MathML多填充。
            showChanges: false, // 启用文档更改的实验渲染（插入/删除）
            debug: false // 启用额外的日志记录
          })
        } else if (this.excelType.indexOf(this.fileType) !== -1) {
          this.isImageType = false
          this.isPdfType = false
          this.isTxtType = false
          this.isWordType = false
          this.isExcelType = true
          this.isPptype = false
          LuckyExcel.transformExcelToLucky(res.data, function (exportJson, luckysheetfile) {
            if (exportJson.sheets == null || exportJson.sheets.length === 0) {
              that.$message.error('无法读取excel文件的内容，当前不支持xls文件!')
              return
            }
            window.luckysheet.create({
              container: 'luckysheetShow', // luckysheet is the container id
              lang: 'zh', // 设定表格语言
              allowCopy: false, // 是否允许拷贝
              showtoolbar: false, // 是否显示工具栏
              showinfobar: false, // 是否显示顶部信息栏
              showsheetbar: true, // 是否显示底部sheet页按钮
              showstatisticBar: true, // 是否显示底部计数栏
              sheetBottomConfig: false, // sheet页下方的添加行按钮和回到顶部按钮配置
              allowEdit: false, // 是否允许前台编辑
              enableAddRow: false, // 允许增加行
              enableAddCol: false, // 允许增加列
              userInfo: false, // 右上角的用户信息展示样式
              showRowBar: true, // 是否显示行号区域
              showColumnBar: true, // 是否显示列号区域
              sheetFormulaBar: false, // 是否显示公式栏
              enableAddBackTop: false, // 返回头部按钮
              showstatisticBarConfig: {
                count: false,
                view: false,
                zoom: false
              },
              showsheetbarConfig: {
                add: false, // 新增sheet
                menu: false, // sheet管理菜单
                sheet: false // sheet页显示
              },
              forceCalculation: true, // 强制计算公式
              data: exportJson.sheets
            })
            document.getElementById('luckysheetShow').style.height = '750px'
            document.getElementById('luckysheetShow').style.width = '1200px'
          })
        } else if (this.pptType.indexOf(this.fileType) !== -1) {
          this.isImageType = false
          this.isPdfType = false
          this.isTxtType = false
          this.isWordType = false
          this.isExcelType = false
          this.isPptype = true
          $('#uploadFileInput').pptxToHtml({
            pptxFileUrl: row.url,
            slideMode: false,
            keyBoardShortCut: false,
            slideModeConfig: { // on slide mode (slideMode: true)
              first: 1,
              nav: true,
              /** true,false : show or not nav buttons*/
              navTxtColor: 'white',
              /** color */
              navNextTxt: '&#8250;', // ">"
              navPrevTxt: '&#8249;', // "<"
              showPlayPauseBtn: false,
              /** true,false */
              keyBoardShortCut: false,
              /** true,false */
              showSlideNum: false,
              /** true,false */
              showTotalSlideNum: false,
              /** true,false */
              autoSlide: false,
              /** false or seconds (the pause time between slides) , F8 to active(keyBoardShortCut: true) */
              randomAutoSlide: false,
              /** true,false ,autoSlide:true */
              loop: false,
              /** true,false */
              background: 'black',
              /** false or color*/
              transition: 'default',
              /** transition type: "slid","fade","default","random" , to show transition efects :transitionTime > 0.5 */
              transitionTime: 3 /** transition time in seconds */
            }
          })
        } else {
          this.isImageType = false
          this.isPdfType = false
          this.isTxtType = false
          this.isWordType = false
          this.isExcelType = false
          this.isPptype = false
        }
      })
    },
    changeTab() {
      // this.searchContract()
      this.searchProject()
    },
    downLoadFile(row) {
      axios({
        method: 'get',
        url: MESDownloadFile,
        params: {
          id: row.idd + '.' + row.suffix
        },
        responseType: 'blob'
      }).then(res => {
        var a = document.createElement('a')
        a.download = row.name
        a.href = window.URL.createObjectURL(res.data)
        document.body.append(a)
        a.click()
        document.body.removeChild(a)
      })
    },
    deleteFileData(row) {
      if (parseInt(this.id) !== parseInt(this.currentData.rowsa)) {
        this.$message.error('不能删除其他人的文件')
        return
      }
      axios({
        method: 'get',
        url: MESDeleteFile,
        params: {
          id: row.idd + '.' + row.suffix
        }
      }).then(res => {
        console.log(res)
      })
      var param = []
      param[0] = ['num', row.id]
      var Data = this.CreateData(
        '12',
        'PDM_项目名称_客户提供资料_删除数据',
        param
      )
      this.ExecDatabase(Data).then(res => {
        if (res.data[0].result === '1') {
          this.searchWord()
          this.$message.success('删除成功')
        } else {
          this.$message.error('删除失败')
        }
      })
    },
    getNode() {
      this.dragState = 1
      this.oldTaskId = this.taskID
    },
    setNode() {
      var param = []
      param[0] = ['ID', this.oldTaskId]
      param[1] = ['父节点', this.taskID]
      var Data = this.CreateData('11', '项目管理_修改父节点_验证', param)
      this.ExecDatabase(Data).then(response => {
        if (Number(response.data[0].条数) === 0) {
          var param = []
          param[0] = ['ID', this.oldTaskId]
          param[1] = ['父节点', this.taskID]
          var Data = this.CreateData('12', '项目管理_修改父节点', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '操作成功',
                type: 'success'
              })
              this.searchTable()
              this.dragState = 0
              this.oldTaskId = ''
            } else {
              this.$message.error('操作失败')
            }
          })
        } else {
          this.$message.warning('禁止拖至自身及其子节点！')
        }
      })
    },
    cancel() {
      this.dragState = 0
      this.oldTaskId = ''
    },
    getDate() {
      var now = new Date()
      var year = now.getFullYear()
      var month = now.getMonth()
      var date = now.getDate()
      var hour = now.getHours()
      var minute = now.getMinutes()
      var second = now.getSeconds()
      month = month + 1
      month = month.toString().padStart(2, '0')
      date = date.toString().padStart(2, '0')
      hour = hour.toString().padStart(2, '0')
      minute = minute.toString().padStart(2, '0')
      second = second.toString().padStart(2, '0')
      return `${year}-${month}-${date} ${hour}:${minute}:${second}`
    },
    getDate1() {
      var now1 = new Date()
      var now = new Date(now1.getTime() + 1000 * 60 * 60 * 24)
      var year = now.getFullYear()
      var month = now.getMonth()
      var date = now.getDate()
      var hour = now.getHours()
      var minute = now.getMinutes()
      var second = now.getSeconds()
      month = month + 1
      month = month.toString().padStart(2, '0')
      date = date.toString().padStart(2, '0')
      hour = hour.toString().padStart(2, '0')
      minute = minute.toString().padStart(2, '0')
      second = second.toString().padStart(2, '0')
      return `${year}-${month}-${date} ${hour}:${minute}:${second}`
    },
    getDate2() {
      var now = new Date()
      var year = now.getFullYear()
      var month = now.getMonth()
      var date = now.getDate()
      month = month + 1
      month = month.toString().padStart(2, '0')
      date = date.toString().padStart(2, '0')
      var defaultDate = `${year}-${month}-${date}`
      return defaultDate
    },
    getDate3() {
      var now = new Date()
      var hour = now.getHours()
      var minute = now.getMinutes()
      var second = now.getSeconds()
      hour = hour.toString().padStart(2, '0')
      minute = minute.toString().padStart(2, '0')
      second = second.toString().padStart(2, '0')
      // var defaultDate = `${hour}:${minute}:${second}`
      var defaultDate = `${hour}:${minute}`
      defaultDate = this.roundToNearestQuarterHour(defaultDate)
      return defaultDate
    },

    // 格式化时间 转为最近的时间
    roundToNearestQuarterHour(timeStr) {
      let [hours, minutes] = timeStr.split(':').map(Number)
      minutes = Math.round(minutes / 10) * 10

      if (minutes === 60) {
        minutes = 0
        hours += 1
      }

      if (hours >= 24) {
        hours = 0
      }

      // 格式化小时和分钟，确保两位数字显示
      hours = hours.toString().padStart(2, '0')
      minutes = minutes.toString().padStart(2, '0')

      // 返回新的时间字符串
      return `${hours}:${minutes}`
    },
    searchContract() {
      this.contractNo = []
      var param = []
      var Data = this.CreateData('11', '项目管理_项目列表_查询', param)
      this.ExecDatabase(Data).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.contractNo.push({
            label: response.data[i].工作内容,
            value: response.data[i].ID
          })
        }
      })
    },
    searchPeople() {
      this.peopleNames = []
      this.peopleName = ''
      var param = []
      var Data = this.CreateData('11', '项目管理_人员列表_查询', param)
      this.ExecDatabase(Data).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.peopleNames.push({
            label: response.data[i].姓名,
            value: response.data[i].人员编号
          })
        }
        this.peopleName = parseInt(this.id)
        this.searchTable()
      })
    },
    searchProject() {
      this.projectList = []
      this.projectListName = ''
      var param = []
      param[0] = ['状态', 9999]
      var Data = this.CreateData('11', '项目管理_关系_查询节点_日报', param)
      this.ExecDatabase(Data).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.projectList.push({
            label: response.data[i].节点名称,
            value: response.data[i].节点ID
          })
        }
        this.projectListName = response.data[0]['节点ID']
      })
    },
    searchProject_Info() {
      this.projectList_Info = []
      this.projectListName_Info = ''
      this.form1.子项目 = ''
      var param = []
      param[0] = ['项目id', this.form1.填报项目]
      var Data = this.CreateData('11', '项目管理_详情_关系_查询节点_日报', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data.length === 0) {
          this.$message.error('该项目没有【进行中/已完成】的子项目！')
          return
        }
        for (let i = 0; i < response.data.length; i++) {
          this.projectList_Info.push({
            label: `【${response.data[i].状态名称}→${response.data[i].姓名}】${response.data[i].子项目内容}`,
            value: response.data[i].子项目节点ID
          })
        }
        this.form1.子项目 = response.data[0].子项目节点ID
      })
    },
    searchTable() {
      // this.startTime = Date.now()
      // let check, check1
      // this.contractNoValue ? (check = 1) : (check = 0)
      // this.peopleName ? (check1 = 1) : (check1 = 0)
      // this.dateRange ? check1 = 1 : (check1 = 0, this.dateRange = '')
      var param = []
      param[0] = ['月份', this.contractNoValue_Date]
      param[1] = ['人员编号', this.peopleName]
      param[2] = ['人员编号登录', this.id]
      var Data = this.CreateData('11', '项目管理_详情内容_查询', param)
      this.ExecDatabase(Data)
        .then(response => {
          this.TaskData = []
          this.tasks = []
          this.endTime = Date.now()
          if (response.data.length !== 0) {
            this.paIndex = 1
            for (let i = 0; i < response.data.length; i++) {
              if (response.data[i].类型 === 'project') {
                this.paIndex++
                this.TaskData.push({
                  // 表示将从数据库中查询到的数据，分别对应填充到表格中
                  id: response.data[i].ID,
                  label: response.data[i].工作内容,
                  nums: response.data[i].状态,
                  user: response.data[i].姓名,
                  rowsa: response.data[i].人员编号,
                  remark: response.data[i].备注,
                  time: response.data[i].持续时间,
                  updateTime: response.data[i].修改时间,
                  start: response.data[i].计划开始时间,
                  end: response.data[i].计划完成时间,
                  mark: response.data[i].当前进行,
                  projectName: response.data[i].节点名称,
                  project_info: response.data[i].子项目内容,
                  project_info_id: response.data[i].子项目节点id,
                  projectSelectId: response.data[i].项目节点id,
                  duration:
                    new Date(response.data[i].计划完成时间).getTime() -
                    new Date(response.data[i].计划开始时间).getTime(),
                  collapsed: response.data[i].是否隐藏,
                  fileCount: `<span style="color: #0ba9e3">${response.data[i].文件数量 === 0 ? '' : response.data[i].文件数量}</span>`,
                  percent: 50,
                  type: response.data[i].类型,
                  style: {
                    base: {
                      fill: '#0287D0',
                      stroke: '#0077C0'
                    }
                  }
                })
              } else if (response.data[i].类型 === 'milestone') {
                this.TaskData.push({
                  // 表示将从数据库中查询到的数据，分别对应填充到表格中
                  id: response.data[i].ID,
                  label: response.data[i].工作内容,
                  nums: response.data[i].状态,
                  user: response.data[i].姓名,
                  rowsa: response.data[i].人员编号,
                  remark: response.data[i].备注,
                  time: response.data[i].持续时间,
                  updateTime: response.data[i].修改时间,
                  parentId: response.data[i].父节点,
                  start: response.data[i].计划开始时间,
                  end: response.data[i].计划完成时间,
                  mark: response.data[i].当前进行,
                  projectName: response.data[i].节点名称,
                  project_info: response.data[i].子项目内容,
                  project_info_id: response.data[i].子项目节点id,
                  projectSelectId: response.data[i].项目节点id,
                  duration:
                    new Date(response.data[i].计划完成时间).getTime() -
                    new Date(response.data[i].计划开始时间).getTime(),
                  collapsed: response.data[i].是否隐藏,
                  fileCount: `<span style="color: #0ba9e3">${response.data[i].文件数量 === 0 ? '' : response.data[i].文件数量}</span>`,
                  percent: 50,
                  type: response.data[i].类型,
                  style: {
                    base: {
                      fill: '#8E44AD',
                      stroke: '#7E349D'
                    }
                  }
                })
              } else {
                this.TaskData.push({
                  // 表示将从数据库中查询到的数据，分别对应填充到表格中
                  id: response.data[i].ID,
                  label: response.data[i].工作内容,
                  nums: response.data[i].状态,
                  user: response.data[i].姓名,
                  rowsa: response.data[i].人员编号,
                  remark: response.data[i].备注,
                  time: response.data[i].持续时间,
                  updateTime: response.data[i].修改时间,
                  parentId: response.data[i].父节点,
                  start: response.data[i].计划开始时间,
                  end: response.data[i].计划完成时间,
                  mark: response.data[i].当前进行,
                  projectName: response.data[i].节点名称,
                  project_info: response.data[i].子项目内容,
                  project_info_id: response.data[i].子项目节点id,
                  projectSelectId: response.data[i].项目节点id,
                  duration:
                    new Date(response.data[i].计划完成时间).getTime() -
                    new Date(response.data[i].计划开始时间).getTime(),
                  collapsed: response.data[i].是否隐藏,
                  fileCount: `<span style="color: #0ba9e3">${response.data[i].文件数量 === 0 ? '' : response.data[i].文件数量}</span>`,
                  percent: 50,
                  type: response.data[i].类型,
                  style: {
                    base: {
                      fill: '#1EBC61',
                      stroke: '#0EAC51'
                    }
                  }
                })
              }
            }
            this.tasksUpdates(this.TaskData, 2)
          }
        })
      // .then(() => {
      //   if (this.TaskData.length > 0) {
      //     this.showGantt = true
      //     // 保留一个原数组  深拷贝
      //     this.dataBackups = JSON.parse(JSON.stringify(this.TaskData))
      //     // 直接分页重置数据
      //     this.pageResetData()
      //     this.optionsUpdate(this.options, 2)
      //   }
      // })
      // .then(() => {
      //   for (let i = 0; i < this.TaskData.length; i++) {
      //     if (
      //       this.getDate2() ===
      //       (this.TaskData[i].start
      //         ? this.TaskData[i].start.split(' ')[0]
      //         : '')
      //     ) {
      //       if (document.getElementById(this.TaskData[i].id)) {
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[4].style.color = '#333399'
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[4].style.fontWeight = '700'
      //         // document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[4].style.fontSize = '16px'
      //       }
      //     }
      //     if (this.TaskData[i].mark === 1) {
      //       if (document.getElementById(this.TaskData[i].id)) {
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[3].style.color = '#333399'
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[3].style.fontWeight = '700'
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[3].style.fontSize = '16px'
      //       }
      //     } else {
      //       if (document.getElementById(this.TaskData[i].id)) {
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[3].style.color = 'rgb(96, 96, 96)'
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[3].style.fontWeight = 'normal'
      //         document
      //           .getElementById(this.TaskData[i].id)
      //           .getElementsByClassName(
      //             'gantt-elastic__task-list-item-value'
      //           )[3].style.fontSize = '12px'
      //       }
      //       // document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value').style.background = 'rgb(255, 255, 255)'
      //     }
      //   }
      //   this.endTime = Date.now()
      // })
    },
    submitOrder(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          var param = []
          param[0] = ['ID', this.form.ID]
          param[1] = ['工作内容', this.form.工作内容]
          param[2] = ['状态', this.form.状态]
          param[3] = ['计划开始时间', this.form.工作时间[0]]
          param[4] = ['计划完成时间', this.form.工作时间[1]]
          param[5] = ['备注', this.form.备注]
          param[6] = ['日期', this.form.日期]
          param[7] = ['子项目节点ID', this.form.子项目]
          var Data = this.CreateData(
            '12',
            '项目管理_日报填写_编辑',
            param
          )
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '信息编辑成功',
                type: 'success'
              })
              this.searchTable()
              this.searchContract()
              this.searchPeople()
            } else {
              this.$message.error('信息编辑失败')
            }
          })
          this.dialogFormVisible = false
        } else {
          return false
        }
      })
    },
    submitOrder1(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          var param = []
          param[0] = ['ID', this.taskID]
          param[1] = ['工作内容', this.form.名称]
          param[2] = ['状态', this.form.状态]
          param[3] = ['计划开始时间', this.form.开始时间]
          param[4] = ['计划完成时间', this.form.结束时间]
          param[5] = ['备注', this.form.备注]
          var Data = this.CreateData(
            '12',
            '项目管理_详情内容_修改数据_MESWORK',
            param
          )
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '信息编辑成功',
                type: 'success'
              })
              this.searchTable()
            } else {
              this.$message.error('信息编辑失败')
            }
          })
          this.dialogFormVisible = false
        } else {
          return false
        }
      })
    },
    callOff(formName) {
      this.dialogFormVisible = false
      this.dialogFormVisible1 = false
      this.$refs[formName].resetFields()
    },
    rightShow(data) {
      const menu = this.$refs.msgRightMenu
      if (data.type !== 'task') {
        menu.style.display = 'none'
        return
      }
      this.currentData = data
      this.taskID = data.id
      this.parentID = data.id
      this.setParentId = data.parentId
      this.startTime = data.start
      this.endTime = data.end
      this.state = data.nums
      this.projectName = data.label
      this.type = data.type
      this.remarks = data.remark
      this.people = data.rowsa
      this.nowD = data.mark
      this.isPersoncontextMenus = true
      var evt = event || window.event
      var clientWidth =
        document.documentElement.clientWidth || document.body.clientWidth
      var scrollLeft =
        document.documentElement.scrollLeft || document.body.scrollLeft

      var clientHeight =
        document.documentElement.clientHeight || document.body.clientHeight
      var scrollTop =
        document.documentElement.scrollTop || document.body.scrollTop

      // 给left和top分别赋值为鼠标的位置；
      menu.style.left = evt.pageX + 'px'
      menu.style.top = evt.pageY - 60 + 'px'
      // 如果鼠标右边放不下菜单，就把left的值的改了
      if (evt.pageX + 100 > clientWidth + scrollLeft) {
        // 菜单应该在鼠标左边；
        var left1 = evt.pageX - 100
        menu.style.left = left1 + 'px'
      }
      // 如果鼠标下边放不下菜单，就把top的值的改了
      if (evt.pageY + 220 > clientHeight + scrollTop) {
        var top1 = evt.pageY - 220
        menu.style.top = top1 + 'px'
      }

      menu.style.display = 'block'
    },
    closeMenu() {
      const menu = this.$refs.msgRightMenu
      if (menu) menu.style.display = 'none'
    },
    searchLabel(data, title) {
      this.remark = data
      this.dialogVisible1 = true
      this.searchTitle = title
    },
    // methods
    // showNo() {
    //   const menu = this.$refs.msgRightMenu
    //   menu.style.display = 'none'
    // },
    // addTask() {
    //   this.tasks.push({
    //     id: this.lastId++,
    //     label:
    //       '<a href="https://images.pexels.com/photos/423364/pexels-photo-423364.jpeg?auto=compress&cs=tinysrgb&h=650&w=940" target="_blank" style="color:#0077c0;">Yeaahh! you have added a task bro!</a>',
    //     user:
    //       '<a href="https://images.pexels.com/photos/423364/pexels-photo-423364.jpeg?auto=compress&cs=tinysrgb&h=650&w=940" target="_blank" style="color:#0077c0;">Awesome!</a>',
    //     start: getDate(24 * 3),
    //     duration: 1 * 24 * 60 * 60 * 1000,
    //     percent: 50,
    //     type: "project"
    //   });
    // },
    searchData() {
      this.drawer = true
    },
    setNow() {
      if (Number(this.id) === this.people) {
        var param = []
        param[0] = ['ID', this.taskID]
        param[1] = ['人员编号', this.id]
        param[2] = ['当前进行', this.nowD]
        var Data = this.CreateData(
          '12',
          '项目管理_详情内容_设置当前进行',
          param
        )
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === '1') {
            this.$message({
              message: '操作成功',
              type: 'success'
            })
            this.searchTable()
          } else {
            this.$message.error('操作失败')
          }
        })
      } else {
        this.$message.warning('禁止操作他人数据')
      }
    },
    searchWord() {
      this.hadFile = []
      var param = []
      param[0] = ['id', this.taskID]
      var Data = this.CreateData(
        '11',
        'PDM_项目名称_客户提供资料_查询数据',
        param
      )
      this.fileContentImg = ''
      this.fileContentPdf = ''
      this.fileContent = ''
      this.fileName = ''
      this.ExecDatabase(Data).then(res => {
        this.suffix = res.data
        if (res.data.length > 0) {
          const server = `${MESDownloadFile}`.split('/')
          res.data.map(item => {
            this.hadFile.push({
              url: `http://${server[2]}/webpage/part/${item.uid}.${item.suffix
                }`,
              name: `${item.name}.${item.suffix}`,
              suffix: item.suffix,
              id: item.num,
              idd: item.uid
            })
          })
        }
      })
      this.dialogVisible = true
    },

    batchImportOfDrawings() {
      this.action = `${MESUploadFileProject}?&num=1&tableName=PDM_图档管理_通用文件&type=1&UploaderName=${this.id
        }&projectValue=${this.taskID}`
    },
    uploadSuccess(res, file, fileList) {
      if (res[0].result === '1') {
        const index = fileList.indexOf(file)
        fileList.splice(index, 1)
      } else {
        this.$message.error(
          `${file.name}文件上传失败，请检查上传文件是否正确！`
        )
      }
      if (fileList.length === 0) {
        this.searchWord()
        this.$message.success('文件上传成功')
      }
    },
    uploadFailure(res, file, fileList) {
      fileList.map(file => {
        this.$message.error(
          `${file.name}文件上传失败，请检查上传文件是否正确！`
        )
      })
    },
    beforeUpload(file) {
      // 获取上传文件大小
      const imgSize = Number(file.size / 1024 / 1024)
      if (imgSize > 5) {
        this.$msgbox({
          title: '',
          message: '文件大小不能超过5MB，请重新上传。',
          type: 'warning'
        })
        return false
      }
      return true
    },
    getTody(n, ds = 0, ys = 0) {
      var now = new Date(n)
      var time = now - 24 * 60 * 60 * 1000 * ds // 获取前N天
      var d = new Date(time)
      var year = d.getFullYear() - ys // 获取前N年的时间
      var mon = d.getMonth() + 1
      var day = d.getDate()
      var times = ''
      if (mon === 0) {
        times = 12 + '-' + (day < 10 ? '0' + day : day)
      } else if (mon < 10) {
        times =
          (mon < 10 ? '0' + mon : mon) + '-' + (day < 10 ? '0' + day : day)
      } else {
        times = mon + '-' + (day < 10 ? '0' + day : day)
      }
      var today = year + '-' + times

      return today
    },
    // 计算时间差
    datedifference(date1, date2) {
      // sDate1和sDate2是2006-12-18格式
      var dateSpan, iDays
      var sDate1 = this.getTody(date1)
      sDate1 = Date.parse(sDate1)
      var sDate2 = this.getTody(date2)
      sDate2 = Date.parse(sDate2)
      dateSpan = sDate2 - sDate1
      dateSpan = Math.abs(dateSpan)
      iDays = Math.floor(dateSpan / (24 * 3600 * 1000))
      return iDays
    },
    // 获取数据-----------------------------------------------------
    getTaskList(id) {
      var that = this

      var params = {}
      params['projectId'] = id
      this.$ajax
        .post('/ipm/index.php?a=default.taskList', params)
        .then(function (res) {
          if (res.data.success) {
            // that.showGantt = true;
            that.TaskData.length = []
            var list = res.data.datas
            var startTime = list[0].startTime
            var endTime = list[list.length - 1].endTime
            var diffTime = that.datedifference(endTime, startTime)
            var temp1 = {
              id: Number(id),
              label: that.gantData.name,
              nums: '',
              user: '无',
              start: startTime,
              end: endTime,
              duration: diffTime * 24 * 60 * 60 * 1000,
              percent: 85,
              type: 'project'
            }
            that.TaskData.push(temp1)
            for (var i = 0; i < list.length; i++) {
              var temp = {
                id: Number(list[i].id) + 1,
                code: list[i].code,
                label:
                  '<span style="color:#0077c0;">' + list[i].name + '</span>',
                text: list[i].name,
                nums: list[i].statusText,
                user: list[i].operatePerson,
                parentId: Number(list[i].projectId), // parentId 要跟父级的id对应
                start: list[i].startTime,
                end: list[i].endTime,
                duration:
                  that.datedifference(list[i].endTime, list[i].startTime) *
                  24 *
                  60 *
                  60 *
                  1000, // 获取时间差 任务完成的时间段
                percent: 50,
                type: 'milestone',
                // collapsed: true,
                style: {
                  base: {
                    fill: '#1EBC61',
                    stroke: '#0EAC51'
                  }
                }
              }
              that.TaskData.push(temp)
            }

            if (that.TaskData.length > 0) {
              that.showGantt = true
              that.tasksUpdates(that.TaskData, 2)
              that.optionsUpdate(that.options, 2)
            }
          } else {
            that.showGantt = false
            that.$message.warning(res.data.message)
          }
        })
      console.log(id, 10101010)
    },

    // 修改数据排序
    orderByTable() {
      this.pageResetData()
    },
    writeDayContent() {
      this.form1.日期 = this.getDate2()
      this.form1.工作时间 = [this.getDate3(), this.getDate3()]
      this.form1.状态 = '已完成'
      this.form1.填报人员 = parseInt(this.id)
      this.form1.填报项目 = this.projectListName
      this.form1.工作内容 = ''
      this.form1.备注 = ''
      this.searchProject_Info()
      this.titleForDayContent = `日报填写【${this.name}】`
      this.dialogFormVisible1 = true
      this.submitNoOk = false
    },
    submitOrderDay(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.form1.工作时间[0] == this.form1.工作时间[1]) {
            this.$message.error('开始时间与结束时间不能相同，请修改！')
            return
          }
          if (this.form1.工作时间[0] > this.form1.工作时间[1]) {
            this.$message.error('开始时间必须早于结束时间，请修改！')
            return
          }
          this.submitNoOk = true
          var param = []
          param[0] = ['日期', this.form1.日期]
          param[1] = ['工作内容', this.form1.工作内容]
          param[2] = ['状态', this.form1.状态]
          param[3] = ['计划开始时间', this.form1.工作时间[0]]
          param[4] = ['计划完成时间', this.form1.工作时间[1]]
          param[5] = ['人员编号', this.id]
          param[6] = ['备注', this.form1.备注]
          param[7] = ['负责人', this.name]
          param[8] = ['项目ID', this.form1.填报项目]
          param[9] = ['子项目ID', this.form1.子项目]
          var Data = this.CreateData(
            '12',
            '项目管理_日报填写',
            param
          )
          this.ExecDatabase(Data).then(response => {
            this.submitNoOk = false
            if (response.data[0].result === '1') {
              this.$message({
                message: '信息增加成功',
                type: 'success'
              })
              this.form1.工作内容 = ''
              this.form1.备注 = ''
              this.searchTable()
              // this.searchNowWorkStatus()
            } else {
              this.$message.error('信息增加失败')
            }
          })
        } else {
          return false
        }
      })
    },
    // 点击弹出-----------------------------------------------------
    showDialog(data) {
    },
    editTask() {
      if (this.$refs['form'] !== undefined) {
        // this.$refs['form'].resetFields()
        this.form = {
          填报人员: '',
          填报项目: '',
          子项目: '',
          ID: '',
          日期: '',
          工作内容: '',
          状态: '',
          工作时间: [],
          备注: ''
        }
      }
      if (parseInt(this.id) !== parseInt(this.currentData.rowsa)) {
        this.$message.error('无法编辑其他人的日报')
        return
      }
      this.titleForDayContent = `日报编辑【${this.name}】`
      console.log(this.currentData)
      this.form.ID = this.currentData.id
      this.form.工作时间 = [this.currentData.start.slice(-5), this.currentData.end.slice(-5)]
      this.form.状态 = this.currentData.nums
      this.form.备注 = this.currentData.remark
      this.form.工作内容 = this.currentData.label
      this.form.日期 = this.currentData.start.substring(0, 10)
      this.form.填报人员 = parseInt(this.id)
      this.form.填报项目 = this.currentData.projectSelectId
      this.form1.填报项目 = this.currentData.projectSelectId
      this.form.子项目 = this.currentData.project_info_id
      this.searchProject_Info()
      this.dialogFormVisible = true
    },
    deleteTask() {
      if (parseInt(this.id) !== parseInt(this.currentData.rowsa)) {
        this.$message.error('不能删除其他人的日报')
        return
      }
      var param = []
      param[0] = ['ID', this.currentData.id]
      param[1] = ['人员编号', this.id]
      var Data = this.CreateData(
        '11',
        '项目管理_详情内容_删除数据_验证人员',
        param
      )
      this.ExecDatabase(Data).then(response => {
        if (response.data[0].条数 > 0) {
          var param = []
          param[0] = ['ID', this.taskID]
          var Data = this.CreateData(
            '11',
            '项目管理_详情内容_删除数据_验证',
            param
          )
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].条数 === 0) {
              this.$confirm('是否删除?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              })
                .then(() => {
                  var param = []
                  param[0] = ['ID', this.taskID]
                  var Data = this.CreateData(
                    '12',
                    '项目管理_详情内容_删除数据_MESWORK',
                    param
                  )
                  this.ExecDatabase(Data).then(response => {
                    if (response.data[0].result === '1') {
                      this.$message.success('删除成功')
                      this.searchTable()
                    } else {
                      this.$message.error('删除失败')
                    }
                  })
                })
                .catch(() => {
                  this.$message({
                    type: 'info',
                    message: '已取消删除'
                  })
                })
            } else {
              this.$message.error('请先将子节点删除！')
            }
          })
        } else {
          this.$message.error('不能删除其他人的日报！')
        }
      })
    },
    currentRow(data) {
      for (let i = 0; i < this.TaskData.length; i++) {
        if (data.id === this.TaskData[i].id) {
          document.getElementById(this.TaskData[i].id).style.background = '#FFE4E1'
          const a = document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')
          for (const aElement of a) {
            if (aElement) {
              aElement.style.background = '#FFE4E1'
            }
          }
        } else {
          if (document.getElementById(this.TaskData[i].id)) {
            document.getElementById(this.TaskData[i].id).style.background = 'transparent'
            const a = document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')
            for (const aElement of a) {
              if (aElement) {
                aElement.style.background = 'rgb(255, 255, 255)'
              }
            }
          }
        }
      }
    },
    tasksUpdates(tasks, num) {
      if (num === 2) {
        // this.tasks = [];
        this.tasks = tasks
      } else {
        for (let i = 0; i < tasks.length; i++) {
          if (this.getDate2() === (tasks[i].start ? tasks[i].start.split(' ')[0] : '')) {
            if (document.getElementById(tasks[i].id)) {
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[4].style.color = '#333399'
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[4].style.fontWeight = '700'
              // document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[4].style.fontSize = '16px'
            }
          }
          if (tasks[i].mark === 1) {
            if (document.getElementById(tasks[i].id)) {
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[3].style.color = '#333399'
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[3].style.fontWeight = '700'
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[3].style.fontSize = '16px'
            }
          } else {
            if (document.getElementById(tasks[i].id)) {
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[3].style.color = 'rgb(96, 96, 96)'
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[3].style.fontWeight = 'normal'
              document
                .getElementById(tasks[i].id)
                .getElementsByClassName(
                  'gantt-elastic__task-list-item-value'
                )[3].style.fontSize = '12px'
            }
            // document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value').style.background = 'rgb(255, 255, 255)'
          }
        }
      }
      // for (let i = 0; i < this.TaskData.length; i++) {
      //   console.log(this.TaskData[i].mark, 999988)
      //   if (this.TaskData[i].mark === 1) {
      //     document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[3].style.color = '#333399'
      //     document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[3].style.fontWeight = '700'
      //     document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[3].style.fontSize = '16px'
      //     console.log(document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[3].style.background, 999999999)
      //   } else {
      //     // console.log(document.getElementById(this.TaskData[i].id), 777777)
      //     document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[3].style.color = 'rgb(96, 96, 96)'
      //     document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[3].style.fontWeight = 'normal'
      //     document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value')[3].style.fontSize = '12px'
      //     // document.getElementById(this.TaskData[i].id).getElementsByClassName('gantt-elastic__task-list-item-value').style.background = 'rgb(255, 255, 255)'
      //   }
      // }
    },
    optionsUpdate(options, num) {
      if (num === 2) {
        this.options = options
      }
    },
    styleUpdate(style) {
      this.dynamicStyle = style
    },
    // 切换每页条数方法
    pageHandleSizeChange(val) {
      this.pageSize = val
      this.currentPage = 1
      this.pageResetData()
    },
    // 切换页面方法
    pageHandleCurrentChange(val) {
      this.currentPage = val
      this.pageResetData()
    },

    // 分页选择重置数据方法
    pageResetData() {
      // 存储排序后数组
      let sortList = []
      // 临时存放数据列表
      const dataList = []
      // 判断是第几个父元素
      let parentIndex = 0

      // 排序
      sortList = JSON.parse(JSON.stringify(this.dataBackups))
      if (this.orderByType === '近期') {
        sortList = sortList.sort(
          (a, b) => Date.parse(b.updateTime) - Date.parse(a.updateTime)
        )
        // sortList = this.dataBackups.sort(this.dateData("updateTime", false));
      } else if (this.orderByType === '远期') {
        sortList = sortList.sort(
          (a, b) => Date.parse(a.updateTime) - Date.parse(b.updateTime)
        )
        // sortList = this.dataBackups.sort(this.dateData("updateTime", true));
      }

      // 遍历进行分页
      for (const index in sortList) {
        const item = sortList[index]
        // 判断是否无父id
        if (!item.parentId) {
          parentIndex++
          if (
            parentIndex <= this.pageSize * this.currentPage &&
            parentIndex >= this.pageSize * (this.currentPage - 1)
          ) {
            dataList.push(item)
          }
        } else {
          dataList.push(item)
        }
      }

      // 更新数据
      this.tasksUpdates(dataList, 2)
    }
  }
}
</script>
<style lang="scss">
#menu {
  list-style: none;
  margin: 0px;
  padding: 0px;
  position: absolute;
  display: none;
  width: 100px;
  background-color: #f5f5f5;
  border: #dcdcdc 1px solid;
}

#menu li {
  line-height: 25px;
  font-size: 14px;
  padding: 3px 15px;
  text-align: center;
  /*&:hover{*/
  /*cursor: pointer;*/
  /*background-color: rgba(69, 86, 118, 0.44);*/
  /*color: #ffffff;*/
  /*}*/
}

#menu li:hover {
  background-color: #a9a9a9;
  /*&:hover{*/
  /*cursor: pointer;*/
  /*background-color: rgba(69, 86, 118, 0.44);*/
  /*color: #ffffff;*/
  /*}*/
}

hr {
  margin: 0px !important;
}

.wrapper {
  width: 95%;
  height: 50px;
  overflow: hidden;
  border: 1px solid #b8c7d9;
  /*float: left;*/
  margin: 10px;
}

.content {
  position: relative;
  padding: 8px 8px 0 8px;
}

.action {
  /*position: absolute;*/
  /*top: 2px;*/
  /*right: 8px;*/
}

.delete {
  padding: 0 5px;
  margin: auto 0;
  border-radius: 3px;
  color: #0f84b0;
  font-size: 12px;
}

.delete:hover {
  background: -webkit-linear-gradient(top, #0ba9e3, #0099d3);
  color: #fff;
}

a {
  text-decoration: none;
}

.icon {
  width: 30px;
  height: 30px;
  display: inline-block;
  margin-right: 7px;
  margin-top: 2px;
  font-size: 26px;
}

.info {
  /*height: 50px;*/
  position: absolute;
  left: 44px;
  line-height: 1;
  display: inline-block;
  color: #111111;
}

.pagiantion {
  display: inline-block;
  position: absolute;
  top: 50px;
  left: 20px;
}

.luckysheet-cols-menu {
  z-index: 99999;
}

.noView {
  font-size: 20px;
  text-align: center;
  line-height: 800px;
  color: #505050;
}
</style>
