crowd-test-service-frontend/src/components/project/Project.vue

<template>
  <div class="create-container" v-loading="loading">
    <div class="title h1" v-if="!isModifyMode">项目</div>
    <div class="create-body">
      <el-row type="flex" align="middle" justify="start">
        <el-col :span="15">
          <div class="title h2" v-if="!isModifyMode">基本信息</div>
          <div v-if="!isModifyMode" class="el-form-item">
            <label class="el-form-item__label" style="width: 30%;">编号</label>
            <div class="el-form-item__content" style="margin-left: 30%;">
              <div>{{projectId}}</div>
            </div>
          </div>
          <el-form :model="project" :rules="rules" ref="project" label-width="30%" class="demo-project">
            <el-form-item label="项目名称" prop="name">
              <el-input size="small" v-if="isModifyMode" v-model="project.name"></el-input>
              <span v-if="!isModifyMode" style="margin-right: 5px">{{project.name}}</span>
              <el-tag v-if="!isModifyMode" :type="project.statusVO&&project.statusVO.style">
                {{project.statusVO?project.statusVO.text:''}}
              </el-tag>
            </el-form-item>
            <el-form-item size="small" label="联系人" prop="contactName">
              <el-input v-if="isModifyMode" v-model="project.contactName" placeholder="请输入联系人姓名"></el-input>
              <span v-if="!isModifyMode">{{project.contactName}}</span>
            </el-form-item>
            <el-form-item size="small" label="联系人电话" prop="contactPhone">
              <el-input v-if="isModifyMode" v-model="project.contactPhone" placeholder="请输入联系人电话"></el-input>
              <span v-if="!isModifyMode">{{project.contactPhone}}</span>
            </el-form-item>
            <el-form-item size="small" label="预算" prop="budget">
              <el-input v-if="isModifyMode" type="number" v-model="project.budget">
                ¥
                <template slot="append"></template>
              </el-input>
              <span v-if="!isModifyMode">¥{{project.budget}}</span>
            </el-form-item>

            <el-form-item label="计价标准" prop="valuationStandard">
              <el-input style="width: 400px" autosize v-if="isModifyMode" type="textarea"
                        v-model="project.valuationStandard"></el-input>
              <span v-if="!isModifyMode">{{project.valuationStandard ? project.valuationStandard : '暂无'}}</span>
            </el-form-item>

            <!--            <el-form-item size="small" label="计价标准" prop="valuationStandard">-->
            <!--              <el-input v-if="isModifyMode" type="number" v-model="project.valuationStandard">-->
            <!--                <template slot="append"></template>-->
            <!--              </el-input>-->
            <!--              <span v-if="!isModifyMode">{{project.valuationStandard}}</span>-->
            <!--            </el-form-item>-->
            <!--            <el-form-item v-if="!isModifyMode" size="small" label="状态" prop="status">-->
            <!--              <span v-if="!isModifyMode">{{project.statusVO?project.statusVO.text:''}}</span>-->
            <!--            </el-form-item>-->
            <el-form-item size="small" label="区域管理员" prop="regionManagerName"
                          v-if="!isModifyMode && project.regionManagerName">
              <span>{{project.regionManagerName}}</span>
            </el-form-item>

            <el-form-item label="需求描述">
              <el-input style="width: 400px" autosize v-if="isModifyMode" type="textarea"
                        v-model="project.desc"></el-input>
              <span v-if="!isModifyMode">{{project.desc ? project.desc : '暂无'}}</span>
            </el-form-item>
            <!--<el-form-item label="价格" prop="price">-->
            <!--<el-input v-if="isModifyMode" type="number" v-model="project.price">-->
            <!--<template slot="append">¥</template>-->
            <!--</el-input>-->
            <!--<span v-if="!isModifyMode">{{project.price}}¥</span>-->
            <!--</el-form-item>-->
            <el-form-item label="领域类型" prop="field">
              <el-radio-group v-if="isModifyMode" v-model="project.field">
                <span v-for="(item,index) in fields" :key="index">
              <el-radio :label="item.name">{{ item.name }}&nbsp;&nbsp;&nbsp;&nbsp;</el-radio>
            </span>
              </el-radio-group>
              <span
                v-if="!isModifyMode"
                class="badge"
              >
              {{project.field}}</span>
            </el-form-item>

            <el-form-item label="应用类型" prop="platform">
              <el-radio-group v-if="isModifyMode" v-model="project.platform">
                <span v-for="(item,index) in platforms" :key="index">
              <el-radio :label="item.name">{{ item.name }}&nbsp;&nbsp;&nbsp;&nbsp;</el-radio>
            </span>
              </el-radio-group>
              <span
                v-if="!isModifyMode"
                class="badge"
              >
              {{project.platform}}</span>
            </el-form-item>

            <el-form-item label="测试类型" prop="type">
              <el-checkbox-group v-if="isModifyMode" v-model="project.type">
            <span v-for="(item,index) in serviceType" :key="index">
              <el-checkbox :label="item.name" name="type">{{ item.name }}&nbsp;&nbsp;</el-checkbox>
            </span>
              </el-checkbox-group>
              <span v-if="!isModifyMode" class="badge" v-for="item in project.type">{{item}}</span>
            </el-form-item>
            <!--<el-form-item label="用途" prop="usage">-->
            <!--<el-input v-if="isModifyMode" v-model="project.usage"></el-input>-->
            <!--<span v-if="!isModifyMode">{{project.usage}}</span>-->
            <!--</el-form-item>-->


            <el-form-item label="项目可见性" prop="resource">
              <div v-if="!isModifyMode">
                <div v-if="project.resource=='1'">{{updateLocation(project.location)}}</div>
                <div v-if="project.resource=='0'">定向</div>
                <div v-if="project.resource=='2'">{{resourceType[project.resource]}}</div>
              </div>
              <el-tabs :tab-position="tabPosition" v-model="project.resource" style="max-height: 200px;"
                       v-if="isModifyMode">

                <!--                <el-tab-pane :label="resourceType[0]" :name="0">-->
                <!--                  <el-radio-group v-model="project.institution">-->
                <!--                    <span v-for="(item,index) in institutionArray" :key="index">-->
                <!--                      <el-radio :label="item.id" name="type" style="margin: 3px">{{ item.name }}&nbsp;&nbsp;&nbsp;&nbsp;</el-radio>-->
                <!--                    </span>-->
                <!--                  </el-radio-group>-->
                <!--                </el-tab-pane>-->

                <el-tab-pane :label="resourceType[0]" :name="0">
                  <el-radio-group v-model="project.institution">
                    <el-radio v-for="(item,index) in institutionArray" :label="item.id" name="type" :key="index">
                      {{item.name}}
                    </el-radio>
                  </el-radio-group>
                </el-tab-pane>

                <el-tab-pane :label="resourceType[1]" :name="1">
                  <provincecity
                    ref="addFormProvince"
                    @selectChange="locationChange"
                    :provinceCode="project.location==null?'3200':project.location.provinceCode"
                    :cityCode="project.location==null?'3201':project.location.cityCode"
                  ></provincecity>
                </el-tab-pane>
                <el-tab-pane :label="resourceType[2]" :name="2"></el-tab-pane>
              </el-tabs>
            </el-form-item>

            <el-form-item label="需求文档" prop="doc">
              <el-upload
                style="width: 400px"
                v-if="isModifyMode"
                drag
                class="upload-demo"
                action=""
                :on-remove="handleRemove"
                :before-remove="beforeRemove"
                :limit="1"
                :on-exceed="handleExceed"
                :before-upload="beforeFileUpload"
                :http-request="uploadRequireDoc"
                :file-list="project.doc"
              >
                <i class="el-icon-upload"></i>
                <div class="el-upload__text">
                  将文件拖到此处，或
                  <em>点击上传</em>
                </div>
              </el-upload>
              <span>
            <a :href="project.requireDocUrl" v-if="project.requireDocUrl!=null && project.requireDocUrl!=''"><el-link
              :underline="false" type="primary"><i
              class="el-icon-document"></i>下载文档</el-link></a>
            <i v-if="project.requireDocUrl==null || project.requireDocUrl==''" class="el-icon-document">暂无文档</i>
          </span>
            </el-form-item>
            <el-form-item label="安装包" prop="file">
              <el-upload
                style="width: 400px"
                v-if="isModifyMode"
                drag
                class="upload-demo"
                action=""
                :on-remove="handleRemove"
                :before-remove="beforeRemove"
                :limit="1"
                :on-exceed="handleExceed"
                :before-upload="beforeApkUpload"
                :http-request="uploadApkFile"
                :file-list="project.file"
              >
                <i class="el-icon-upload"></i>
                <div class="el-upload__text">
                  将文件拖到此处，或
                  <em>点击上传</em>
                </div>
              </el-upload>
              <span>
                <a v-if="project.fileUrl!=null && project.fileUrl!=''" :href="project.fileUrl"><el-link :underline="false"
                                                                                                        type="primary"><i
                  class="el-icon-document"></i>下载文件</el-link></a>
                <i v-if="project.fileUrl==null || project.fileUrl==''" class="el-icon-document">暂无文件</i>
              </span>
            </el-form-item>
            <el-form-item label="委托单位" prop="entrustUnit" v-if="project.entrustUnit">
              <el-input style="width: 400px" autosize v-if="isModifyMode" type="textarea"
                        v-model="project.entrustUnit"></el-input>
              <span v-if="!isModifyMode">{{project.entrustUnit}}</span>
            </el-form-item>
            <el-form-item label="项目截止时间" prop="datetime">
              <div class="block" v-if="isModifyMode">
                <el-date-picker
                  size="small"
                  v-model="project.datetime"
                  type="datetime"
                  placeholder="选择截止时间"
                  align="right"
                  :picker-options="pickerOptions"
                ></el-date-picker>
              </div>
              <span v-if="!isModifyMode">{{dateFormat(new Date(project.datetime),'yyyy-MM-dd HH:mm:ss')}}</span>
            </el-form-item>
            <el-form-item v-if="isModifyMode">
              <div class="btn btn-small btn-info" @click="submitForm('project')">确认修改</div>
              <!--<div class="btn btn-small" @click="resetForm('project')">重置</div>-->
              <div class="btn btn-small" @click="cancelMode('project')">取消</div>
            </el-form-item>
            <el-form-item v-if="!isModifyMode">

              <el-button v-if="projectOperationControl.reject" type="danger" size="mini" @click="rejectProject()">
                拒绝项目
              </el-button>
              <el-button v-if="projectOperationControl.receive" type="primary" size="mini" @click="receiveProject()">
                接收项目
              </el-button>
              <el-button v-if="projectOperationControl.update" type="primary" size="mini" @click="modifyForm()">
                修改项目
              </el-button>
              <el-button v-if="projectOperationControl.createTask" type="primary" size="mini" @click="createNewTask()">
                新建任务
              </el-button>
              <el-button v-if="projectOperationControl.uploadReport" type="primary" size="mini" @click="createReport()">
                上传报告
              </el-button>
              <el-button v-if="projectOperationControl.finish" type="primary" size="mini"
                         @click="submitProjectRequest()">
                提交项目
              </el-button>
              <el-button v-if="projectOperationControl.confirmFinish" type="success" size="mini" @click="endProject()">
                结束项目
              </el-button>
            </el-form-item>
          </el-form>

        </el-col>
        <el-col :span="5" id="pieImage" style="height: 500px;min-width: 500px">
        </el-col>
      </el-row>
    </div>
    <!--    任务列表-->
    <div class="create-body" v-if="!isModifyMode">
      <div class="title h2">任务列表</div>
      <div class="task-list">
        <el-table :showHeader="true" :stripe="true" :data="task" style="width: 100%">
          <el-table-column prop="title" label="任务名称" title="任务名称">
            <template slot-scope="scope">
              <span>{{ scope.row.title }}</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="datetime" sortable label="任务截止时间">
            <template slot-scope="scope">
              <span>{{reformDate(new Date(scope.row.datetime))}}</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="resource" label="任务可见性">
            <template slot-scope="scope">
              <div v-if="scope.row.resource=='1'">{{scope.row.location.provinceCode}}/{{scope.row.location.cityCode}}
              </div>
              <div v-if="scope.row.resource=='0'">{{scope.row.agencyName}}</div>
              <div v-if="scope.row.resource=='2'">{{resourceType[scope.row.resource]}}</div>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="type" label="测试类型">
            <template slot-scope="scope">
              <div class="badge">{{scope.row.serviceType}}</div>
            </template>
          </el-table-column>
          <el-table-column align="center" label="状态">
            <template slot-scope="scope">
              <el-tag :type="scope.row.statusVO.style">{{scope.row.statusVO.text}}</el-tag>
            </template>
          </el-table-column>

          <el-table-column align="center" label="操作">

            <template slot-scope="scope">
              <div
                class="btn btn-small btn-info"
                @click="goToTaskDetail(projectId, scope.row.id)"
              >查看详情
              </div>
              <!--              <div-->
              <!--                class="btn btn-small btn-danger"-->
              <!--                @click="handleDelete(scope.$index, scope.row.id)"-->
              <!--              >删除-->
              <!--              </div>-->
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>

    <div class="create-body" v-if="!isModifyMode">
      <div class="title h2">项目报告</div>
      <report-list v-bind:reports="reportList" v-bind:taskId=null v-bind:projectId="projectId"/>
    </div>
  </div>
</template>

<script>
  import ReportList from '@/components/report/ReportList'
  import Http from '@/js/http.js'
  import Apis from '@/js/api.js'
  import ResourceType from '@/constants/enum/resource-type'
  import provincecity from '@/components/commons/ProvinceCity'
  import {notify} from '@/constants/index'
  import echarts from 'echarts'
  import {
    deleteTask,
    ensureEndProject,
    getAllFields,
    getAllInstitutions,
    getAllApplicationTypes,
    getAllServiceTypes,
    getFormalTimeFromDate,
    getProvinceCodeByProvinceName,
    getProvinceNameByProvinceCode,
    receiveProjectRequest,
    rejectProject,
    storageGet,
    submitProjectRequest
  } from '@/js/index'

  export default {
    name: 'Project',
    components: {
      provincecity,
      ReportList
    },
    data() {
      var validatePass = (rule, value, callback) => {
        var reg = /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/
        if (this.project.contactPhone) {
          if (!reg.test(this.project.contactPhone)) {
            callback(new Error('请检查手机号码'))
          } else {
            callback()
          }
        }
      }
      return {
        showTaskList: true,
        acceptedUserList: [],
        projectId: 0,
        user: {},
        loading: false,
        tabPosition: 'top',
        institutionArray: [],
        isModifyMode: false,
        platforms: [],
        fields: [],
        resourceType: ResourceType,
        serviceType: [],
        projectOperationControl: {
          confirmFinish: false,
          createTask: false,
          finish: false,
          receive: false,
          reject: false,
          update: false,
          uploadReport: false,
        },
        project: {
          userId: 0,
          name: '',
          type: [],
          platform: '',
          valuationStandard: '',
          entrustUnit: '',
          field: '',
          desc: '',
          resource: '',
          location: '',
          institution: {},
          regionManagerId: 0,
          regionManagerName: '',
          contactName: '',
          contactPhone: '',
          doc: [],
          requireDocUrl: '',
          file: [],
          fileUrl: '',
          budget: '',
          price: '',
          datetime: '',
          usage: '',
          status: '',
        },
        task: [],
        progress: [],
        reportList: [],
        pickerOptions: {
          disabledDate(time) {
            return time.getTime() <= Date.now();
          },
          shortcuts: [
            {
              text: '今天',
              onClick(picker) {
                picker.$emit('pick', new Date())
              }
            },
            {
              text: '明天',
              onClick(picker) {
                const date = new Date()
                date.setTime(date.getTime() + 3600 * 1000 * 24)
                picker.$emit('pick', date)
              }
            },
            {
              text: '一周后',
              onClick(picker) {
                const date = new Date()
                date.setTime(date.getTime() + 3600 * 1000 * 24 * 7)
                picker.$emit('pick', date)
              }
            }
          ]
        },
        rules: {
          name: [
            {required: true, message: '请输入项目名称', trigger: 'blur'},
            {min: 5, max: 50, message: '项目名称长度在 5 到 50 个字符', trigger: 'blur'}
          ],
          contactName: [
            {required: true, message: '请输入联系人姓名', trigger: 'blur'}
            // { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" }
          ],
          contactPhone: [
            {required: true, message: '请输入手机号', trigger: 'blur'},
            {min: 11, max: 11, message: '请输入正确的手机号', trigger: 'blur'},
            {
              validator: (rule, value, callback) => {
                if (!this.checkPhoneNumber(value)) {
                  callback(new Error('手机号输入有误'))
                } else {
                  callback()
                }
              }, trigger: 'blur'
            },
          ],
          type: [
            {
              type: 'array',
              required: true,
              message: '请至少选择一种测试类型',
              trigger: 'change'
            }
          ],
          platform: [
            {
              required: true,
              message: '请选择一个应用类型',
              trigger: 'change'
            }
          ],
          field: [
            {
              required: true,
              message: '请选择一个领域类型',
              trigger: 'change'
            }
          ],
          desc: [{required: false, message: '请填写描述', trigger: 'blur'}],
          //price: [{required: true, message: '请填写价格', trigger: 'blur'}],
          budget: [
            {required: true, message: '预算不可为空', trigger: 'blur'},
            {
              validator: (rule, value, callback) => {
                if (value < 0) {
                  callback(new Error('请输入不小于0的数'))
                } else {
                  callback()
                }
              }, trigger: 'blur'
            },
          ],
          resource: [
            {required: true},
            {
              validator: (rule, value, callback) => {
                if (value == 0 && this.project.institution == null) {
                  callback(new Error('定向发布至少要选择一个区域管理员'))
                } else {
                  callback()
                }
              }, trigger: 'change'
            },
          ],
          datetime: [{required: true, message: '截止时间不可为空', trigger: 'blur'}],
        }
      }
    },
    mounted() {
      this.$nextTick(() => {
        this.init();
      })
    },
    watch: {
      serviceType(val) {
        this.serviceType = val
      },
      institutionArray(val) {
        this.institutionArray = val
      },
      deep: true
    },
    methods: {
      updateLocation(location) {
        //console.log(location)
        const loactionName = getProvinceNameByProvinceCode(location.provinceCode, location.cityCode)
        // var provinceName = ''
        // var cityName = ''
        // for (var item of provinceCityJSON.provinces) {
        //   if (item.code === location.provinceCode) {
        //     provinceName = item.name
        //     for (var city of item.cities) {
        //       if (city.code === location.cityCode) {
        //         cityName = city.name
        //         break
        //       }
        //     }
        //   }
        // }
        return loactionName.provinceCode + ' / ' + loactionName.cityCode
      },
      init() {
        this.projectId = this.$route.params.projectId
        // this.setInstitutions()
        this.setUserInfo()
        this.loadData()
        //this.reformDate(123)
        // this.project.platform.map(item => {
        //   this.platformType.push(PlatformType[item])
        // })
      },
      //画个饼
      setEcharts() {
        // 基于准备好的dom，初始化echarts实例
        let myChart = echarts.init(document.getElementById('pieImage'))
        // 绘制图表
        var option = {
          tooltip: {
            trigger: 'item',
            formatter: '{a} <br/>{b}: {c} ({d}%)'
          },
          legend: {
            orient: 'vertical',
            x: 'left',
            data: ['已完成', '进行中']
          },
          series: [
            {
              name: '任务状态',
              type: 'pie',
              radius: ['50%', '70%'],
              avoidLabelOverlap: false,
              label: {
                normal: {
                  show: false,
                  position: 'center'
                },
                emphasis: {
                  show: true,
                  textStyle: {
                    fontSize: '30',
                    fontWeight: 'bold'
                  }
                }
              },
              labelLine: {
                normal: {
                  show: false
                }
              },
              data: this.progress,
              color: ['#909399', '#409EFF']
            }
          ]
        }
        myChart.setOption(option)
      },
      //提交修改
      submitForm(formName) {
        this.$refs['project'].validate(valid => {
          if (valid) {
            this.showLoading()
            const newProject = {
              userId: this.user.userVO.id,
              name: this.project.name,
              type: this.project.type,
              platform: this.project.platform,
              valuationStandard: this.project.valuationStandard,
              entrustUnit: this.project.entrustUnit,
              field: this.project.field,
              desc: this.project.desc,
              resource: this.project.resource,
              location: getProvinceNameByProvinceCode(this.project.location.provinceCode, this.project.location.cityCode),
              institution: this.project.institution == null ? null : this.project.institution,
              contactName: this.project.contactName,
              contactPhone: this.project.contactPhone,
              doc: this.project.requireDocUrl,
              file: this.project.fileUrl,
              budget: this.project.budget,
              price: this.project.price,
              datetime: this.project.datetime,
              usage: this.project.usage,
            }
            // console.log(newProject);
            Http.put(Apis.PROJECT.UPDATE_PROJECT.replace('{projectId}', this.projectId), newProject).then((res) => {
              // console.log(res)
              this.project.resource = res.projectDetails.resource
              this.project.location = getProvinceCodeByProvinceName(res.projectDetails.location.provinceCode, res.projectDetails.location.cityCode)
              this.project.datetime = new Date(res.projectDetails.datetime)
              this.changeValue(res);
              this.isModifyMode = false
              this.hideLoading()
              notify('success', '项目修改成功')
            }).catch(error => {
              this.hideLoading()
              notify('error', error.data)
              console.log(error)
            })
          } else {
            notify('error', '表单填写错误!')
            return false
          }
        })
      },
      changeValue(res) {
        this.project = res.projectDetails
        this.projectId = res.projectDetails.id
        this.project.fileUrl = res.projectDetails.file
        this.project.requireDocUrl = res.projectDetails.doc
        this.task = res.taskList
        this.reportList = res.reportList
        this.projectOperationControl = res.projectOperationControl
      },
      //重置表单
      resetForm(formName) {
        this.$refs[formName].resetFields()
        this.project.name = ''
        this.project.type = []
        this.project.platform = ''
        this.project.valuationStandard = ''
        this.project.entrustUnit = ''
        this.project.field = ''
        this.project.desc = ''
        this.project.doc = ''
        this.project.file = ''
        this.project.contactName = ''
        this.project.contactPhone = ''
        this.project.resource = '2'
        this.project.institution = ''
        this.project.datetime = ''
        this.project.price = ''
        this.project.usage = ''
        this.project.budget = ''
      },
      //进入修改项目页面
      modifyForm() {
        this.isModifyMode = true
        this.setServiceType()
        this.setFields()
        this.setPlatformType()
        // this.project.type = []
        // this.project.platform = ''
        // this.project.field = ''
        // console.log(this.project.doc)
        this.setInstitutions()
        //获得update 信息
        //this.loadData()
      },
      //接收项目
      receiveProject() {
        this.$confirm('确认接收项目？', '提示', {
          confirmButtonText: '确认接收',
          cancelButtonText: '取消',
          type: 'success'
        }).then(() => {
          this.showLoading()
          receiveProjectRequest(this.projectId, this.user.userVO.id, this.receiveProjectSuccess, this.receiveProjectFail)
        }).catch(() => {
        })
      },
      receiveProjectSuccess(res) {
        this.hideLoading()
        notify('success', '项目接收成功！')
        this.changeValue(res);
      },
      receiveProjectFail(error) {
        this.hideLoading()
        notify('error', '接收项目失败:' + error.data)
      },
      //拒绝项目
      rejectProject() {
        this.$confirm('确认拒绝项目？', '提示', {
          confirmButtonText: '确认拒绝',
          cancelButtonText: '取消',
          type: 'success'
        }).then(() => {
          this.showLoading()
          rejectProject(this.projectId, this.rejectProjectSuccess, this.rejectProjectFail)
        }).catch(() => {
        })

      },
      rejectProjectSuccess(res) {
        this.hideLoading()
        notify('success', '拒绝项目成功')
        this.changeValue(res);
      },
      rejectProjectFail(error) {
        this.hideLoading()
        notify('error', '拒绝项目失败：' + error.data)
      },
      //提交项目
      submitProjectRequestSuccess(res) {
        this.hideLoading()
        notify('success', '项目提交成功！')
        this.loadData()
        this.changeValue(res);
      },
      submitProjectRequest() {
        this.$confirm('确认提交项目？', '提示', {
          confirmButtonText: '确认提交',
          cancelButtonText: '取消',
          type: 'success'
        }).then(() => {
          this.showLoading()
          submitProjectRequest(this.projectId, this.submitProjectRequestSuccess, this.submitProjectRequestFail)
        }).catch(() => {
        })
      },
      submitProjectRequestFail(error) {
        this.hideLoading()
        notify('error', '提交项目失败：' + error.data)
      },
      //结束项目
      endProject() {
        this.$confirm('确认结束项目？', '提示', {
          confirmButtonText: '确认结束',
          cancelButtonText: '取消',
          type: 'success'
        }).then(() => {
          this.showLoading()
          ensureEndProject(this.projectId, this.endProjectSuccess, this.endProjectFail)
        }).catch(() => {
        })

      },
      endProjectSuccess(res) {
        this.hideLoading()
        notify('success', '项目提交成功！')
        this.loadData()
        this.changeValue(res);
      },
      endProjectFail(error) {
        this.hideLoading()
        notify('error', '结束项目失败：' + error.data)
      },
      cancelMode(formName) {
        this.isModifyMode = false
        this.loadData()

      },
      goToTaskDetail(projectId, taskId) {
        this.$router.push({
          name: 'Task',
          params: {projectId: projectId, taskId: taskId}
        })
      },
      createNewTask() {
        const that = this
        this.$router.push({
          name: 'TaskCreate',
          params: {projectId: that.projectId}
        })
      },
      createReport() {
        this.$router.push({
          name: 'ProjectReportCreate',
          params: {
            scope: 0,
            dependencyCode: this.projectId,
            projectId: this.projectId,
          }
        })
      },
      handleDelete(index, id) {
        this.$confirm('确认删除该任务?')
          .then(_ => {
            //done()
            //id->taskid
            console.log(id)
            console.log(this.projectId)
            deleteTask(this.projectId, id, this.deleteTaskSuccess, this.deleteTaskFail)
          })
          .catch(_ => {
            notify('error', '删除失败')
          })
        //this.task.splice(index, 1)
      },
      deleteTaskSuccess(res) {
        notify('success', '删除成功')
      },
      deleteTaskFail(error) {
        console.log(error)
        notify('error', '删除失败:' + error)
      },
      beforeApkUpload(file) {
        return true;
        //const fileTypeList = ['dmg', 'exe', 'apk']
        //return checkFileType(file, fileTypeList, this.beforeFileUploadError)
      },
      beforeFileUpload(file) {
        return true;
        //const fileTypeList = ['pdf', 'xls', 'xlsx', 'doc', 'docx', 'txt']
        //return checkFileType(file, fileTypeList, this.beforeFileUploadError)
      },
      beforeFileUploadError() {
        this.$message.error('上传文件只能是 PDF 、 DOC 、DOCX 、XLS、TXT、XLSX 格式!')
      },
      analyseDemand() {
        this.$router.push({name: 'AnalyseDemand'})
      },
      handleAccept(index, id) {
        console.log('接收')
      },
      handleReject(index, id) {
        console.log('拒绝')
      },
      loadData() {
        this.showLoading()
        Http.get(Apis.PROJECT.GET_PROJECT.replace('{projectId}', this.projectId)).then((res) => {
          this.project.desc = res.projectDetails.desc
          this.project.doc = []
          this.project.file = []
          this.project.resource = res.projectDetails.resource
          this.project.location = getProvinceCodeByProvinceName(res.projectDetails.location.provinceCode, res.projectDetails.location.cityCode)
          this.project.datetime = new Date(res.projectDetails.datetime)
          this.project.fileUrl = res.projectDetails.file
          this.project.requireDocUrl = res.projectDetails.doc
          this.project.userId = res.projectDetails.userId
          this.project.status = res.projectDetails.status
          this.project.statusVO = res.projectDetails.statusVO
          this.task = res.taskList
          this.reportList = res.reportList
          this.progress = res.progress
          this.changeValue(res);
          this.hideLoading()
          this.handleShowTaskListOrNot()
          for (var i = 0; i < this.progress.length; i++) {
            if (this.progress[i].value != 0) {
              this.setEcharts()
              break
            }
          }
        }).catch((error) => {
          this.hideLoading()
          // notify('error', error.data)
        })
      },

      handleShowTaskListOrNot() {
        // console.log(storageGet('user')['userVO']['id'])
        if (storageGet('user')['userVO']['id'] === this.project.userId) {
          this.showTaskList = false
        }
      },

      locationChange(provinceId, cityId) {
        if (provinceId || cityId) {
          this.project.location = {provinceCode: provinceId, cityCode: cityId}
        }
      },
      handleRemove(file, fileList) {
        console.log(file, fileList)
      },
      handleExceed(files, fileList) {
        this.$message.warning(
          `当前限制选择 1 个文件，本次选择了 ${
            files.length
          } 个文件，共选择了 ${files.length + fileList.length} 个文件`
        )
      },
      beforeRemove(file, fileList) {
        //return this.$confirm(`确定移除 ${file.name}？`)
      },
      beforeUploadRequireDoc() {
      },
      beforeUploadApkFile() {
      },
      uploadRequireDoc(param) {
        this.showLoading()
        const formData = new FormData()
        let config = {
          //添加请求头
          headers: {'Content-Type': 'multipart/form-data'},
        }
        formData.append('file', param.file)
        Http.upload(Apis.FILE.REQUIREMENT_FILE.replace('{userId}', this.user.userVO.id), formData, config).then((res) => {
          this.project.requireDocUrl = res.data
          this.hideLoading()
          notify('success', '需求文档上传成功')
        }).catch((error) => {
          this.hideLoading()
          notify('error', '需求文档上传失败:' + error.data)
        })
      },
      uploadApkFile(param) {
        this.showLoading()
        const formData = new FormData()
        let config = {
          //添加请求头
          headers: {'Content-Type': 'multipart/form-data'},
        }
        formData.append('file', param.file)
        Http.upload(Apis.FILE.APK.replace('{userId}', this.user.userVO.id), formData, config).then((res) => {
          this.project.fileUrl = res.data
          this.hideLoading()
          notify('success', '文件上传成功')
        }).catch((error) => {
          this.hideLoading()
          this.project.file = []
          notify('error', '文件上传失败')
        })
      },
      setServiceType() {
        getAllServiceTypes().then((res) => {
          this.serviceType = res
        })
      },
      setPlatformType() {
        getAllApplicationTypes().then((res) => {
          console.log(res)
          this.platforms = res
        })
      },
      setFields() {
        getAllFields().then((res) => {
          this.fields = res
        })
      },
      setInstitutions() {
        getAllInstitutions().then((res) => {
          this.institutionArray = res
        }).catch((error) => {
          notify('error', '获取institution失败' + error.data)
        })
      },
      setUserInfo() {
        this.user = storageGet('user')
      },
      checkPhoneNumber(phoneNumber) {
        return /^1[3456789]\d{9}$/.test(phoneNumber)
      },
      showLoading() {
        this.loading = true
      },
      hideLoading() {
        this.loading = false
      },
      reformDate(date) {
        return getFormalTimeFromDate(date)
      },
      dateFormat(date, format) {
        date = new Date(date)
        let o = {
          'M+': date.getMonth() + 1, //month
          'd+': date.getDate(), //day
          'H+': date.getHours(), //hour+8小时
          'm+': date.getMinutes(), //minute
          's+': date.getSeconds(), //second
          'q+': Math.floor((date.getMonth() + 3) / 3), //quarter
          'S': date.getMilliseconds() //millisecond
        }
        if (/(y+)/.test(format)) {
          format = format.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
        }

        for (let k in o)
          if (new RegExp('(' + k + ')').test(format))
            format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length));

        return format;
      }
    }
  }
</script>

<style lang="scss" scoped>
  .task-list {
    margin: 0 30px;
  }

  .el-col {
    padding: 0 !important;
  }

  .el-row {
    margin-bottom: 10px;
  }

  .el-input {
    width: 400px;
  }
</style>