Project.vue 40 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110
  1. <template>
  2. <div class="create-container" v-loading="loading">
  3. <div class="title h1" v-if="!isModifyMode">项目</div>
  4. <div class="create-body">
  5. <el-row type="flex" align="middle" justify="start">
  6. <el-col :span="15">
  7. <div class="title h2" v-if="!isModifyMode">基本信息</div>
  8. <div v-if="!isModifyMode" class="el-form-item">
  9. <label class="el-form-item__label" style="width: 30%;">编号</label>
  10. <div class="el-form-item__content" style="margin-left: 30%;">
  11. <div>{{projectId}}</div>
  12. </div>
  13. </div>
  14. <el-form :model="project" :rules="rules" ref="project" label-width="30%" class="demo-project">
  15. <el-form-item label="项目名称" prop="name">
  16. <el-input size="small" v-if="isModifyMode" v-model="project.name"></el-input>
  17. <span v-if="!isModifyMode" style="margin-right: 5px">{{project.name}}</span>
  18. <el-tag v-if="!isModifyMode" :type="project.statusVO&&project.statusVO.style">{{project.statusVO?project.statusVO.text:''}}</el-tag>
  19. </el-form-item>
  20. <el-form-item size="small" label="联系人" prop="contactName">
  21. <el-input v-if="isModifyMode" v-model="project.contactName" placeholder="请输入联系人姓名"></el-input>
  22. <span v-if="!isModifyMode">{{project.contactName}}</span>
  23. </el-form-item>
  24. <el-form-item size="small" label="联系人电话" prop="contactPhone">
  25. <el-input v-if="isModifyMode" v-model="project.contactPhone" placeholder="请输入联系人电话"></el-input>
  26. <span v-if="!isModifyMode">{{project.contactPhone}}</span>
  27. </el-form-item>
  28. <el-form-item size="small" label="预算" prop="budget">
  29. <el-input v-if="isModifyMode" type="number" v-model="project.budget">
  30. ¥
  31. <template slot="append"></template>
  32. </el-input>
  33. <span v-if="!isModifyMode">{{project.budget}}¥</span>
  34. </el-form-item>
  35. <el-form-item label="计价标准" prop="valuationStandard">
  36. <el-input style="width: 400px" autosize v-if="isModifyMode" type="textarea"
  37. v-model="project.valuationStandard"></el-input>
  38. <span v-if="!isModifyMode">{{project.valuationStandard}}</span>
  39. </el-form-item>
  40. <!-- <el-form-item size="small" label="计价标准" prop="valuationStandard">-->
  41. <!-- <el-input v-if="isModifyMode" type="number" v-model="project.valuationStandard">-->
  42. <!-- <template slot="append"></template>-->
  43. <!-- </el-input>-->
  44. <!-- <span v-if="!isModifyMode">{{project.valuationStandard}}</span>-->
  45. <!-- </el-form-item>-->
  46. <el-form-item v-if="!isModifyMode" size="small" label="状态" prop="status">
  47. <span v-if="!isModifyMode">{{project.status==1?'等待接收':(project.status==2?'已被接收':(project.status==3?'项目已提交':'项目已结束'))}}</span>
  48. </el-form-item>
  49. <el-form-item size="small" label="区域管理员" prop="institution" v-if="project.institution">
  50. <span v-if="!isModifyMode">{{project.institution}}</span>
  51. </el-form-item>
  52. <el-form-item label="需求描述">
  53. <el-input style="width: 400px" autosize v-if="isModifyMode" type="textarea"
  54. v-model="project.desc"></el-input>
  55. <span v-if="!isModifyMode">{{project.desc}}</span>
  56. </el-form-item>
  57. <!--<el-form-item label="价格" prop="price">-->
  58. <!--<el-input v-if="isModifyMode" type="number" v-model="project.price">-->
  59. <!--<template slot="append">¥</template>-->
  60. <!--</el-input>-->
  61. <!--<span v-if="!isModifyMode">{{project.price}}¥</span>-->
  62. <!--</el-form-item>-->
  63. <el-form-item label="领域类型" prop="field">
  64. <el-radio-group v-if="isModifyMode" v-model="project.field">
  65. <span v-for="(item,index) in fields" :key="index">
  66. <el-radio :label="item.code" style="margin: 3px">{{ item.name }}&nbsp;&nbsp;&nbsp;&nbsp;</el-radio>
  67. </span>
  68. </el-radio-group>
  69. <span
  70. v-if="!isModifyMode"
  71. class="badge"
  72. >
  73. {{project.field}}</span>
  74. </el-form-item>
  75. <el-form-item label="应用类型" prop="platform">
  76. <el-radio-group v-if="isModifyMode" v-model="project.platform">
  77. <span v-for="(item,index) in platforms" :key="index">
  78. <el-radio :label="item.code" style="margin: 3px">{{ item.name }}&nbsp;&nbsp;&nbsp;&nbsp;</el-radio>
  79. </span>
  80. </el-radio-group>
  81. <span
  82. v-if="!isModifyMode"
  83. class="badge"
  84. >
  85. {{project.platform}}</span>
  86. </el-form-item>
  87. <el-form-item label="服务类型" prop="type">
  88. <el-checkbox-group v-if="isModifyMode" v-model="project.type">
  89. <span v-for="(item,index) in serviceType" :key="index">
  90. <el-checkbox :label="item.code" name="type">{{ item.name }}&nbsp;&nbsp;</el-checkbox>
  91. </span>
  92. </el-checkbox-group>
  93. <span v-if="!isModifyMode" class="badge" v-for="item in project.type">{{item}}</span>
  94. </el-form-item>
  95. <!--<el-form-item label="用途" prop="usage">-->
  96. <!--<el-input v-if="isModifyMode" v-model="project.usage"></el-input>-->
  97. <!--<span v-if="!isModifyMode">{{project.usage}}</span>-->
  98. <!--</el-form-item>-->
  99. <el-form-item label="项目可见性" prop="resource">
  100. <div v-if="!isModifyMode">
  101. <div v-if="project.resource=='1'">{{updateLocation(project.location)}}</div>
  102. <div v-if="project.resource=='0'">定向</div>
  103. <div v-if="project.resource=='2'">{{resourceType[project.resource]}}</div>
  104. </div>
  105. <el-tabs :tab-position="tabPosition" v-model="project.resource" style="max-height: 200px;"
  106. v-if="isModifyMode">
  107. <el-tab-pane :label="resourceType[0]" name="0">
  108. <el-radio-group v-model="project.institution">
  109. <el-radio :label="item" name="type" v-for="(item,index) in institutionArray" :key="index">
  110. {{item.name}}
  111. </el-radio>
  112. </el-radio-group>
  113. </el-tab-pane>
  114. <el-tab-pane :label="resourceType[1]" name="1">
  115. <provincecity
  116. ref="addFormProvince"
  117. @selectChange="locationChange"
  118. :provinceCode="project.location==null?'3200':project.location.provinceCode"
  119. :cityCode="project.location==null?'3201':project.location.cityCode"
  120. ></provincecity>
  121. </el-tab-pane>
  122. <el-tab-pane :label="resourceType[2]" name="2"></el-tab-pane>
  123. </el-tabs>
  124. </el-form-item>
  125. <el-form-item label="需求文档" prop="doc">
  126. <el-upload
  127. style="width: 400px"
  128. v-if="isModifyMode"
  129. drag
  130. class="upload-demo"
  131. action=""
  132. :on-remove="handleRemove"
  133. :before-remove="beforeRemove"
  134. :limit="1"
  135. :on-exceed="handleExceed"
  136. :before-upload="beforeFileUpload"
  137. :http-request="uploadRequireDoc"
  138. :file-list="project.doc"
  139. >
  140. <i class="el-icon-upload"></i>
  141. <div class="el-upload__text">
  142. 将文件拖到此处,或
  143. <em>点击上传</em>
  144. </div>
  145. </el-upload>
  146. <span v-if="!isModifyMode">
  147. <a :href="project.requireDocUrl" v-if="project.requireDocUrl!=null && project.requireDocUrl!=''"><el-link
  148. :underline="false" type="primary"><i
  149. class="el-icon-document"></i>下载文档</el-link></a>
  150. <i v-if="project.requireDocUrl==null || project.requireDocUrl==''" class="el-icon-document">暂无文档</i>
  151. </span>
  152. </el-form-item>
  153. <el-form-item label="安装包" prop="file">
  154. <el-upload
  155. style="width: 400px"
  156. v-if="isModifyMode"
  157. drag
  158. class="upload-demo"
  159. action=""
  160. :on-remove="handleRemove"
  161. :before-remove="beforeRemove"
  162. :limit="1"
  163. :on-exceed="handleExceed"
  164. :before-upload="beforeApkUpload"
  165. :http-request="uploadApkFile"
  166. :file-list="project.file"
  167. >
  168. <i class="el-icon-upload"></i>
  169. <div class="el-upload__text">
  170. 将文件拖到此处,或
  171. <em>点击上传</em>
  172. </div>
  173. </el-upload>
  174. <span v-if="!isModifyMode">
  175. <a v-if="project.fileUrl!=null && project.fileUrl!=''" :href="project.fileUrl"><el-link :underline="false"
  176. type="primary"><i
  177. class="el-icon-document"></i>下载文件</el-link></a>
  178. <i v-if="project.fileUrl==null || project.fileUrl==''" class="el-icon-document">暂无文件</i>
  179. </span>
  180. </el-form-item>
  181. <el-form-item label="委托单位" prop="entrustUnit" v-if="project.entrustUnit">
  182. <el-input style="width: 400px" autosize v-if="isModifyMode" type="textarea"
  183. v-model="project.entrustUnit"></el-input>
  184. <span v-if="!isModifyMode">{{project.entrustUnit}}</span>
  185. </el-form-item>
  186. <el-form-item label="项目截止时间" prop="datetime">
  187. <div class="block" v-if="isModifyMode">
  188. <el-date-picker
  189. size="small"
  190. v-model="project.datetime"
  191. type="datetime"
  192. placeholder="选择截止时间"
  193. align="right"
  194. :picker-options="pickerOptions"
  195. ></el-date-picker>
  196. </div>
  197. <span v-if="!isModifyMode">{{dateFormat(new Date(project.datetime),'yyyy-MM-dd HH:mm:ss')}}</span>
  198. </el-form-item>
  199. <el-form-item v-if="isModifyMode">
  200. <div class="btn btn-small btn-info" @click="submitForm('project')">确认修改</div>
  201. <!--<div class="btn btn-small" @click="resetForm('project')">重置</div>-->
  202. <div class="btn btn-small" @click="cancelMode('project')">取消</div>
  203. </el-form-item>
  204. <el-form-item v-if="!isModifyMode">
  205. <el-button v-if="projectOperationControl.confirmFinish" type="success" size="mini" @click="endProject()">
  206. 结束项目
  207. </el-button>
  208. <el-button v-if="projectOperationControl.finish" type="primary" size="mini"
  209. @click="submitProjectRequest()">
  210. 提交项目
  211. </el-button>
  212. <el-button v-if="projectOperationControl.receive" type="primary" size="mini" @click="receiveProject()">
  213. 接收项目
  214. </el-button>
  215. <el-button v-if="projectOperationControl.reject" type="danger" size="mini" @click="rejectProject()">
  216. 拒绝项目
  217. </el-button>
  218. <el-button v-if="projectOperationControl.update" type="primary" size="mini" @click="modifyForm()">
  219. 修改项目
  220. </el-button>
  221. <el-button v-if="projectOperationControl.createTask" type="primary" size="mini" @click="createNewTask()">
  222. 新建任务
  223. </el-button>
  224. <el-button v-if="projectOperationControl.uploadReport" type="primary" size="mini" @click="createReport()">
  225. 上传报告
  226. </el-button>
  227. </el-form-item>
  228. </el-form>
  229. </el-col>
  230. <el-col :span="5" id="pieImage" style="height: 500px;min-width: 500px">
  231. </el-col>
  232. </el-row>
  233. </div>
  234. <!-- 任务列表-->
  235. <div class="create-body" v-if="!isModifyMode && showTaskList">
  236. <div class="title h2">任务列表</div>
  237. <div class="task-list">
  238. <el-table :showHeader="true" :stripe="true" :data="task" style="width: 100%">
  239. <el-table-column prop="title" label="任务名称" title="任务名称">
  240. <template slot-scope="scope">
  241. <span>{{ scope.row.title }}</span>
  242. </template>
  243. </el-table-column>
  244. <el-table-column prop="datetime" sortable label="任务截止时间">
  245. <template slot-scope="scope">
  246. <span>{{reformDate(new Date(scope.row.datetime))}}</span>
  247. </template>
  248. </el-table-column>
  249. <el-table-column prop="resource" label="任务可见性">
  250. <template slot-scope="scope">
  251. <div v-if="scope.row.resource=='1'">{{scope.row.location.provinceCode}}/{{scope.row.location.cityCode}}
  252. </div>
  253. <div v-if="scope.row.resource=='0'">{{scope.row.institution}}</div>
  254. <div v-if="scope.row.resource=='2'">{{resourceType[scope.row.resource]}}</div>
  255. </template>
  256. </el-table-column>
  257. <el-table-column prop="type" label="测试类型">
  258. <template slot-scope="scope">
  259. <div class="badge">{{scope.row.serviceType}}</div>
  260. </template>
  261. </el-table-column>
  262. <el-table-column align="center" label="状态">
  263. <template slot-scope="scope">
  264. <el-tag :type="scope.row.statusVO.style">{{scope.row.statusVO.text}}</el-tag>
  265. </template>
  266. </el-table-column>
  267. <el-table-column align="right" label="操作">
  268. <template slot-scope="scope">
  269. <div
  270. class="btn btn-small btn-info"
  271. @click="goToTaskDetail(projectId, scope.row.id)"
  272. >查看详情
  273. </div>
  274. <!-- <div-->
  275. <!-- class="btn btn-small btn-danger"-->
  276. <!-- @click="handleDelete(scope.$index, scope.row.id)"-->
  277. <!-- >删除-->
  278. <!-- </div>-->
  279. </template>
  280. </el-table-column>
  281. </el-table>
  282. </div>
  283. </div>
  284. <div class="create-body" v-if="!isModifyMode">
  285. <div class="title h2">用户报告列表</div>
  286. <report-list v-bind:reports="reportList" v-bind:taskId=null v-bind:projectId="projectId"/>
  287. </div>
  288. </div>
  289. </template>
  290. <script>
  291. import ReportList from '@/components/report/ReportList'
  292. import Http from '@/js/http.js'
  293. import Apis from '@/js/api.js'
  294. import ResourceType from '@/constants/enum/resource-type'
  295. import provincecity from '@/components/commons/ProvinceCity'
  296. import {notify} from '@/constants/index'
  297. import echarts from 'echarts'
  298. import {
  299. checkFileType,
  300. ensureEndProject,
  301. getAllInstitutions,
  302. getAllPlatformTypes,
  303. getAllFields,
  304. getAllServiceTypes,
  305. getFormalTimeFromDate,
  306. getProvinceCodeByProvinceName,
  307. getProvinceNameByProvinceCode,
  308. receiveProjectRequest,
  309. rejectProject,
  310. storageGet,
  311. submitProjectRequest,
  312. deleteTask
  313. } from '@/js/index'
  314. export default {
  315. name: 'Project',
  316. components: {
  317. provincecity,
  318. ReportList
  319. },
  320. data () {
  321. var validatePass = (rule, value, callback) => {
  322. var reg = /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/
  323. if (this.project.contactPhone) {
  324. if (!reg.test(this.project.contactPhone)) {
  325. callback(new Error('请检查手机号码'))
  326. } else {
  327. callback()
  328. }
  329. }
  330. }
  331. return {
  332. showTaskList: true,
  333. acceptedUserList:[],
  334. projectId: 0,
  335. user: {},
  336. loading: false,
  337. tabPosition: 'top',
  338. institutionArray: [],
  339. isModifyMode: false,
  340. platforms: [],
  341. fields: [],
  342. resourceType: ResourceType,
  343. serviceType: [],
  344. projectOperationControl: {
  345. confirmFinish: false,
  346. createTask: false,
  347. finish: false,
  348. receive: false,
  349. reject: false,
  350. update: false,
  351. uploadReport: false,
  352. },
  353. project: {
  354. userId: 0,
  355. name: '',
  356. type: [],
  357. platform: '',
  358. valuationStandard: '',
  359. entrustUnit:'',
  360. field: '',
  361. desc: '',
  362. resource: '',
  363. location: '',
  364. institution: {},
  365. contactName: '',
  366. contactPhone: '',
  367. doc: [],
  368. requireDocUrl: '',
  369. file: [],
  370. fileUrl: '',
  371. budget: '',
  372. price: '',
  373. datetime: '',
  374. usage: '',
  375. status: ''
  376. },
  377. task: [],
  378. progress: [],
  379. reportList: [],
  380. pickerOptions: {
  381. disabledDate(time) {
  382. return time.getTime() <= Date.now();
  383. },
  384. shortcuts: [
  385. {
  386. text: '今天',
  387. onClick (picker) {
  388. picker.$emit('pick', new Date())
  389. }
  390. },
  391. {
  392. text: '明天',
  393. onClick (picker) {
  394. const date = new Date()
  395. date.setTime(date.getTime() + 3600 * 1000 * 24)
  396. picker.$emit('pick', date)
  397. }
  398. },
  399. {
  400. text: '一周后',
  401. onClick (picker) {
  402. const date = new Date()
  403. date.setTime(date.getTime() + 3600 * 1000 * 24 * 7)
  404. picker.$emit('pick', date)
  405. }
  406. }
  407. ]
  408. },
  409. rules: {
  410. name: [
  411. {required: true, message: '请输入项目名称', trigger: 'blur'},
  412. {min: 5, max: 50, message: '项目名称长度在 5 到 50 个字符', trigger: 'blur'}
  413. ],
  414. contactName: [
  415. {required: true, message: '请输入联系人姓名', trigger: 'blur'}
  416. // { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" }
  417. ],
  418. contactPhone: [
  419. {required: true, message: '请输入手机号', trigger: 'blur'},
  420. {min: 11, max: 11, message: '请输入正确的手机号', trigger: 'blur'},
  421. {
  422. validator: (rule, value, callback) => {
  423. if (!this.checkPhoneNumber(value)) {
  424. callback(new Error('手机号输入有误'))
  425. } else {
  426. callback()
  427. }
  428. }, trigger: 'blur'
  429. },
  430. ],
  431. type: [
  432. {
  433. type: 'array',
  434. required: true,
  435. message: '请至少选择一种服务类型',
  436. trigger: 'change'
  437. }
  438. ],
  439. platform: [
  440. {
  441. required: true,
  442. message: '请选择一个应用类型',
  443. trigger: 'change'
  444. }
  445. ],
  446. field: [
  447. {
  448. required: true,
  449. message: '请选择一个领域类型',
  450. trigger: 'change'
  451. }
  452. ],
  453. desc: [{required: false, message: '请填写描述', trigger: 'blur'}],
  454. //price: [{required: true, message: '请填写价格', trigger: 'blur'}],
  455. budget: [
  456. {required: true, message: '预算不可为空', trigger: 'blur'},
  457. {
  458. validator: (rule, value, callback) => {
  459. if (value < 0) {
  460. callback(new Error('请输入不小于0的数'))
  461. } else {
  462. callback()
  463. }
  464. }, trigger: 'blur'
  465. },
  466. ],
  467. resource: [
  468. {required: true},
  469. {
  470. validator: (rule, value, callback) => {
  471. if (value == 0 && this.project.institution == null) {
  472. callback(new Error('定向发布至少要选择一个区域管理员'))
  473. } else {
  474. callback()
  475. }
  476. }, trigger: 'change'
  477. },
  478. ],
  479. datetime: [{required: true, message: '截止时间不可为空', trigger: 'blur'}],
  480. }
  481. }
  482. },
  483. mounted () {
  484. this.$nextTick(() => {
  485. this.init();
  486. })
  487. },
  488. watch: {
  489. serviceType (val) {
  490. this.serviceType = val
  491. },
  492. institutionArray (val) {
  493. this.institutionArray = val
  494. },
  495. // 'project.institution' () {
  496. // if (this.project.institution) {
  497. // //this.$refs.addFormProvince.resetProviceCity()
  498. // this.project.location = {provinceCode: '', cityCode: ''}
  499. // }
  500. // },
  501. // 'project.location' () {
  502. // if (this.project.location.provinceCode || this.project.location.cityCode) {
  503. // this.project.institution = ''
  504. // }
  505. // },
  506. // 'project.resource' () {
  507. // if (this.project.resource == '2') {
  508. // //this.$refs.addFormProvince.resetProviceCity()
  509. // this.project.institution = ''
  510. // this.project.location = {provinceCode: '', cityCode: ''}
  511. // }
  512. // },
  513. deep: true
  514. },
  515. methods: {
  516. updateLocation (location) {
  517. //console.log(location)
  518. const loactionName = getProvinceNameByProvinceCode(location.provinceCode, location.cityCode)
  519. // var provinceName = ''
  520. // var cityName = ''
  521. // for (var item of provinceCityJSON.provinces) {
  522. // if (item.code === location.provinceCode) {
  523. // provinceName = item.name
  524. // for (var city of item.cities) {
  525. // if (city.code === location.cityCode) {
  526. // cityName = city.name
  527. // break
  528. // }
  529. // }
  530. // }
  531. // }
  532. return loactionName.provinceCode + ' / ' + loactionName.cityCode
  533. },
  534. init () {
  535. this.projectId = this.$route.params.projectId
  536. this.setServiceType()
  537. this.setFields()
  538. this.setPlatformType()
  539. this.setInstitutions()
  540. this.setUserInfo()
  541. this.loadData()
  542. //this.reformDate(123)
  543. // this.project.platform.map(item => {
  544. // this.platformType.push(PlatformType[item])
  545. // })
  546. },
  547. //画个饼
  548. setEcharts () {
  549. // 基于准备好的dom,初始化echarts实例
  550. let myChart = echarts.init(document.getElementById('pieImage'))
  551. // 绘制图表
  552. var option = {
  553. tooltip: {
  554. trigger: 'item',
  555. formatter: '{a} <br/>{b}: {c} ({d}%)'
  556. },
  557. legend: {
  558. orient: 'vertical',
  559. x: 'left',
  560. data: ['已完成', '进行中']
  561. },
  562. series: [
  563. {
  564. name: '任务状态',
  565. type: 'pie',
  566. radius: ['50%', '70%'],
  567. avoidLabelOverlap: false,
  568. label: {
  569. normal: {
  570. show: false,
  571. position: 'center'
  572. },
  573. emphasis: {
  574. show: true,
  575. textStyle: {
  576. fontSize: '30',
  577. fontWeight: 'bold'
  578. }
  579. }
  580. },
  581. labelLine: {
  582. normal: {
  583. show: false
  584. }
  585. },
  586. data: this.progress,
  587. color:['#909399','#409EFF']
  588. }
  589. ]
  590. }
  591. myChart.setOption(option)
  592. },
  593. //提交修改
  594. submitForm (formName) {
  595. this.$refs['project'].validate(valid => {
  596. if (valid) {
  597. this.showLoading()
  598. const newProject = {
  599. userId: this.user.userVO.id,
  600. name: this.project.name,
  601. type: this.project.type,
  602. platform: this.project.platform,
  603. valuationStandard: this.project.valuationStandard,
  604. entrustUnit: this.project.entrustUnit,
  605. field: this.project.field,
  606. desc: this.project.desc,
  607. resource: this.project.resource,
  608. location: getProvinceNameByProvinceCode(this.project.location.provinceCode, this.project.location.cityCode),
  609. institution: this.project.institution == null ? null : this.project.institution.id,
  610. contactName: this.project.contactName,
  611. contactPhone: this.project.contactPhone,
  612. doc: this.project.requireDocUrl,
  613. file: this.project.fileUrl,
  614. budget: this.project.budget,
  615. price: this.project.price,
  616. datetime: this.project.datetime,
  617. usage: this.project.usage,
  618. }
  619. console.log(newProject);
  620. Http.put(Apis.PROJECT.UPDATE_PROJECT.replace('{projectId}', this.projectId), newProject).then((res) => {
  621. console.log(res)
  622. this.projectId = res.projectDetails.id
  623. this.project.name = res.projectDetails.name
  624. this.project.contactName = res.projectDetails.contactName
  625. this.project.contactPhone = res.projectDetails.contactPhone
  626. this.project.type = res.projectDetails.type
  627. this.project.platform = res.projectDetails.platform
  628. this.project.valuationStandard = res.projectDetails.valuationStandard
  629. this.project.entrustUnit = res.projectDetails.entrustUnit
  630. this.project.field = res.projectDetails.field
  631. this.project.desc = res.projectDetails.desc
  632. this.project.doc = []
  633. this.project.file = []
  634. this.project.resource = res.projectDetails.resource
  635. this.project.location = getProvinceCodeByProvinceName(res.projectDetails.location.provinceCode, res.projectDetails.location.cityCode)
  636. this.project.institution = res.projectDetails.institution
  637. this.project.datetime = new Date(res.projectDetails.datetime)
  638. this.project.price = res.projectDetails.price
  639. this.project.budget = res.projectDetails.budget
  640. this.project.usage = res.projectDetails.usage
  641. this.project.fileUrl = res.projectDetails.file
  642. this.project.requireDocUrl = res.projectDetails.doc
  643. this.task = res.taskList
  644. this.reportList = res.reportList
  645. this.isModifyMode = false
  646. this.hideLoading()
  647. notify('success', '项目修改成功')
  648. }).catch(error => {
  649. this.hideLoading()
  650. notify('error', error.data)
  651. console.log(error)
  652. })
  653. } else {
  654. notify('error', '表单填写错误!')
  655. return false
  656. }
  657. })
  658. },
  659. //重置表单
  660. resetForm (formName) {
  661. this.$refs[formName].resetFields()
  662. this.project.name = ''
  663. this.project.type = []
  664. this.project.platform = ''
  665. this.project.valuationStandard = ''
  666. this.project.entrustUnit = ''
  667. this.project.field = ''
  668. this.project.desc = ''
  669. this.project.doc = ''
  670. this.project.file = ''
  671. this.project.contactName = ''
  672. this.project.contactPhone = ''
  673. this.project.resource = '2'
  674. this.project.institution = ''
  675. this.project.datetime = ''
  676. this.project.price = ''
  677. this.project.usage = ''
  678. this.project.budget = ''
  679. },
  680. //进入修改项目页面
  681. modifyForm () {
  682. this.isModifyMode = true
  683. this.project.type = []
  684. this.project.platform = []
  685. this.project.field = []
  686. console.log(this.project)
  687. // console.log(this.project.doc)
  688. //this.setInstitutions()
  689. //获得update 信息
  690. //this.loadData()
  691. },
  692. //接收项目
  693. receiveProject () {
  694. this.$confirm('确认接收项目?', '提示', {
  695. confirmButtonText: '确认接收',
  696. cancelButtonText: '取消',
  697. type: 'success'
  698. }).then(() => {
  699. this.showLoading()
  700. console.log('接收项目')
  701. receiveProjectRequest(this.projectId, this.user.userVO.id, this.receiveProjectSuccess, this.receiveProjectFail)
  702. }).catch(() => {
  703. })
  704. },
  705. receiveProjectSuccess (res) {
  706. this.hideLoading()
  707. notify('success', '项目接收成功!')
  708. this.projectOperationControl = res.projectOperationControl
  709. this.project.status = res.projectDetails.status
  710. this.project.institution = res.projectDetails.institution
  711. },
  712. receiveProjectFail (error) {
  713. this.hideLoading()
  714. notify('error', '接收项目失败:' + error.data)
  715. },
  716. //拒绝项目
  717. rejectProject () {
  718. this.$confirm('确认拒绝项目?', '提示', {
  719. confirmButtonText: '确认拒绝',
  720. cancelButtonText: '取消',
  721. type: 'success'
  722. }).then(() => {
  723. this.showLoading()
  724. rejectProject(this.projectId, this.rejectProjectSuccess, this.rejectProjectFail)
  725. }).catch(() => {
  726. })
  727. },
  728. rejectProjectSuccess (res) {
  729. this.hideLoading()
  730. notify('success', '拒绝项目成功')
  731. },
  732. rejectProjectFail (error) {
  733. this.hideLoading()
  734. notify('error', '拒绝项目失败:' + error.data)
  735. },
  736. //提交项目
  737. submitProjectRequest () {
  738. this.$confirm('确认提交项目?', '提示', {
  739. confirmButtonText: '确认提交',
  740. cancelButtonText: '取消',
  741. type: 'success'
  742. }).then(() => {
  743. this.showLoading()
  744. submitProjectRequest(this.projectId, this.submitProjectRequestSuccess, this.submitProjectRequestFail)
  745. }).catch(() => {
  746. })
  747. },
  748. submitProjectRequestSuccess (res) {
  749. this.hideLoading()
  750. notify('success', '项目提交成功!')
  751. this.loadData()
  752. this.projectOperationControl = res.projectOperationControl
  753. this.project.status = res.projectDetails.status
  754. this.project.institution = res.projectDetails.institution
  755. },
  756. submitProjectRequestFail (error) {
  757. this.hideLoading()
  758. notify('error', '提交项目失败:' + error.data)
  759. },
  760. //结束项目
  761. endProject () {
  762. this.$confirm('确认结束项目?', '提示', {
  763. confirmButtonText: '确认结束',
  764. cancelButtonText: '取消',
  765. type: 'success'
  766. }).then(() => {
  767. this.showLoading()
  768. ensureEndProject(this.projectId, this.endProjectSuccess, this.endProjectFail)
  769. }).catch(() => {
  770. })
  771. },
  772. endProjectSuccess (res) {
  773. this.hideLoading()
  774. notify('success', '项目提交成功!')
  775. this.loadData()
  776. this.projectOperationControl = res.projectOperationControl
  777. this.project.status = res.projectDetails.status
  778. this.project.institution = res.projectDetails.institution
  779. },
  780. endProjectFail (error) {
  781. this.hideLoading()
  782. notify('error', '结束项目失败:' + error.data)
  783. },
  784. cancelMode (formName) {
  785. this.isModifyMode = false
  786. this.loadData()
  787. },
  788. goToTaskDetail (projectId, taskId) {
  789. this.$router.push({
  790. name: 'Task',
  791. params: {projectId: projectId, taskId: taskId}
  792. })
  793. },
  794. createNewTask () {
  795. const that = this
  796. this.$router.push({
  797. name: 'TaskCreate',
  798. params: {projectId: that.projectId}
  799. })
  800. },
  801. createReport () {
  802. this.$router.push({
  803. name: 'ProjectReportCreate',
  804. params: {
  805. scope: 0,
  806. dependencyCode: this.projectId,
  807. projectId: this.projectId,
  808. }
  809. })
  810. },
  811. handleDelete (index, id) {
  812. this.$confirm('确认删除该任务?')
  813. .then(_ => {
  814. //done()
  815. //id->taskid
  816. console.log(id)
  817. console.log(this.projectId)
  818. deleteTask(this.projectId,id,this.deleteTaskSuccess,this.deleteTaskFail)
  819. })
  820. .catch(_ => {
  821. notify('error', '删除失败')
  822. })
  823. //this.task.splice(index, 1)
  824. },
  825. deleteTaskSuccess(res){
  826. notify('success', '删除成功')
  827. },
  828. deleteTaskFail(error){
  829. console.log(error)
  830. notify('error', '删除失败:'+error)
  831. },
  832. beforeApkUpload (file) {
  833. return true;
  834. //const fileTypeList = ['dmg', 'exe', 'apk']
  835. //return checkFileType(file, fileTypeList, this.beforeFileUploadError)
  836. },
  837. beforeFileUpload (file) {
  838. return true;
  839. //const fileTypeList = ['pdf', 'xls', 'xlsx', 'doc', 'docx', 'txt']
  840. //return checkFileType(file, fileTypeList, this.beforeFileUploadError)
  841. },
  842. beforeFileUploadError () {
  843. this.$message.error('上传文件只能是 PDF 、 DOC 、DOCX 、XLS、TXT、XLSX 格式!')
  844. },
  845. analyseDemand () {
  846. this.$router.push({name: 'AnalyseDemand'})
  847. },
  848. handleAccept (index, id) {
  849. console.log('接收')
  850. },
  851. handleReject (index, id) {
  852. console.log('拒绝')
  853. },
  854. loadData () {//PROJ--2019073114009
  855. this.showLoading()
  856. Http.get(Apis.PROJECT.GET_PROJECT.replace('{projectId}', this.projectId)).then((res) => {
  857. console.log(res)
  858. this.projectId = res.projectDetails.id
  859. this.project.name = res.projectDetails.name
  860. this.project.contactName = res.projectDetails.contactName
  861. this.project.contactPhone = res.projectDetails.contactPhone
  862. this.project.type = res.projectDetails.type
  863. this.project.platform = res.projectDetails.platform
  864. this.project.valuationStandard = res.projectDetails.valuationStandard
  865. this.project.entrustUnit = res.projectDetails.entrustUnit
  866. this.project.field = res.projectDetails.field
  867. this.project.desc = res.projectDetails.desc
  868. this.project.doc = []
  869. this.project.file = []
  870. this.project.resource = res.projectDetails.resource
  871. this.project.location = getProvinceCodeByProvinceName(res.projectDetails.location.provinceCode, res.projectDetails.location.cityCode)
  872. this.project.institution = res.projectDetails.institution
  873. this.project.datetime = new Date(res.projectDetails.datetime)
  874. this.project.price = res.projectDetails.price
  875. this.project.budget = res.projectDetails.budget
  876. this.project.usage = res.projectDetails.usage
  877. this.project.fileUrl = res.projectDetails.file
  878. this.project.requireDocUrl = res.projectDetails.doc
  879. this.project.userId = res.projectDetails.userId
  880. this.project.status = res.projectDetails.status
  881. this.project.statusVO = res.projectDetails.statusVO
  882. this.task = res.taskList
  883. this.reportList = res.reportList
  884. this.projectOperationControl = res.projectOperationControl
  885. this.progress = res.progress
  886. this.hideLoading()
  887. this.handleShowTaskListOrNot()
  888. for(var i = 0; i < this.progress.length; i++){
  889. if(this.progress[i].value != 0){
  890. this.setEcharts()
  891. break
  892. }
  893. }
  894. }).catch((error) => {
  895. this.hideLoading()
  896. notify('error', error.data)
  897. })
  898. },
  899. handleShowTaskListOrNot () {
  900. // console.log(storageGet('user')['userVO']['id'])
  901. if(storageGet('user')['userVO']['id'] === this.project.userId){
  902. this.showTaskList = false
  903. }
  904. },
  905. locationChange (provinceId, cityId) {
  906. if (provinceId || cityId) {
  907. this.project.location = {provinceCode: provinceId, cityCode: cityId}
  908. }
  909. },
  910. handleRemove (file, fileList) {
  911. console.log(file, fileList)
  912. },
  913. handleExceed (files, fileList) {
  914. this.$message.warning(
  915. `当前限制选择 1 个文件,本次选择了 ${
  916. files.length
  917. } 个文件,共选择了 ${files.length + fileList.length} 个文件`
  918. )
  919. },
  920. beforeRemove (file, fileList) {
  921. //return this.$confirm(`确定移除 ${file.name}?`)
  922. },
  923. beforeUploadRequireDoc () {
  924. },
  925. beforeUploadApkFile () {
  926. },
  927. uploadRequireDoc (param) {
  928. this.showLoading()
  929. const formData = new FormData()
  930. let config = {
  931. //添加请求头
  932. headers: {'Content-Type': 'multipart/form-data'},
  933. }
  934. formData.append('file', param.file)
  935. Http.upload(Apis.FILE.REQUIREMENT_FILE.replace('{userId}', this.user.userVO.id), formData, config).then((res) => {
  936. this.project.requireDocUrl = res.data
  937. this.hideLoading()
  938. notify('success', '需求文档上传成功')
  939. }).catch((error) => {
  940. this.hideLoading()
  941. notify('error', '需求文档上传失败:' + error.data)
  942. })
  943. },
  944. uploadApkFile (param) {
  945. this.showLoading()
  946. const formData = new FormData()
  947. let config = {
  948. //添加请求头
  949. headers: {'Content-Type': 'multipart/form-data'},
  950. }
  951. formData.append('file', param.file)
  952. Http.upload(Apis.FILE.APK.replace('{userId}', this.user.userVO.id), formData, config).then((res) => {
  953. this.project.fileUrl = res.data
  954. this.hideLoading()
  955. notify('success', '文件上传成功')
  956. }).catch((error) => {
  957. this.hideLoading()
  958. this.project.file = []
  959. notify('error', '文件上传失败')
  960. })
  961. },
  962. setServiceType () {
  963. getAllServiceTypes().then((res) => {
  964. this.serviceType = res
  965. })
  966. },
  967. setPlatformType () {
  968. getAllPlatformTypes().then((res) => {
  969. this.platforms = res
  970. })
  971. },
  972. setFields(){
  973. getAllFields().then((res) => {
  974. this.fields = res
  975. })
  976. } ,
  977. setInstitutions () {
  978. getAllInstitutions().then((res) => {
  979. this.institutionArray = res
  980. }).catch((error) => {
  981. notify('error', '获取institution失败' + error.data)
  982. })
  983. },
  984. setUserInfo () {
  985. this.user = storageGet('user')
  986. },
  987. checkPhoneNumber(phoneNumber){
  988. return /^1[3456789]\d{9}$/.test(phoneNumber)
  989. },
  990. showLoading () {
  991. this.loading = true
  992. },
  993. hideLoading () {
  994. this.loading = false
  995. },
  996. reformDate (date) {
  997. return getFormalTimeFromDate(date)
  998. },
  999. dateFormat (date, format) {
  1000. date = new Date(date)
  1001. let o = {
  1002. 'M+' : date.getMonth() + 1, //month
  1003. 'd+' : date.getDate(), //day
  1004. 'H+' : date.getHours(), //hour+8小时
  1005. 'm+' : date.getMinutes(), //minute
  1006. 's+' : date.getSeconds(), //second
  1007. 'q+' : Math.floor((date.getMonth() + 3) / 3), //quarter
  1008. 'S' : date.getMilliseconds() //millisecond
  1009. }
  1010. if (/(y+)/.test(format)){
  1011. format = format.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
  1012. }
  1013. for (let k in o)
  1014. if (new RegExp('(' + k + ')').test(format))
  1015. format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length));
  1016. return format;
  1017. }
  1018. }
  1019. }
  1020. </script>
  1021. <style lang="less" scoped>
  1022. .task-list {
  1023. margin: 0 30px;
  1024. }
  1025. .el-col {
  1026. padding: 0 !important;
  1027. }
  1028. .el-row {
  1029. margin-bottom: 10px;
  1030. }
  1031. .el-input {
  1032. width: 400px;
  1033. }
  1034. </style>
  1035. <!--<div class="create-body" v-if="!isModifyMode">-->
  1036. <!--<div class="title h2">分析需求</div>-->
  1037. <!--<div class="task-list">-->
  1038. <!--<el-table :data="analyseDemandList" style="width: 100%" max-height="400">-->
  1039. <!--<el-table-column prop="institution" label="承接单位" title="承接单位"></el-table-column>-->
  1040. <!--<el-table-column prop="feasibilityReport" sortable label="可行性分析报告">-->
  1041. <!--<template slot-scope="scope">-->
  1042. <!--<span v-if="!scope.row.feasibilityReport.url">暂无文件</span>-->
  1043. <!--<a-->
  1044. <!--:href="scope.row.feasibilityReport.url"-->
  1045. <!--v-if="scope.row.feasibilityReport.url"-->
  1046. <!--target="_blank"-->
  1047. <!--&gt;-->
  1048. <!--<i class="fa fa-file-text-o"></i>-->
  1049. <!--{{scope.row.feasibilityReport.name}}-->
  1050. <!--</a>-->
  1051. <!--</template>-->
  1052. <!--</el-table-column>-->
  1053. <!--<el-table-column prop="priceAuditReport" sortable label="可行性分析报告">-->
  1054. <!--<template slot-scope="scope">-->
  1055. <!--<span v-if="!scope.row.priceAuditReport.url">暂无文件</span>-->
  1056. <!--<a-->
  1057. <!--:href="scope.row.priceAuditReport.url"-->
  1058. <!--v-if="scope.row.priceAuditReport.url"-->
  1059. <!--target="_blank"-->
  1060. <!--&gt;-->
  1061. <!--<i class="fa fa-file-text-o"></i>-->
  1062. <!--{{scope.row.priceAuditReport.name}}-->
  1063. <!--</a>-->
  1064. <!--</template>-->
  1065. <!--</el-table-column>-->
  1066. <!--<el-table-column align="right" label="操作">-->
  1067. <!--<template slot-scope="scope">-->
  1068. <!--<div-->
  1069. <!--class="btn btn-small btn-info"-->
  1070. <!--@click="handleAccept(scope.$index, scope.row.id)"-->
  1071. <!--&gt;接受-->
  1072. <!--</div>-->
  1073. <!--<div-->
  1074. <!--class="btn btn-small btn-danger"-->
  1075. <!--@click="handleReject(scope.$index, scope.row.id)"-->
  1076. <!--&gt;拒绝-->
  1077. <!--</div>-->
  1078. <!--</template>-->
  1079. <!--</el-table-column>-->
  1080. <!--</el-table>-->
  1081. <!--</div>-->
  1082. <!--</div>-->