index.vue 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662
  1. <template>
  2. <div class="app-container">
  3. <el-row :gutter="20">
  4. <!--机构数据-->
  5. <el-col :span="4" :xs="24">
  6. <org-tree
  7. v-model="queryParams.orgId"
  8. @defaultKey="getDefaultKey"
  9. @checkChange="checkChange"
  10. @click="clickTreeNode"
  11. hangsheTree
  12. :defaultCheckSub="false"
  13. ></org-tree>
  14. </el-col>
  15. <el-col :span="20" :xs="24">
  16. <!-- 搜索条件 -->
  17. <el-form
  18. :model="queryParams"
  19. ref="search"
  20. size="small"
  21. :inline="true"
  22. v-show="showSearch"
  23. label-width="90px"
  24. >
  25. <el-row>
  26. <el-form-item prop="checkType" label="任务类型">
  27. <el-select
  28. prop="checkType"
  29. label="任务类型"
  30. v-model="queryParams.checkType"
  31. placeholder="请选择任务类型"
  32. clearable
  33. >
  34. <el-option
  35. v-for="dict in dict.type.check_type"
  36. :key="dict.value"
  37. :label="dict.label"
  38. :value="dict.value"
  39. />
  40. </el-select>
  41. </el-form-item>
  42. <el-form-item prop="execOrgType" label="检查机构类型" v-if="false">
  43. <el-select
  44. prop="execOrgType"
  45. label="检查机构类型"
  46. v-model="queryParams.execOrgType"
  47. placeholder="请选择检查机构类型"
  48. clearable
  49. >
  50. <el-option
  51. v-for="dict in dict.type.sys_org_type"
  52. :key="dict.value"
  53. :label="dict.label"
  54. :value="dict.value"
  55. />
  56. </el-select>
  57. </el-form-item>
  58. <el-form-item prop="checkOrgType" label="受检机构类型" v-if="false">
  59. <el-select
  60. prop="checkOrgType"
  61. label="受检机构类型"
  62. v-model="queryParams.checkOrgType"
  63. placeholder="请选择受检机构类型"
  64. clearable
  65. >
  66. <el-option
  67. v-for="dict in dict.type.sys_org_type"
  68. :key="dict.value"
  69. :label="dict.label"
  70. :value="dict.value"
  71. />
  72. </el-select>
  73. </el-form-item>
  74. <el-form-item prop="checkRole" label="检查人员">
  75. <el-select
  76. @visible-change="getRolesByOrg"
  77. prop="checkRole"
  78. label="检查人员"
  79. v-model="queryParams.checkRole"
  80. placeholder="请选择用户角色"
  81. clearable
  82. >
  83. <el-option
  84. v-for="dict in resumptionRoles"
  85. :key="dict.index"
  86. :label="dict.roleName"
  87. :value="dict.id"
  88. />
  89. </el-select>
  90. </el-form-item>
  91. <el-form-item prop="planCycle" label="任务周期">
  92. <el-select
  93. prop="planCycle"
  94. label="任务周期"
  95. v-model="queryParams.planCycle"
  96. placeholder="请选择任务周期"
  97. clearable
  98. >
  99. <el-option
  100. v-for="item in dict.type.check_cycle"
  101. :key="item.value"
  102. :label="item.label"
  103. :value="item.value"
  104. >
  105. </el-option>
  106. </el-select>
  107. </el-form-item>
  108. </el-row>
  109. <el-row>
  110. <el-form-item prop="planStatus" label="任务状态">
  111. <el-select
  112. prop="planStatus"
  113. label="任务状态"
  114. v-model="queryParams.planStatus"
  115. placeholder="请选择任务状态"
  116. clearable
  117. >
  118. <el-option
  119. v-for="item in dict.type.check_status"
  120. :key="item.value"
  121. :label="item.label"
  122. :value="item.value"
  123. >
  124. </el-option>
  125. </el-select>
  126. </el-form-item>
  127. <el-form-item prop="planName" label="任务名称">
  128. <el-input
  129. v-model="queryParams.planName"
  130. :maxlength="50"
  131. name="planName"
  132. placeholder="请输入关键字"
  133. clearable
  134. />
  135. </el-form-item>
  136. </el-row>
  137. <el-row>
  138. <el-form-item>
  139. <el-button
  140. type="primary"
  141. icon="el-icon-search"
  142. size="mini"
  143. @click="getList"
  144. >搜索</el-button
  145. >
  146. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
  147. >重置</el-button
  148. ><el-button
  149. type="primary"
  150. icon="el-icon-plus"
  151. size="mini"
  152. @click="handleAdd()"
  153. v-hasPermi="['core:checkplan:add']"
  154. >新增任务</el-button
  155. >
  156. </el-form-item>
  157. </el-row>
  158. </el-form>
  159. <!-- 按纽
  160. <el-row :gutter="10" class="mb8">
  161. <el-col :span="1.5"> </el-col>
  162. <right-toolbar
  163. :showSearch.sync="showSearch"
  164. @queryTable="getList"
  165. :columns="columns"
  166. ></right-toolbar>
  167. </el-row> -->
  168. <el-table
  169. border
  170. height="600"
  171. size="small"
  172. v-loading="loading"
  173. :data="pageData"
  174. @selection-change="handleSelectionChange"
  175. row-key="id"
  176. :tree-props="{ children: 'children' }"
  177. >
  178. <el-table-column
  179. align="center"
  180. type="index"
  181. label="序号"
  182. width="80px"
  183. v-if="columns[0].visible"
  184. ></el-table-column>
  185. <el-table-column
  186. prop="planName"
  187. label="任务名称"
  188. v-if="columns[1].visible"
  189. ></el-table-column>
  190. <el-table-column
  191. prop="checkType"
  192. label="任务类型"
  193. v-if="columns[2].visible"
  194. >
  195. <template slot-scope="r"
  196. >{{ getLabel(dict.type.check_type, `${r.row.checkType}`) }}
  197. </template>
  198. </el-table-column>
  199. <el-table-column
  200. prop="planCreateOrgName"
  201. label="创建机构"
  202. v-if="columns[3].visible"
  203. >
  204. </el-table-column>
  205. <el-table-column
  206. prop="planOfOrgName"
  207. label="行社名称"
  208. v-if="columns[4].visible"
  209. >
  210. </el-table-column>
  211. <el-table-column prop="execOrgType" label="检查主体">
  212. <template slot-scope="r"
  213. >{{ getLabel(dict.type.sys_org_type, `${r.row.execOrgType}`) }}
  214. </template>
  215. </el-table-column>
  216. <el-table-column prop="checkOrgType" label="受检机构" width="120px">
  217. <template slot-scope="r"
  218. >{{ getLabel(dict.type.sys_org_type, `${r.row.checkOrgType}`) }}
  219. </template>
  220. </el-table-column>
  221. <el-table-column
  222. prop="roleNames"
  223. label="检查人员"
  224. v-if="columns[6].visible"
  225. >
  226. <template slot-scope="scope">
  227. <template v-for="item in splitRoleNames(scope.row.roleNames)">
  228. {{ item }}
  229. <br />
  230. </template> </template
  231. ></el-table-column>
  232. <el-table-column
  233. prop="planCycle"
  234. label="任务周期"
  235. width="80px"
  236. v-if="columns[6].visible"
  237. >
  238. <template slot-scope="r"
  239. >{{ getLabel(dict.type.check_cycle, `${r.row.planCycle}`) }}
  240. </template>
  241. </el-table-column>
  242. <el-table-column
  243. align="center"
  244. prop="count"
  245. label="任务次数"
  246. v-if="columns[6].visible"
  247. ></el-table-column>
  248. <el-table-column
  249. prop="planStatus"
  250. label="任务状态"
  251. width="80px"
  252. v-if="columns[6].visible"
  253. >
  254. <template slot-scope="r"
  255. >{{ getLabel(dict.type.check_status, `${r.row.planStatus}`) }}
  256. </template>
  257. </el-table-column>
  258. <el-table-column
  259. prop="modifiedName"
  260. label="修改人"
  261. v-if="false"
  262. ></el-table-column>
  263. <el-table-column
  264. prop="updateTime"
  265. label="修改时间"
  266. width="80px"
  267. v-if="false"
  268. >
  269. <template slot-scope="scope">
  270. <span>{{ formatTime(scope.row.updateTime, "YYYY-MM-DD") }}</span>
  271. </template>
  272. </el-table-column>
  273. <el-table-column label="操作" min-width="200">
  274. <template slot-scope="r">
  275. <el-button
  276. v-if="eqOrg(r.row)"
  277. size="mini"
  278. type="text"
  279. icon="el-icon-edit-outline"
  280. @click="onEdit(r.row.id)"
  281. v-hasPermi="['core:checkplan:edit']"
  282. >编辑</el-button
  283. >
  284. <el-button
  285. v-if="eqOrg2(r.row)"
  286. size="mini"
  287. type="text"
  288. icon="el-icon-delete"
  289. @click="onDel(r.row.id, r.row.planName)"
  290. v-hasPermi="['core:checkplan:remove']"
  291. >删除</el-button
  292. >
  293. <el-button
  294. size="mini"
  295. type="text"
  296. icon="el-icon-arrow-down"
  297. v-if="checkCanPublish(r.row)"
  298. @click="showDialogDistribute(r.row)"
  299. v-hasPermi="['core:checkplan:distribute']"
  300. >下发</el-button
  301. >
  302. <el-button
  303. size="mini"
  304. type="text"
  305. icon="el-icon-arrow-down"
  306. v-if="newcheckCanPublish(r.row)"
  307. @click="newshowDialogDistribute(r.row)"
  308. v-hasPermi="['core:checkplan:distribute']"
  309. >下发</el-button
  310. >
  311. <el-button
  312. size="mini"
  313. type="text"
  314. icon="el-icon-top-left"
  315. v-if="chehui(r.row)"
  316. @click="chhuile(r.row)"
  317. v-hasPermi="['core:checkplan:distribute']"
  318. >撤回</el-button
  319. >
  320. </template>
  321. </el-table-column>
  322. </el-table>
  323. <pagination
  324. v-show="total > 0"
  325. :total="total"
  326. :page.sync="queryParams.pageNum"
  327. :limit.sync="queryParams.pageSize"
  328. @pagination="getList"
  329. />
  330. </el-col>
  331. </el-row>
  332. <dialog-edit
  333. ref="editDialog"
  334. @success="getList()"
  335. :orgTypeOptions="dict.type.sys_org_type"
  336. :ruleTypeOptions="dict.type.rule_type"
  337. ></dialog-edit>
  338. <DialogDistribute ref="dialogDistribute" @select="sel"></DialogDistribute>
  339. </div>
  340. </template>
  341. <script>
  342. import DialogDistribute from "./distribute.vue";
  343. import OrgTree from "@/components/orgTree";
  344. import { mapState, mapMutations, mapGetters } from "vuex";
  345. import DialogEdit from "./dialog.edit";
  346. import * as api from "@/api/safetycheck/plan";
  347. import { statusOptions, getLabel } from "@/views/commonOption";
  348. import { listRole } from "@/api/system/role";
  349. export default {
  350. name: "resumptionplan",
  351. dicts: [
  352. "sys_org_type",
  353. "rule_type",
  354. "check_cycle",
  355. "check_status",
  356. "check_type",
  357. ],
  358. components: {
  359. DialogEdit,
  360. OrgTree,
  361. DialogDistribute,
  362. },
  363. data() {
  364. const { params, query } = this.$route;
  365. return {
  366. isShow: false,
  367. loading: false,
  368. ids: [],
  369. // 非单个禁用
  370. single: true,
  371. // 非多个禁用
  372. multiple: true,
  373. // 显示搜索条件
  374. showSearch: true,
  375. resumptionRoles: [],
  376. total: 0,
  377. queryParams: {
  378. id: null,
  379. planName: null,
  380. checkRole: null,
  381. planCycle: null,
  382. planCreateOrgId: null,
  383. checkType: null,
  384. planOfOrgId: null,
  385. execOrgType: null,
  386. checkOrgType: null,
  387. planStatus: null,
  388. pageSize: 10,
  389. pageNum: 1,
  390. checkSub: false,
  391. orgId: null,
  392. ...query,
  393. },
  394. pageData: [],
  395. // 列信息
  396. columns: [
  397. { key: 0, label: `序号`, visible: true },
  398. { key: 1, label: `计划名称`, visible: true },
  399. { key: 2, label: `计划类型`, visible: true },
  400. { key: 3, label: `计划创建机构`, visible: true },
  401. { key: 4, label: `计划所属机构`, visible: true },
  402. { key: 5, label: `履职机构类型`, visible: true },
  403. { key: 6, label: `履职角色`, visible: true },
  404. { key: 7, label: `履职周期`, visible: true },
  405. { key: 8, label: `履职次数`, visible: true },
  406. { key: 9, label: `履职时间`, visible: true },
  407. { key: 10, label: `修改人`, visible: true },
  408. { key: 11, label: `计划状态`, visible: true },
  409. ],
  410. };
  411. },
  412. props: {},
  413. watch: {},
  414. computed: {
  415. ...mapState([]),
  416. ...mapGetters(["orgId", "orgName"]),
  417. },
  418. methods: {
  419. ...mapMutations([]),
  420. //判断是否跟当前用户同机构
  421. eqOrg(row) {
  422. // console.log(row.planOfOrgId,"row.planOfOrgId");
  423. // console.log(this.orgId,"this.orgId");
  424. if (
  425. row != null &&
  426. row != undefined &&
  427. (row.planCreateOrgId == this.orgId ||
  428. (row.planOfOrgType == 3 && row.planOfOrgId == this.orgId))
  429. ) {
  430. return true;
  431. }
  432. return false;
  433. },
  434. eqOrg2(row) {
  435. // console.log(row.planCreateOrgId,"row.planCreateOrgId");
  436. // console.log(this.orgId,"this.orgId");
  437. if (
  438. row != null &&
  439. row != undefined &&
  440. row.planCreateOrgId == this.orgId &&
  441. row.planOfOrgId == this.orgId
  442. ) {
  443. return true;
  444. }
  445. return false;
  446. },
  447. newcheckCanPublish(row) {
  448. //如果计划所属机构类型为行社并且计划不为进行中并且计划创建机构为当前机构或者
  449. //计划状态为停用并且不属于子计划并且计划所属机构类型为省联社
  450. if (
  451. (row.planOfOrgType == 3 &&
  452. row.planStatus != 1 &&
  453. row.planCreateOrgId == this.orgId) ||
  454. (row.planStatus == 2 && row.parentId != -1 && row.planOfOrgType == 1) ||
  455. (row.planStatus != 1 && (row.execOrgType == 1 || row.execOrgType == 2))
  456. ) {
  457. return true;
  458. }
  459. return false;
  460. },
  461. newshowDialogDistribute(row) {
  462. this.$modal
  463. .confirm("是否下发!", "提示")
  464. .then(() => {
  465. // 用户点击了确认按钮
  466. console.log("执行操作...");
  467. this.loading = true;
  468. api
  469. .distributeCheHui(row.id)
  470. .then((response) => {
  471. // console.log(response, "then");
  472. if (response.data == 0) {
  473. this.loading = false;
  474. } else {
  475. this.getList();
  476. this.loading = false;
  477. }
  478. })
  479. .catch((response) => {
  480. // console.log(response, "catch");
  481. this.getList();
  482. this.loading = false;
  483. });
  484. })
  485. .catch(() => {
  486. // 用户点击了取消按钮
  487. console.log("取消操作...");
  488. });
  489. },
  490. //已完成下发的计划不显示下发按钮
  491. checkCanPublish(row) {
  492. // console.log(row.planOfOrgType == "1","row.planOfOrgType")
  493. // console.log(row.planOfOrgType == "1"&& row.distribute==null,"row.distribute")
  494. //如果计划所属机构为省联社并且计划下发状态为0并且计划检查机构类型不为省联社和办事处(只有一个无法下发)
  495. if (
  496. row.planOfOrgType == "1" &&
  497. row.distribute == 0 &&
  498. row.execOrgType != "1" &&
  499. row.execOrgType != "2"
  500. ) {
  501. return true;
  502. }
  503. return false;
  504. },
  505. splitRoleNames(val) {
  506. if (val != null && val != undefined) {
  507. return val.split(",");
  508. } else {
  509. return [];
  510. }
  511. // 使用逗号分割字符串,得到角色名称的数组
  512. },
  513. sel(selectList) {
  514. this.loading = true;
  515. api.distribute(selectList).then((response) => {
  516. this.getList();
  517. this.loading = false;
  518. });
  519. },
  520. getRolesByOrg() {
  521. let params = {
  522. // orgId:this.queryParams.orgId
  523. };
  524. listRole(params).then((res) => {
  525. // console.info(res);
  526. this.resumptionRoles = res.rows;
  527. });
  528. },
  529. getList() {
  530. this.loading = true;
  531. console.info(this.dict.type);
  532. api
  533. .list(this.queryParams)
  534. .then((response) => {
  535. this.pageData = response.rows;
  536. this.total = response.total;
  537. this.loading = false;
  538. })
  539. .catch(() => {
  540. this.loading = false;
  541. });
  542. },
  543. getDefaultKey(key) {
  544. this.queryParams.orgId = key;
  545. this.getList();
  546. },
  547. handleAdd(id, other = {}) {
  548. id = null;
  549. this.$refs.editDialog.show(id, other);
  550. },
  551. onEdit(id, other = {}) {
  552. this.$refs.editDialog.show(id, other);
  553. },
  554. //开始撤回
  555. chhuile(row) {
  556. this.$modal
  557. .confirm("撤回计划会清除本周期所有任务!", "提示")
  558. .then(() => {
  559. // 用户点击了确认按钮
  560. // console.log("执行操作...");
  561. this.loading = true;
  562. api.cheHui(row.id).then((response) => {
  563. this.getList();
  564. this.loading = false;
  565. });
  566. })
  567. .catch(() => {
  568. // 用户点击了取消按钮
  569. // console.log("取消操作...");
  570. });
  571. },
  572. //已下发的显示撤回
  573. chehui(row) {
  574. if (row.distribute == 1 && row.planCreateOrgId == this.orgId) {
  575. return true;
  576. }
  577. return false;
  578. },
  579. showDialogDistribute(row) {
  580. console.log(row, "qqq");
  581. this.$refs.dialogDistribute.show(row);
  582. },
  583. async onDel(id, name) {
  584. this.$modal
  585. .confirm('是否确认删除名称为"' + name + '"的数据项?')
  586. .then(() => {
  587. // 用户点击了确认按钮
  588. // console.log("执行操作...");
  589. this.loading = true;
  590. api
  591. .delelte(id)
  592. .then(() => {
  593. this.getList();
  594. this.loading = false;
  595. this.$modal.msgSuccess("删除成功");
  596. })
  597. .catch(() => {
  598. this.loading = false;
  599. });
  600. })
  601. .catch(() => {
  602. // 用户点击了取消按钮
  603. // console.log("取消操作...");
  604. });
  605. },
  606. // 多选框选中数据
  607. handleSelectionChange(selection) {
  608. this.ids = selection.map((item) => item.userId);
  609. this.single = selection.length != 1;
  610. this.multiple = !selection.length;
  611. },
  612. /** 重置按钮操作 */
  613. resetQuery() {
  614. this.resetForm("search");
  615. // this.queryParams.orgId = undefined;
  616. // this.$refs.tree.setCurrentKey(null);
  617. this.getList();
  618. },
  619. //单选框状态改变
  620. checkChange(state) {
  621. this.queryParams.checkSub = state;
  622. this.getList();
  623. },
  624. // 节点单击事件
  625. clickTreeNode(data) {
  626. this.queryParams.orgId = data.id;
  627. this.getList();
  628. },
  629. getStatusLabel(value) {
  630. return getLabel(statusOptions, value);
  631. },
  632. getLabel(options, value) {
  633. return getLabel(options, value);
  634. },
  635. //apimark//
  636. },
  637. mounted() {},
  638. };
  639. </script>
  640. <style lang="scss" scoped>
  641. .brand {
  642. }
  643. </style>