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">{{project.name}}</span>
            </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 v-if="!isModifyMode" size="small" label="状态" prop="status">
              <span v-if="!isModifyMode">{{project.status==1?'等待接收':(project.status==2?'已被接收':(project.status==3?'项目已提交':'项目已结束'))}}</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}}</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="platform">
              <el-checkbox-group v-if="isModifyMode" v-model="project.platform">
            <span v-for="(item,index) in platforms" :key="index">
              <el-checkbox :label="item">{{ item }}&nbsp;&nbsp;&nbsp;&nbsp;</el-checkbox>
            </span>
              </el-checkbox-group>
              <span
                v-if="!isModifyMode"
                class="badge"
                v-for="item in project.platform"
              >{{item}}</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="type">{{ item }}&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'">{{project.institution==null?'暂未被接收':project.institution}}</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">
                    <el-radio :label="item" name="type" v-for="(item,index) in institutionArray" :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 v-if="!isModifyMode">
            <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 v-if="!isModifyMode">
            <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="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">{{reformDate(new Date(project.datetime))}}</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.confirmFinish" type="success" size="mini" @click="endProject()">
                结束项目
              </el-button>
              <el-button v-if="projectOperationControl.finish" type="primary" size="mini"
                         @click="submitProjectRequest()">
                提交项目
              </el-button>
              <el-button v-if="projectOperationControl.receive" type="primary" size="mini" @click="receiveProject()">
                接受项目
              </el-button>
              <el-button v-if="projectOperationControl.reject" type="danger" size="mini" @click="rejectProject()">
                拒绝项目
              </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-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 prop="datetime" sortable label="任务截止时间">
            <template slot-scope="scope">
              <span>{{reformDate(new Date(scope.row.datetime))}}</span>
            </template>
          </el-table-column>
          <el-table-column 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.institution}}</div>
              <div v-if="scope.row.resource=='2'">{{resourceType[scope.row.resource]}}</div>
            </template>
          </el-table-column>
          <el-table-column 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="right" 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 {
  checkFileType,
  ensureEndProject,
  getAllInstitutions,
  getAllPlatformTypes,
  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 {
      projectId: 0,
      user: {},
      loading: false,
      tabPosition: 'top',
      institutionArray: [],
      isModifyMode: false,
      platforms: [],
      resourceType: ResourceType,
      serviceType: [],
      projectOperationControl: {
        confirmFinish: false,
        createTask: false,
        finish: false,
        receive: false,
        reject: false,
        update: false,
        uploadReport: false,
      },
      project: {
        userId: 0,
        name: '',
        type: '',
        platform: '',
        desc: '',
        resource: '',
        location: '',
        institution: {},
        contactName: '',
        contactPhone: '',
        doc: [],
        requireDocUrl: '',
        file: [],
        fileUrl: '',
        budget: '',
        price: '',
        datetime: '',
        usage: '',
        status: ''
      },
      task: [],
      progress: [],
      reportList: [],
      pickerOptions: {
        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'}
        ],
        type: [
          {
            type: 'array',
            required: true,
            message: '请至少选择一种服务类型',
            trigger: 'change'
          }
        ],
        platform: [
          {
            type: 'array',
            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
    },
    // 'project.institution' () {
    //   if (this.project.institution) {
    //     //this.$refs.addFormProvince.resetProviceCity()
    //     this.project.location = {provinceCode: '', cityCode: ''}
    //   }
    // },
    // 'project.location' () {
    //   if (this.project.location.provinceCode || this.project.location.cityCode) {
    //     this.project.institution = ''
    //   }
    // },
    // 'project.resource' () {
    //   if (this.project.resource == '2') {
    //     //this.$refs.addFormProvince.resetProviceCity()
    //     this.project.institution = ''
    //     this.project.location = {provinceCode: '', cityCode: ''}
    //   }
    // },
    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.setServiceType()
      this.setPlatformType()
      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,
            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.id,
            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,
          }
          Http.put(Apis.PROJECT.UPDATE_PROJECT.replace('{projectId}', this.projectId), newProject).then((res) => {
            console.log('bb')
            console.log(res)
            this.projectId = res.projectDetails.id
            this.project.name = res.projectDetails.name
            this.project.contactName = res.projectDetails.contactName
            this.project.contactPhone = res.projectDetails.contactPhone
            this.project.type = res.projectDetails.type
            this.project.platform = res.projectDetails.platform
            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.institution = res.projectDetails.institution
            this.project.datetime = new Date(res.projectDetails.datetime)
            this.project.price = res.projectDetails.price
            this.project.budget = res.projectDetails.budget
            this.project.usage = res.projectDetails.usage
            this.project.fileUrl = res.projectDetails.file
            this.project.requireDocUrl = res.projectDetails.doc

            this.task = res.taskList
            this.reportList = res.reportList
            this.isModifyMode = false
            this.hideLoading()
            notify('success', '项目修改成功')
          }).catch(error => {
            this.hideLoading()
            notify('error', error.data)
            console.log(error)
          })
        } else {
          notify('error', '表单填写错误!')
          return false
        }
      })
    },
    //重置表单
    resetForm (formName) {
      this.$refs[formName].resetFields()
      this.project.name = ''
      this.project.type = []
      this.project.platform = []
      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
      console.log(this.project.doc)
      //this.setInstitutions()
      //获得update 信息
      //this.loadData()
    },
    //接收项目
    receiveProject () {
      this.$confirm('确认接收项目？', '提示', {
        confirmButtonText: '确认接收',
        cancelButtonText: '取消',
        type: 'success'
      }).then(() => {
        this.showLoading()
        console.log('接收项目')
        receiveProjectRequest(this.projectId, this.user.userVO.id, this.receiveProjectSuccess, this.receiveProjectFail)
      }).catch(() => {
      })
    },
    receiveProjectSuccess (res) {
      this.hideLoading()
      notify('success', '项目接收成功！')
      this.projectOperationControl = res.projectOperationControl
      this.project.status = res.projectDetails.status
      this.project.institution = res.projectDetails.institution
    },
    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', '拒绝项目成功')
    },
    rejectProjectFail (error) {
      this.hideLoading()
      notify('error', '拒绝项目失败：' + error.data)
    },
    //提交项目
    submitProjectRequest () {
      this.$confirm('确认提交项目？', '提示', {
        confirmButtonText: '确认提交',
        cancelButtonText: '取消',
        type: 'success'
      }).then(() => {
        this.showLoading()
        submitProjectRequest(this.projectId, this.submitProjectRequestSuccess, this.submitProjectRequestFail)
      }).catch(() => {
      })
    },
    submitProjectRequestSuccess (res) {
      this.hideLoading()
      notify('success', '项目提交成功！')
      this.projectOperationControl = res.projectOperationControl
      this.project.status = res.projectDetails.status
      this.project.institution = res.projectDetails.institution
    },
    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.projectOperationControl = res.projectOperationControl
      this.project.status = res.projectDetails.status
      this.project.institution = res.projectDetails.institution
    },
    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()
          notify('success', '删除成功')
        })
        .catch(_ => {
          notify('error', '删除失败')
        })
      //this.task.splice(index, 1)
    },
    beforeApkUpload (file) {
      const isAPK = file.type === 'application/vnd.android.package-archive'
      const isDMG = file.type === 'application/octet-stream'

      if (!isAPK && !isDMG) {
        this.$message.error('上传安装包只能是 APK 或 DMG 格式!')
      }
      return isAPK || isDMG
    },
    beforeFileUpload (file) {
      console.log(file)
      const isPDF = file.type === 'application/pdf'
      const isDOC = file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
      const isEXCEL = file.type === 'application/vnd.ms-excel'
      const isXLS = file.type === 'application/x-xls'
      const isTXT = file.type === 'text/plain'
      const isXLSX = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
      //console.log(file)
      if (!(isDOC || isEXCEL || isPDF || isTXT || isXLS || isXLSX)) {
        this.$message.error('上传文件只能是 PDF 、 DOC 、DOCX 、XLS、TXT、XLSX 格式!')
      }
      return isDOC || isEXCEL || isPDF || isTXT || isXLS || isXLSX
    },
    analyseDemand () {
      this.$router.push({name: 'AnalyseDemand'})
    },
    handleAccept (index, id) {
      console.log('接受')
    },
    handleReject (index, id) {
      console.log('拒绝')
    },
    loadData () {//PROJ--2019073114009
      this.showLoading()
      Http.get(Apis.PROJECT.GET_PROJECT.replace('{projectId}', this.projectId)).then((res) => {
        console.log(res)
        this.projectId = res.projectDetails.id
        this.project.name = res.projectDetails.name
        this.project.contactName = res.projectDetails.contactName
        this.project.contactPhone = res.projectDetails.contactPhone
        this.project.type = res.projectDetails.type
        this.project.platform = res.projectDetails.platform
        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.institution = res.projectDetails.institution
        this.project.datetime = new Date(res.projectDetails.datetime)
        this.project.price = res.projectDetails.price
        this.project.budget = res.projectDetails.budget
        this.project.usage = res.projectDetails.usage
        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.task = res.taskList
        this.reportList = res.reportList
        this.projectOperationControl = res.projectOperationControl
        this.progress = res.progress
        this.hideLoading();
        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)
      })
    },
    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()
        notify('error', '文件上传失败')
      })
    },
    setServiceType () {
      getAllServiceTypes().then((res) => {
        this.serviceType = res
      }).catch((error) => {
        notify('error', '获取项目类型列表失败')
      })
    },
    setPlatformType () {
      this.platforms = getAllPlatformTypes()
    },
    setInstitutions () {
      getAllInstitutions().then((res) => {
        this.institutionArray = res
      }).catch((error) => {
        notify('error', '获取institution失败' + error.data)
      })
    },
    setUserInfo () {
      this.user = storageGet('user')
    },
    showLoading () {
      this.loading = true
    },
    hideLoading () {
      this.loading = false
    },
    reformDate (date) {
      return getFormalTimeFromDate(date)
    }
  }
}
</script>

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

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

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

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


<!--<div class="create-body" v-if="!isModifyMode">-->
<!--<div class="title h2">分析需求</div>-->
<!--<div class="task-list">-->
<!--<el-table :data="analyseDemandList" style="width: 100%" max-height="400">-->
<!--<el-table-column prop="institution" label="承接单位" title="承接单位"></el-table-column>-->
<!--<el-table-column prop="feasibilityReport" sortable label="可行性分析报告">-->
<!--<template slot-scope="scope">-->
<!--<span v-if="!scope.row.feasibilityReport.url">暂无文件</span>-->
<!--<a-->
<!--:href="scope.row.feasibilityReport.url"-->
<!--v-if="scope.row.feasibilityReport.url"-->
<!--target="_blank"-->
<!--&gt;-->
<!--<i class="fa fa-file-text-o"></i>-->
<!--{{scope.row.feasibilityReport.name}}-->
<!--</a>-->
<!--</template>-->
<!--</el-table-column>-->
<!--<el-table-column prop="priceAuditReport" sortable label="可行性分析报告">-->
<!--<template slot-scope="scope">-->
<!--<span v-if="!scope.row.priceAuditReport.url">暂无文件</span>-->
<!--<a-->
<!--:href="scope.row.priceAuditReport.url"-->
<!--v-if="scope.row.priceAuditReport.url"-->
<!--target="_blank"-->
<!--&gt;-->
<!--<i class="fa fa-file-text-o"></i>-->
<!--{{scope.row.priceAuditReport.name}}-->
<!--</a>-->
<!--</template>-->
<!--</el-table-column>-->

<!--<el-table-column align="right" label="操作">-->
<!--<template slot-scope="scope">-->
<!--<div-->
<!--class="btn btn-small btn-info"-->
<!--@click="handleAccept(scope.$index, scope.row.id)"-->
<!--&gt;接受-->
<!--</div>-->
<!--<div-->
<!--class="btn btn-small btn-danger"-->
<!--@click="handleReject(scope.$index, scope.row.id)"-->
<!--&gt;拒绝-->
<!--</div>-->
<!--</template>-->
<!--</el-table-column>-->
<!--</el-table>-->
<!--</div>-->
<!--</div>-->