index.vue 40 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442
  1. <template>
  2. <div class="app-container planTask">
  3. <el-form
  4. :model="queryParams"
  5. ref="queryForm"
  6. :inline="true"
  7. v-show="showSearch"
  8. label-width="120px"
  9. >
  10. <el-form-item prop="type">
  11. <el-select v-model="queryParams.type" placeholder="请选择计划类型">
  12. <!-- <el-option
  13. v-for="(item, i) in ziDian"
  14. :key="i"
  15. :label="item.dictLabel"
  16. :value="item.dictLabel"
  17. >
  18. </el-option> -->
  19. <el-option label="周计划" value="week"></el-option>
  20. <el-option label="月计划" value="month"></el-option>
  21. <el-option label="年计划" value="year"></el-option>
  22. </el-select>
  23. </el-form-item>
  24. <el-form-item prop="executableUnit">
  25. <el-select
  26. v-model="queryParams.executableUnit"
  27. placeholder="请选择执行单位"
  28. >
  29. <el-option label="大队" value="productionBrigade"></el-option>
  30. <el-option label="发射一营" value="launch1"></el-option>
  31. <el-option label="发射二营" value="launch2"></el-option>
  32. <el-option label="发射三营" value="launch3"></el-option>
  33. <el-option label="发射四营" value="launch4"></el-option>
  34. <el-option label="技术部" value="technology"></el-option>
  35. <el-option label="后勤部" value="logistics"></el-option>
  36. <el-option label="后勤营一连" value="logistics1"></el-option>
  37. <el-option label="后勤营二连" value="logistics2"></el-option>
  38. <el-option label="后勤营三连" value="logistics3"></el-option>
  39. <el-option label="参谋部" value="adviser"></el-option>
  40. <el-option label="保障部" value="safeguard"></el-option>
  41. </el-select>
  42. </el-form-item>
  43. <el-form-item prop="unitId">
  44. <el-select v-model="queryParams.unitId" placeholder="请选择发布单位">
  45. <el-option label="大队" value="productionBrigade"></el-option>
  46. <el-option label="发射一营" value="launch1"></el-option>
  47. <el-option label="发射二营" value="launch2"></el-option>
  48. <el-option label="发射三营" value="launch3"></el-option>
  49. <el-option label="发射四营" value="launch4"></el-option>
  50. <el-option label="技术部" value="technology"></el-option>
  51. <el-option label="后勤部" value="logistics"></el-option>
  52. <el-option label="后勤营一连" value="logistics1"></el-option>
  53. <el-option label="后勤营二连" value="logistics2"></el-option>
  54. <el-option label="后勤营三连" value="logistics3"></el-option>
  55. <el-option label="参谋部" value="adviser"></el-option>
  56. <el-option label="保障部" value="safeguard"></el-option>
  57. </el-select>
  58. </el-form-item>
  59. <el-form-item>
  60. <el-button
  61. type="primary"
  62. icon="el-icon-refresh"
  63. size="mini"
  64. @click="resetQuery"
  65. >重置</el-button
  66. >
  67. </el-form-item>
  68. </el-form>
  69. <el-row :gutter="10" class="mb8">
  70. <el-col :span="1.5">
  71. <el-button
  72. type="primary"
  73. plain
  74. icon="el-icon-plus"
  75. size="mini"
  76. @click="handleAdd"
  77. v-hasPermi="['workingArrangements:planTask:add']"
  78. >新增</el-button
  79. >
  80. </el-col>
  81. <el-col :span="1.5">
  82. <el-button
  83. type="success"
  84. plain
  85. icon="el-icon-edit"
  86. size="mini"
  87. :disabled="single"
  88. @click="handleUpdate"
  89. v-hasPermi="['workingArrangements:planTask:edit']"
  90. >修改</el-button
  91. >
  92. </el-col>
  93. <el-col :span="1.5">
  94. <el-button
  95. type="danger"
  96. plain
  97. icon="el-icon-delete"
  98. size="mini"
  99. :disabled="multiple"
  100. @click="handleDelete"
  101. v-hasPermi="['workingArrangements:planTask:remove']"
  102. >删除</el-button
  103. >
  104. </el-col>
  105. <el-col :span="1.5">
  106. <el-button
  107. type="warning"
  108. plain
  109. icon="el-icon-download"
  110. size="mini"
  111. :loading="exportLoading"
  112. @click="handleExport"
  113. v-hasPermi="['workingArrangements:planTask:export']"
  114. >导出</el-button
  115. >
  116. </el-col>
  117. <right-toolbar
  118. :showSearch.sync="showSearch"
  119. @queryTable="getList"
  120. ></right-toolbar>
  121. </el-row>
  122. <el-table
  123. v-loading="loading"
  124. :data="planTaskList"
  125. @selection-change="handleSelectionChange"
  126. :header-cell-style="{ background: '#003C69', color: 'white' }"
  127. >
  128. <el-table-column type="selection" width="55" align="center" />
  129. <el-table-column label="名称" align="center" prop="name" />
  130. <el-table-column
  131. label="发布单位"
  132. align="center"
  133. prop="unitName"
  134. :formatter="unit3Format"
  135. />
  136. <el-table-column
  137. label="计划类型"
  138. align="center"
  139. prop="type"
  140. :formatter="unit4Format"
  141. />
  142. <el-table-column
  143. label="执行人"
  144. align="center"
  145. prop="peopleId"
  146. :formatter="unit2Format"
  147. />
  148. <el-table-column
  149. label="计划开始时间"
  150. align="center"
  151. prop="startTime"
  152. width="180"
  153. >
  154. <template slot-scope="scope">
  155. <span>{{ parseTime(scope.row.startTime, "{y}-{m}-{d}") }}</span>
  156. </template>
  157. </el-table-column>
  158. <el-table-column
  159. label="计划结束时间"
  160. align="center"
  161. prop="endTime"
  162. width="180"
  163. >
  164. <template slot-scope="scope">
  165. <span>{{ parseTime(scope.row.endTime, "{y}-{m}-{d}") }}</span>
  166. </template>
  167. </el-table-column>
  168. <el-table-column
  169. label="计划描述"
  170. align="center"
  171. prop="contents"
  172. class="discrible"
  173. show-overflow-tooltip
  174. />
  175. <el-table-column
  176. label="操作"
  177. align="center"
  178. class-name="small-padding fixed-width"
  179. width="300"
  180. >
  181. <template slot-scope="scope">
  182. <el-button
  183. size="btlook"
  184. type="text"
  185. @click="ViewProgress(scope.row)"
  186. v-if="scope.row.common == 1"
  187. >
  188. <span>进度录入</span>
  189. </el-button>
  190. <el-button
  191. size="btlook"
  192. type="text"
  193. @click="handleChakan(scope.row)"
  194. v-if="scope.row.common == 1"
  195. >
  196. <!-- 单人进度 -->
  197. <span class="chakan">查看</span>
  198. </el-button>
  199. <el-button
  200. size="btlook"
  201. type="text"
  202. @click="handleChakan1(scope.row)"
  203. v-if="scope.row.common == 2 || scope.row.common == 0"
  204. >
  205. <!-- 多人进度 -->
  206. <span class="chakan">进度查看</span>
  207. </el-button>
  208. <el-button
  209. size="btu"
  210. type="text"
  211. @click="handleUpdate(scope.row)"
  212. v-hasPermi="['workingArrangements:planTask:edit']"
  213. v-if="scope.row.common == 2"
  214. >修改</el-button
  215. >
  216. <el-button
  217. size="btd"
  218. type="text"
  219. @click="handleDelete(scope.row)"
  220. v-if="scope.row.common == 2"
  221. v-hasPermi="['workingArrangements:planTask:remove']"
  222. >删除</el-button
  223. >
  224. </template>
  225. </el-table-column>
  226. </el-table>
  227. <pagination
  228. v-show="total > 0"
  229. :total="total"
  230. :page.sync="queryParams.pageNum"
  231. :limit.sync="queryParams.pageSize"
  232. @pagination="getList"
  233. />
  234. <!-- 添加或修改工作计划对话框 -->
  235. <el-dialog
  236. :title="title"
  237. :visible.sync="open"
  238. width="990px"
  239. append-to-body
  240. class="el-dialog__header"
  241. >
  242. <el-form
  243. ref="form"
  244. :model="form"
  245. :rules="rules"
  246. label-width="100px"
  247. :inline="true"
  248. >
  249. <div class="jiben">基本信息</div>
  250. <el-form-item label="计划名称" prop="executorName">
  251. <el-input
  252. label="计划名称"
  253. v-model="form.name"
  254. placeholder="请输入计划名称"
  255. @click.native="planName"
  256. />
  257. </el-form-item>
  258. <el-form-item label="任务编号" prop="number">
  259. <el-input
  260. label="任务编号"
  261. v-model="form.number"
  262. :disabled="true"
  263. class="ipt"
  264. >
  265. </el-input>
  266. </el-form-item>
  267. <el-form-item label="发布单位" prop="unitName">
  268. <treeselect
  269. v-model="form.adminId"
  270. :options="part"
  271. placeholder="选择单位"
  272. @select="selectPeo"
  273. class="threeselects"
  274. />
  275. </el-form-item>
  276. <el-form-item label="执行单位" prop="unitName2">
  277. <treeselect
  278. v-model="form.unitId"
  279. :options="users"
  280. placeholder="请选择执行单位"
  281. class="threeselects"
  282. @select="selectPeo1"
  283. />
  284. </el-form-item>
  285. <el-form-item label="计划类型" prop="type" class="change_plan_type">
  286. <el-select
  287. v-model="queryParams.type"
  288. placeholder="请选择计划类型"
  289. ref="dict"
  290. clearable
  291. size="small"
  292. >
  293. <el-option
  294. v-for="dict in dict.type.plan_type"
  295. :key="dict.value"
  296. :label="dict.label"
  297. :value="dict.value"
  298. @click.native="chooseplan"
  299. />
  300. </el-select>
  301. </el-form-item>
  302. <div>
  303. <el-form-item label="执行人" prop="peopleName" label-width="100px">
  304. <div>
  305. <el-select
  306. multiple
  307. v-model="form.peopleName"
  308. placeholder="请选择执行人"
  309. id="execute"
  310. ref="peoplenames"
  311. >
  312. <el-option
  313. v-for="item in executor"
  314. :key="item.deptId"
  315. :label="item.nickName"
  316. :value="item.userId"
  317. id="execute"
  318. @click.native="returnExecutor(item.deptId, item.nickName)"
  319. />
  320. </el-select>
  321. </div>
  322. </el-form-item>
  323. </div>
  324. <el-form-item label="开始时间" prop="startTime">
  325. <el-date-picker
  326. clearable
  327. size="small"
  328. v-model="form.startTime"
  329. type="date"
  330. value-format="yyyy-MM-dd"
  331. placeholder="选择计划开始时间"
  332. >
  333. </el-date-picker>
  334. </el-form-item>
  335. <el-form-item label="结束时间" prop="endTime">
  336. <el-date-picker
  337. clearable
  338. size="small"
  339. v-model="form.endTime"
  340. type="date"
  341. value-format="yyyy-MM-dd"
  342. placeholder="选择计划结束时间"
  343. style="width: 200px"
  344. >
  345. </el-date-picker>
  346. </el-form-item>
  347. <div class="jiben">计划附件</div>
  348. <el-form-item style="margin-left: 30px">
  349. <fileUpload v-model="form.file" />
  350. </el-form-item>
  351. <div class="jiben">计划描述</div>
  352. <el-form-item prop="contents">
  353. <el-input
  354. v-model="form.contents"
  355. type="textarea"
  356. placeholder="请输入内容"
  357. />
  358. </el-form-item>
  359. <div class="jiben">备注</div>
  360. <el-form-item prop="remark">
  361. <el-input
  362. v-model="form.remark"
  363. type="textarea"
  364. placeholder="请输入内容"
  365. />
  366. </el-form-item>
  367. </el-form>
  368. <div slot="footer" class="dialog-footer">
  369. <el-button type="primary" @click="submitForm">确 定</el-button>
  370. <el-button @click="cancel">取 消</el-button>
  371. </div>
  372. </el-dialog>
  373. <!-- 进度录入弹框 -->
  374. <el-dialog
  375. :title="title"
  376. :visible.sync="open1"
  377. width="980px"
  378. append-to-body
  379. class="el-dialog__header"
  380. >
  381. <el-form
  382. ref="Progress"
  383. :model="Progress"
  384. :rules="rules1"
  385. label-width="100px"
  386. :inline="true"
  387. >
  388. <div class="jiben">完成进度</div>
  389. <el-form-item prop="planProgress">
  390. <!-- <el-input
  391. label="计划名称"
  392. v-model="Progress.comPlan"
  393. class="big"
  394. @change="comPlan"
  395. /> -->
  396. <div>
  397. <el-input-number
  398. v-model="Progress.planProgress"
  399. controls-position="right"
  400. :min="0"
  401. :max="100"
  402. ></el-input-number>
  403. <el-progress
  404. :text-inside="true"
  405. :stroke-width="24"
  406. :percentage="Progress.planProgress"
  407. color="rgba(41, 231, 205, 1)"
  408. class="jinduProgress"
  409. ></el-progress>
  410. </div>
  411. </el-form-item>
  412. <!-- <div class="jiben">任务周期</div>
  413. <el-form-item prop="comWeek">
  414. <el-input label="计划名称" v-model="Progress.comWeek" class="big" />
  415. </el-form-item> -->
  416. <!-- <div class="jiben">任务完成状态</div>
  417. <el-progress
  418. :text-inside="true"
  419. :stroke-width="30"
  420. :percentage="Progress.statu"
  421. style="height: 50px"
  422. ></el-progress> -->
  423. <!-- <div class="jiben">附件文档</div>
  424. <el-form-item prop="file">
  425. <el-input label="计划名称" v-model="Progress.file" class="big" />
  426. </el-form-item> -->
  427. <div class="jiben">附件</div>
  428. <el-form-item>
  429. <fileUpload v-model="Progress.file" />
  430. </el-form-item>
  431. <div class="jiben">备注</div>
  432. <el-form-item prop="remark">
  433. <el-input
  434. v-model="Progress.remark"
  435. type="textarea"
  436. placeholder="请输入内容"
  437. />
  438. </el-form-item>
  439. <!-- <div class="jiben">计划描述</div>
  440. <el-form-item prop="contents">
  441. <el-input
  442. v-model="Progress.contents"
  443. type="textarea"
  444. placeholder="请输入内容"
  445. />
  446. </el-form-item> -->
  447. <div class="jiben">完成时间</div>
  448. <el-form-item prop="accomplishTime">
  449. <el-date-picker
  450. class="comtimer"
  451. clearable
  452. size="small"
  453. v-model="Progress.accomplishTime"
  454. type="date"
  455. value-format="yyyy-MM-dd"
  456. placeholder="选择完成时间"
  457. >
  458. </el-date-picker>
  459. </el-form-item>
  460. </el-form>
  461. <div slot="footer" class="dialog-footer">
  462. <el-button type="primary" @click="submitForm1">确 定</el-button>
  463. <el-button @click="cancel">取 消</el-button>
  464. </div>
  465. </el-dialog>
  466. <!-- 进度查看弹框 -->
  467. <el-dialog
  468. :title="title"
  469. :visible.sync="open2"
  470. width="980px"
  471. append-to-body
  472. class="el-dialog__header"
  473. >
  474. <el-form
  475. ref="singleTable"
  476. :model="singleTable"
  477. :rules="rules"
  478. label-width="100px"
  479. :inline="true"
  480. >
  481. <div class="jiben">完成进度</div>
  482. <!-- <el-form-item prop="comPlan"> -->
  483. <!-- <el-input
  484. label="计划名称"
  485. v-model="ProgressLook.comPlan"
  486. class="big"
  487. /> -->
  488. <!-- </el-form-item> -->
  489. <el-progress
  490. :text-inside="true"
  491. :stroke-width="24"
  492. :percentage="singleTable.planProgresses"
  493. style="margin-bottom: 20px"
  494. color="rgba(41, 231, 205, 1)"
  495. ></el-progress>
  496. <div class="jiben">任务周期</div>
  497. <el-form-item prop="comWeek">
  498. <!-- <el-input
  499. v-model="singleTable."
  500. class="big"
  501. /> -->
  502. <div class="thistext">
  503. {{ singleTable.startTime }} 至 {{ singleTable.endTime }}
  504. </div>
  505. </el-form-item>
  506. <!-- <div class="thistext"></div> -->
  507. <div class="jiben">附件文档</div>
  508. <el-form-item prop="file">
  509. <el-input
  510. label="附件名称"
  511. v-model="singleTable.fileName"
  512. style="width: 820px"
  513. />
  514. <!-- <div>{{singleTableb.fileName}}</div> -->
  515. <a
  516. :href="singleTable.file"
  517. download
  518. title="下载"
  519. style="color: white; margin-left: 10px"
  520. class="downloadfile"
  521. >下载附件</a
  522. >
  523. </el-form-item>
  524. <!-- <a :href="singleTable.planProgress.file" style="color:white">下载附件</a> -->
  525. <div class="jiben">备注</div>
  526. <!-- <el-form-item prop="remark">
  527. <el-input
  528. v-model="ProgressLook.remark"
  529. type="textarea"
  530. placeholder="请输入内容"
  531. />
  532. </el-form-item> -->
  533. <div class="thistext">{{ singleTable.remark }}</div>
  534. <div class="jiben">任务描述</div>
  535. <!-- <el-form-item prop="contents">
  536. <el-input
  537. v-model="ProgressLook.contents"
  538. type="textarea"
  539. placeholder="请输入内容"
  540. />
  541. </el-form-item> -->
  542. <div class="thistext">{{ singleTable.contents }}</div>
  543. <!-- <div class="jiben">执行人信息</div>
  544. <el-table
  545. :data="tableData"
  546. border
  547. style="width: 100%; background: #004d86"
  548. >
  549. <el-table-column prop="date" label="执行人" width="180">
  550. </el-table-column>
  551. <el-table-column prop="name" label="任务周期" width="180">
  552. </el-table-column>
  553. <el-table-column prop="address" label="进度"></el-table-column>
  554. <el-table-column prop="date" label="完成时间" width="180">
  555. </el-table-column>
  556. <el-table-column prop="name" label="状态" width="180">
  557. </el-table-column>
  558. <el-table-column prop="address" label="下载"></el-table-column>
  559. </el-table> -->
  560. </el-form>
  561. <div slot="footer" class="dialog-footer">
  562. <el-button type="primary" @click="submitForm2">确 定</el-button>
  563. <el-button @click="cancel">取 消</el-button>
  564. </div>
  565. </el-dialog>
  566. <!-- 进度查看1弹框 -->
  567. <el-dialog
  568. :title="title"
  569. :visible.sync="open3"
  570. width="980px"
  571. append-to-body
  572. class="el-dialog__header"
  573. >
  574. <el-form
  575. ref="moreTable"
  576. :model="moreTable"
  577. :rules="rules"
  578. label-width="100px"
  579. :inline="true"
  580. >
  581. <div class="jiben">完成进度</div>
  582. <el-progress
  583. :text-inside="true"
  584. :stroke-width="24"
  585. :percentage="comstatus"
  586. style="margin-bottom: 20px"
  587. color="rgba(41, 231, 205, 1)"
  588. ></el-progress>
  589. <div class="jiben">任务周期</div>
  590. <!-- <el-form-item prop="comWeek">
  591. <el-input
  592. label="计划名称"
  593. v-model="moreTable.startTime"
  594. class="big"
  595. :disabled="true"
  596. />
  597. </el-form-item> -->
  598. <div class="thistext">
  599. {{ moreTable.startTime }} 至 {{ moreTable.endTime }}
  600. </div>
  601. <!-- <div class="thistext"></div> -->
  602. <div class="jiben">附件文档</div>
  603. <el-form-item prop="file">
  604. <!-- <el-input label="计划名称" v-model="ProgressLook.file" class="big" /> -->
  605. <!-- <a :href="moreTable.file" download title="下载" style="color:white;margin-left:10px">下载附件</a> -->
  606. <el-input
  607. label="附件名称"
  608. v-model="singleTable.fileName"
  609. style="width: 820px"
  610. />
  611. <!-- <div>{{singleTableb.fileName}}</div> -->
  612. <a
  613. :href="moreTable.file"
  614. download
  615. title="下载"
  616. style="color: white; margin-left: 10px"
  617. class="downloadfile"
  618. >下载附件</a
  619. >
  620. </el-form-item>
  621. <div class="jiben">备注</div>
  622. <!-- <el-form-item prop="remark">
  623. <el-input
  624. v-model="ProgressLook.remark"
  625. type="textarea"
  626. placeholder="请输入内容"
  627. />
  628. </el-form-item> -->
  629. <div class="thistext">{{ moreTable.remark }}</div>
  630. <div class="jiben">任务描述</div>
  631. <!-- <el-form-item prop="contents">
  632. <el-input
  633. v-model="ProgressLook.contents"
  634. type="textarea"
  635. placeholder="请输入内容"
  636. />
  637. </el-form-item> -->
  638. <div class="thistext">{{ moreTable.contents }}</div>
  639. <div class="jiben">执行人信息</div>
  640. <el-table
  641. :data="moreTable.planProgresses"
  642. border
  643. style="width: 100%; background: #004d86"
  644. class="tabless"
  645. >
  646. <el-table-column prop="peopleName" label="执行人" width="180">
  647. </el-table-column>
  648. <el-table-column label="任务周期" width="190">
  649. <template slot-scope="scope">
  650. <div>{{ scope.row.taskCycle }}</div>
  651. </template>
  652. </el-table-column>
  653. <el-table-column prop="schedule" label="进度">
  654. <template slot-scope="scope">
  655. <el-progress
  656. :text-inside="true"
  657. :stroke-width="24"
  658. :percentage="scope.row.schedule"
  659. style="margin-bottom: 20px"
  660. color="rgba(41, 231, 205, 1)"
  661. ></el-progress>
  662. </template>
  663. </el-table-column>
  664. <el-table-column prop="accomplishTime" label="完成时间" width="180">
  665. </el-table-column>
  666. <el-table-column label="状态" width="180">
  667. <template slot-scope="scope">
  668. <div>{{ scope.row.schedule == 100 ? "完成" : "未完成" }}</div>
  669. </template>
  670. </el-table-column>
  671. <el-table-column prop="address" label="下载">
  672. <template slot-scope="scope">
  673. <a :href="scope.row.file" download>下载附件</a>
  674. </template>
  675. </el-table-column>
  676. </el-table>
  677. </el-form>
  678. <div slot="footer" class="dialog-footer">
  679. <el-button type="primary" @click="submitForm2">确 定</el-button>
  680. <el-button @click="cancel">取 消</el-button>
  681. </div>
  682. </el-dialog>
  683. </div>
  684. </template>
  685. <script>
  686. import {
  687. listPlanTask,
  688. getPlanTask,
  689. delPlanTask,
  690. addPlanTask,
  691. updatePlanTask,
  692. exportPlanTask,
  693. singProgress,
  694. moreProgress,
  695. uploadProgress,
  696. } from "@/api/workingArrangements/planTask";
  697. import { getDicts } from "@/api/system/dict/data";
  698. import {
  699. deptUser,
  700. allUser,
  701. getDept,
  702. getDeptList,
  703. } from "@/api/workingArrangements/workTask";
  704. import Treeselect from "@riophae/vue-treeselect";
  705. import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  706. import { getDept2 } from "@/api/grassrootsregistration/bdglmeeting";
  707. export default {
  708. name: "PlanTask",
  709. dicts: ["plan_type"],
  710. components: { Treeselect },
  711. data() {
  712. return {
  713. // 遮罩层
  714. loading: true,
  715. // 导出遮罩层
  716. exportLoading: false,
  717. // 选中数组
  718. ids: [],
  719. // 非单个禁用
  720. single: true,
  721. // 非多个禁用
  722. multiple: true,
  723. // 显示搜索条件
  724. showSearch: true,
  725. // 总条数
  726. total: 0,
  727. // 工作计划表格数据
  728. planTaskList: [],
  729. // 弹出层标题
  730. title: "",
  731. // 是否显示弹出层
  732. open: false,
  733. // 显示进度录入框
  734. open1: false,
  735. // 显示进度查看框
  736. open2: false,
  737. // 显示多人进度查看框
  738. open3: false,
  739. // 查询参数
  740. queryParams: {
  741. pageNum: 1,
  742. pageSize: 10,
  743. name: null,
  744. peopleId: null,
  745. number: null,
  746. startTime: null,
  747. endTime: null,
  748. file: null,
  749. fileName: null,
  750. contents: null,
  751. adminId: null,
  752. unitId: null,
  753. unitName: null,
  754. createtime: null,
  755. updatetime: null,
  756. type: null,
  757. peopleName: null,
  758. unitName2: null,
  759. taskProgress: null,
  760. releaseUnit: null,
  761. executableUnit: null,
  762. },
  763. // 表单参数
  764. form: {},
  765. // 表单校验
  766. rules: {
  767. number: [{ required: true, message: "编号不能为空", trigger: "blur" }],
  768. peopleName: [
  769. { required: true, message: "执行人不能为空", trigger: "blur" },
  770. ],
  771. // unitName:{required:true,message:"发布单位不能为空",trigger:"blur"},
  772. // unitName2:{required:true,message:"执行单位不能为空",trigger:"blur"},
  773. // name:[{required:true,message:"计划名称不能为空",trigger:"blur"}]
  774. },
  775. rules1: {
  776. planProgress: [
  777. { required: true, message: "请输入完成进度", trigger: "blur" },
  778. ],
  779. },
  780. // 获取部门列表
  781. part: [],
  782. // 获取执行单位
  783. ExecutableUnit: [],
  784. // 执行人
  785. executor: [],
  786. // 发布单位id
  787. issueUnit: [],
  788. // 执行人姓名
  789. executorName: [],
  790. // 执行单位id
  791. executableUnitId: [],
  792. rylist: [],
  793. // 部门列表
  794. getdeptList: [],
  795. // 进度录入参数
  796. Progress: {
  797. schedule: "",
  798. file: "",
  799. remark: "",
  800. accomplishTime: "",
  801. },
  802. // 进度查看参数
  803. ProgressLook: {},
  804. // 查询字典
  805. dictType: {
  806. dictType: "plan_type",
  807. },
  808. // 执行单位列表
  809. users: [],
  810. // 字典
  811. ziDian: [],
  812. // 进度查看
  813. tableData: [],
  814. // 单人进度查看列表
  815. singleTable: [],
  816. // 多人进度查看列表
  817. moreTable: [],
  818. // 进度录入id
  819. jinduId: "",
  820. // 进度表格
  821. jinduTable: [],
  822. partsp: null,
  823. comstatus: 0,
  824. };
  825. },
  826. created() {
  827. this.getList();
  828. this.getdept();
  829. allUser().then((res) => {
  830. this.rylist = res.rows;
  831. });
  832. this.getdict();
  833. this.chooseplan();
  834. getDeptList().then((res) => {
  835. this.getdeptList = res.data;
  836. console.log(this.getdeptList);
  837. });
  838. },
  839. methods: {
  840. comPlan() {
  841. if (this.Progress.comPlan > 100) {
  842. this.Progress.comPlan = 0;
  843. alert("完成进度不能大于100");
  844. return;
  845. } else {
  846. this.Progress.statu = this.Progress.comPlan;
  847. console.log("输入成功");
  848. }
  849. },
  850. // 获取执行人
  851. getZhuChi(id) {
  852. deptUser(id).then((res) => {
  853. // this.renYuan = res.data;
  854. this.executor = res.data;
  855. });
  856. },
  857. // 发布单位选中触发
  858. selectPeo(val) {
  859. this.form.adminId = val.id;
  860. this.getZhuChi(this.form.adminId);
  861. },
  862. // 执行单位选中触发
  863. selectPeo1(val) {
  864. this.form.unitId = val.id;
  865. this.form.peopleName = "";
  866. this.getZhuChi(this.form.unitId);
  867. },
  868. // 查询计划类型
  869. getdict() {
  870. getDicts(this.dictType.dictType).then((res) => {
  871. this.ziDian = res.data;
  872. });
  873. },
  874. /** 查询工作计划列表 */
  875. getList() {
  876. this.loading = true;
  877. listPlanTask(this.queryParams).then((response) => {
  878. this.planTaskList = response.rows;
  879. console.log(this.planTaskList);
  880. this.total = response.total;
  881. this.loading = false;
  882. });
  883. },
  884. // 取消按钮
  885. cancel() {
  886. this.open = false;
  887. this.comstatus = 0;
  888. this.reset();
  889. this.open1 = false;
  890. this.open2 = false;
  891. this.open3 = false;
  892. },
  893. // 表单重置
  894. reset() {
  895. this.form = {
  896. id: null,
  897. name: null,
  898. peopleId: null,
  899. number: null,
  900. startTime: null,
  901. endTime: null,
  902. file: null,
  903. fileName: null,
  904. remark: null,
  905. contents: null,
  906. adminId: null,
  907. unitId: null,
  908. unitName: null,
  909. createtime: null,
  910. updatetime: null,
  911. type: null,
  912. peopleName: null,
  913. unitName2: null,
  914. taskProgress: null,
  915. releaseUnit: null,
  916. executableUnit: null,
  917. };
  918. this.Progress = {
  919. schedule: "",
  920. file: "",
  921. remark: "",
  922. accomplishTime: "",
  923. };
  924. this.resetForm("form");
  925. },
  926. /** 搜索按钮操作 */
  927. handleQuery() {
  928. this.queryParams.pageNum = 1;
  929. this.getList();
  930. },
  931. /** 重置按钮操作 */
  932. resetQuery() {
  933. this.resetForm("queryForm");
  934. this.handleQuery();
  935. },
  936. // 多选框选中数据
  937. handleSelectionChange(selection) {
  938. this.ids = selection.map((item) => item.id);
  939. this.single = selection.length !== 1;
  940. this.multiple = !selection.length;
  941. console.log(this.multiple);
  942. },
  943. /** 新增按钮操作 */
  944. handleAdd() {
  945. this.reset();
  946. this.open = true;
  947. this.title = "添加工作计划";
  948. // 获取执行单位列表
  949. getDept2().then((res) => {
  950. // console.log(res,2)
  951. this.users = res.data;
  952. console.log(this.users);
  953. });
  954. this.getdict();
  955. },
  956. /** 进度录入按钮操作 */
  957. ViewProgress(row) {
  958. // this.reset();
  959. this.open1 = true;
  960. this.title = "进度录入";
  961. this.jinduId = row.id;
  962. singProgress(this.jinduId).then((res) => {
  963. console.log(res.data);
  964. this.Progress.id = res.data.planProgress.id;
  965. this.Progress.taskId = res.data.id;
  966. this.Progress.planProgress = res.data.planProgress.schedule;
  967. console.log(this.Progress.planProgress.schedule);
  968. });
  969. },
  970. // 进度查看单人进度
  971. handleChakan(row) {
  972. this.reset();
  973. this.open2 = true;
  974. this.title = "进度查看";
  975. // 获取当前行的id
  976. singProgress(row.id).then((res) => {
  977. this.singleTable = res.data;
  978. this.singleTable.planProgresses =
  979. this.singleTable.planProgress.schedule;
  980. console.log(this.singleTable);
  981. // this.singleTable.jindu=singleTable.planProgress.schedule
  982. // console.log(this.singleTable)
  983. });
  984. },
  985. // 多人进度查看
  986. handleChakan1(row) {
  987. this.reset();
  988. this.open3 = true;
  989. this.title = "进度查看";
  990. // 获取当前行的id
  991. // console.log(row.id)
  992. moreProgress(row.id).then((res) => {
  993. this.moreTable = res.data;
  994. console.log(this.moreTable);
  995. this.moreTable.planProgresses.forEach((item) => {
  996. this.comstatus +=
  997. item.schedule / this.moreTable.planProgresses.length;
  998. // this.comstatus=0
  999. });
  1000. });
  1001. },
  1002. /** 修改按钮操作 */
  1003. handleUpdate(row) {
  1004. this.reset();
  1005. getDept2().then((res) => {
  1006. // console.log(res,2)
  1007. this.users = res.data;
  1008. console.log(this.users);
  1009. });
  1010. const id = row.id || this.ids;
  1011. getPlanTask(id).then((response) => {
  1012. this.form = response.data;
  1013. // this.getDept2()
  1014. this.getZhuChi(this.form.unitId);
  1015. this.form.peopleName = this.form.peopleName.split(",").map(Number);
  1016. this.open = true;
  1017. this.title = "修改工作计划";
  1018. });
  1019. },
  1020. unit2Format(row, column) {
  1021. var deptName = "";
  1022. if (
  1023. parseInt(this.planTaskList[0].common) == 1 ||
  1024. this.planTaskList[0].common == 2
  1025. ) {
  1026. this.rylist.map((item) => {
  1027. row.peopleName.split(",").forEach((items, index) => {
  1028. if (item.userId == items) {
  1029. deptName += item.nickName + " ";
  1030. }
  1031. });
  1032. });
  1033. } else if (parseInt(this.planTaskList[0].common) == 0) {
  1034. this.rylist.map((item) => {
  1035. row.peopleName.split(",").forEach((items, index) => {
  1036. if (item.userId == items) {
  1037. deptName += item.nickName + " ";
  1038. }
  1039. });
  1040. });
  1041. }
  1042. return deptName;
  1043. },
  1044. unit3Format(row, column) {
  1045. var deptName = "";
  1046. // console.log(this.planTaskList[0])
  1047. if (
  1048. parseInt(this.planTaskList[0].common) == 1 ||
  1049. this.planTaskList[0].common == 2
  1050. ) {
  1051. this.getdeptList.map((item) => {
  1052. if (item.deptId == row.adminId) {
  1053. deptName = item.deptName;
  1054. }
  1055. });
  1056. } else if (parseInt(this.planTaskList[0].common) == 0) {
  1057. console.log(this.part);
  1058. this.part[0].children.map((item) => {
  1059. if (item.id == row.adminId) {
  1060. deptName = item.label;
  1061. }
  1062. });
  1063. }
  1064. return deptName;
  1065. },
  1066. unit4Format(row, column) {
  1067. var deptName = "";
  1068. this.ziDian.map((item) => {
  1069. if (item.dictSort == row.type) {
  1070. deptName = item.dictLabel;
  1071. }
  1072. });
  1073. return deptName;
  1074. },
  1075. /** 提交按钮 */
  1076. submitForm() {
  1077. this.$refs["form"].validate((valid) => {
  1078. if (valid) {
  1079. if (this.form.adminId === this.form.unitId) {
  1080. alert("发布单位和执行单位不能相同");
  1081. } else {
  1082. this.form.peopleName = this.form.peopleName.join(",");
  1083. this.form.peopleId = this.form.peopleName;
  1084. console.log(this.form);
  1085. if (this.form.id != null) {
  1086. updatePlanTask(this.form).then((response) => {
  1087. this.$modal.msgSuccess("修改成功");
  1088. this.open = false;
  1089. this.getList();
  1090. });
  1091. } else {
  1092. addPlanTask(this.form).then((response) => {
  1093. this.$modal.msgSuccess("新增成功");
  1094. this.open = false;
  1095. this.getList();
  1096. });
  1097. }
  1098. }
  1099. }
  1100. });
  1101. },
  1102. submitForm1() {
  1103. this.$refs["Progress"].validate((valid) => {
  1104. if (valid) {
  1105. console.log(this.jinduId);
  1106. this.Progress.schedule = this.Progress.planProgress;
  1107. uploadProgress(this.Progress).then((res1) => {
  1108. console.log(res1);
  1109. this.$modal.msgSuccess("上传成功");
  1110. // this.Progress
  1111. this.reset();
  1112. this.open1 = false;
  1113. this.getList();
  1114. });
  1115. }
  1116. });
  1117. },
  1118. submitForm2() {
  1119. this.comstatus = 0;
  1120. this.open2 = false;
  1121. this.open3 = false;
  1122. },
  1123. /** 删除按钮操作 */
  1124. handleDelete(row) {
  1125. const ids = row.id || this.ids;
  1126. this.$modal
  1127. .confirm('是否确认删除工作计划编号为"' + ids + '"的数据项?')
  1128. .then(function () {
  1129. return delPlanTask(ids);
  1130. })
  1131. .then(() => {
  1132. this.getList();
  1133. this.$modal.msgSuccess("删除成功");
  1134. })
  1135. .catch(() => {});
  1136. },
  1137. /** 导出按钮操作 */
  1138. handleExport() {
  1139. const queryParams = this.queryParams;
  1140. this.$modal
  1141. .confirm("是否确认导出所有工作计划数据项?")
  1142. .then(() => {
  1143. this.exportLoading = true;
  1144. return exportPlanTask(queryParams);
  1145. })
  1146. .then((response) => {
  1147. this.$download.name(response.msg);
  1148. this.exportLoading = false;
  1149. })
  1150. .catch(() => {});
  1151. },
  1152. // 发布单位接口
  1153. getdept() {
  1154. getDept().then((res) => {
  1155. this.part = res.data;
  1156. });
  1157. },
  1158. // 发送执行人列表
  1159. returnExecutor(id, name) {
  1160. console.log(this.form.peopleName);
  1161. },
  1162. // 计划编号
  1163. planName() {
  1164. let date = new Date();
  1165. let year = date.getFullYear();
  1166. let month =
  1167. date.getMonth() + 1 <= 9
  1168. ? "0" + (date.getMonth() + 1)
  1169. : date.getMonth() + 1;
  1170. let day = date.getDate();
  1171. let hour = date.getHours() <= 9 ? "0" + date.getHours() : date.getHours();
  1172. let minute =
  1173. date.getMinutes <= 9 ? "0" + date.getMinutes() : date.getMinutes();
  1174. this.form.number = year + month + day + hour + minute;
  1175. },
  1176. // 获取发布单位id
  1177. issueunit(id) {
  1178. this.form.adminId = id;
  1179. },
  1180. // 选择计划
  1181. chooseplan() {
  1182. this.form.type = this.queryParams.type;
  1183. },
  1184. },
  1185. };
  1186. </script>
  1187. <style>
  1188. .el-input__inner {
  1189. height: 36px;
  1190. line-height: 36px;
  1191. background-color: #00365f;
  1192. color: #fff;
  1193. }
  1194. .el-select-dropdown {
  1195. background-color: white;
  1196. }
  1197. .el-dialog__wrapper .el-form-item__label {
  1198. color: white !important;
  1199. }
  1200. .el-dialog {
  1201. background-color: #004d86 !important;
  1202. }
  1203. .el-form-item__label {
  1204. width: 30%;
  1205. }
  1206. .el-textarea {
  1207. width: 70%;
  1208. }
  1209. .el-dialog__title {
  1210. color: white;
  1211. }
  1212. .el-dialog__header {
  1213. border-bottom: 1px solid #718a9d;
  1214. }
  1215. .el-textarea__inner {
  1216. width: 945px;
  1217. height: 104px;
  1218. }
  1219. /* 表宽度 */
  1220. .el-input {
  1221. width: 200px;
  1222. }
  1223. .serialNumber {
  1224. border: 1px solid white;
  1225. border-radius: 5px;
  1226. width: 200px;
  1227. text-indent: 1em;
  1228. color: white;
  1229. line-height: 36px;
  1230. }
  1231. .el-date-editor.el-input,
  1232. .el-date-editor {
  1233. width: 200px;
  1234. }
  1235. /* 执行 */
  1236. #execute {
  1237. width: 510px;
  1238. /* width: auto; */
  1239. }
  1240. .el-input--suffix {
  1241. width: auto;
  1242. }
  1243. /* 计划附件 */
  1244. .el-upload__tip {
  1245. position: absolute;
  1246. top: -5px;
  1247. width: 500px;
  1248. left: 100px;
  1249. color: white;
  1250. }
  1251. /* 上传附件样式 */
  1252. .el-icon-document {
  1253. padding: 3px 5px;
  1254. color: white;
  1255. }
  1256. .el-upload-list__item:hover {
  1257. background-color: #00365f;
  1258. }
  1259. /* 上传附件的删除按钮样式 */
  1260. .el-link--inner {
  1261. margin-left: 3px;
  1262. }
  1263. .el-select-dropdown__item:hover {
  1264. color: #1890ff !important;
  1265. }
  1266. /* 下拉框的颜色 */
  1267. .el-scrollbar li {
  1268. background-color: white;
  1269. color: black;
  1270. }
  1271. .el-scrollbar li:hover {
  1272. background-color: #00365f;
  1273. color: white;
  1274. }
  1275. .el-select-dropdown__wrap .el-scrollbar__view {
  1276. background-color: white;
  1277. }
  1278. /* 修改计划类型样式 */
  1279. .el-input--small .el-input__inner {
  1280. height: 36px;
  1281. line-height: 36px;
  1282. }
  1283. .el-input--medium .el-input__inner {
  1284. background-color: rgba(0, 0, 0, 0);
  1285. }
  1286. /* 修改编号样式 */
  1287. .ipt .el-input__inner {
  1288. background-color: #004d86 !important;
  1289. }
  1290. /* 进度查看 */
  1291. .el-button--btlook.is-active,
  1292. .el-button--btlook:active {
  1293. background: #32a5d3;
  1294. border-color: #32a5d3;
  1295. color: #ffffff;
  1296. }
  1297. .el-button--btlook:focus,
  1298. .el-button--btlook:hover {
  1299. background: #32a5d3;
  1300. border-color: #32a5d3;
  1301. color: #ffffff;
  1302. }
  1303. .el-button--btlook {
  1304. width: 70px !important;
  1305. border: 1px solid transparent;
  1306. padding: 3px 8px;
  1307. font-size: 14px;
  1308. line-height: 1.5;
  1309. border-radius: 3px;
  1310. color: #fff;
  1311. background-color: #32a5d3;
  1312. }
  1313. .big .el-input__inner {
  1314. width: 940px;
  1315. }
  1316. /* 树形 */
  1317. .threeselects {
  1318. width: 200px;
  1319. }
  1320. .threeselects .vue-treeselect__input {
  1321. background-color: #004d86;
  1322. /* color: white; */
  1323. }
  1324. .el-form-item__content {
  1325. /* color: white; */
  1326. border-bottom: 1px solid #004d86;
  1327. }
  1328. .vue-treeselect__control {
  1329. background-color: #004d86;
  1330. border-bottom: 1px solid white;
  1331. /* color: whi; */
  1332. /* color: white; */
  1333. }
  1334. .vue-treeselect__placeholder {
  1335. color: white;
  1336. }
  1337. .change_plan_type .el-input__inner {
  1338. width: 200px;
  1339. }
  1340. /* 表格样式 */
  1341. .el-table__empty-block {
  1342. background-color: #004d86;
  1343. }
  1344. .el-table {
  1345. background-color: #004d86;
  1346. }
  1347. .comtimer .el-input__inner {
  1348. width: 940px;
  1349. }
  1350. /* 备注 */
  1351. .thistext {
  1352. color: white;
  1353. width: 940px;
  1354. border: 1px solid #fff;
  1355. border-radius: 4px;
  1356. height: auto;
  1357. line-height: 36px;
  1358. text-indent: 1em;
  1359. margin-bottom: 20px;
  1360. /* margin: auto; */
  1361. }
  1362. /* 完成进度 */
  1363. .complue .el-input__inner {
  1364. width: 940px;
  1365. }
  1366. .complue {
  1367. width: 940px;
  1368. }
  1369. /* 进度 */
  1370. .jinduProgress {
  1371. width: 740px;
  1372. position: absolute;
  1373. left: 210px;
  1374. top: 5px;
  1375. }
  1376. /* 表格 */
  1377. .tabless .el-table__row {
  1378. background-color: #004d86;
  1379. }
  1380. .tabless table {
  1381. border: 1px solid white;
  1382. }
  1383. .has-gutter {
  1384. background-color: #004d86;
  1385. }
  1386. .el-table tr:nth-child(odd) {
  1387. background-color: #004d86;
  1388. }
  1389. .el-table tr:nth-child(even) {
  1390. background-color: #004d86;
  1391. }
  1392. /* 下载按钮 */
  1393. .downloadfile {
  1394. border: 1px solid white;
  1395. display: inline-block;
  1396. width: 100px;
  1397. height: 33px;
  1398. border-radius: 5px;
  1399. line-height: 33px;
  1400. text-align: center;
  1401. }
  1402. .el-table__row {
  1403. border-bottom: 1px solid white;
  1404. }
  1405. .el-input-number__increase {
  1406. background-color: #004d86;
  1407. }
  1408. .el-input-number__decrease {
  1409. background-color: #004d86;
  1410. }
  1411. /* 进度条百分比 */
  1412. .el-progress-bar__innerText {
  1413. color: #004d86;
  1414. /* font-weight: 200; */
  1415. }
  1416. .el-progress-bar__outer {
  1417. background-color: rgba(25, 98, 153, 1);
  1418. }
  1419. /* 上下箭头 */
  1420. .el-icon-arrow-up,
  1421. .el-icon-arrow-down {
  1422. color: white;
  1423. }
  1424. .vue-treeselect__single-value {
  1425. color: white;
  1426. }
  1427. /* 文字多余部分省略 */
  1428. .el-table__cell .cell {
  1429. overflow: hidden;
  1430. text-overflow: ellipsis;
  1431. white-space: nowrap;
  1432. }
  1433. </style>