yinhuanform_aqglsh_yq_wys.vue 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599
  1. <template>
  2. <div>
  3. <!-- <div v-if="shows">
  4. <van-nav-bar title="风险评级" left-arrow @click-left="onClickLeft" />
  5. </div> -->
  6. <div class="headers">
  7. <div>
  8. <van-field
  9. v-model="value10"
  10. name="检查人部门"
  11. label="检查人部门"
  12. placeholder="检查人部门"
  13. readonly="false"
  14. />
  15. </div>
  16. <div>
  17. <van-field
  18. v-model="value12"
  19. name="检查人"
  20. label="检查人"
  21. placeholder="检查人"
  22. readonly="false"
  23. />
  24. </div>
  25. <div>
  26. <van-field
  27. v-model="value1"
  28. name="检查专业"
  29. label="检查专业"
  30. placeholder="检查专业"
  31. :rules="[{ required: true, message: '请选择' }]"
  32. readonly="false"
  33. />
  34. </div>
  35. <div>
  36. <van-field
  37. v-model="value2"
  38. name="隐患等级"
  39. label="隐患等级"
  40. placeholder="隐患等级"
  41. :rules="[{ required: true, message: '请选择' }]"
  42. readonly="false"
  43. />
  44. </div>
  45. <div>
  46. <van-cell-group>
  47. <van-field
  48. v-model="message1"
  49. rows="1"
  50. autosize
  51. label="存在问题或隐患"
  52. type="textarea"
  53. placeholder="请输入信息"
  54. readonly="false"
  55. />
  56. <van-field
  57. v-model="message2"
  58. rows="1"
  59. autosize
  60. label="整改措施"
  61. type="textarea"
  62. placeholder="请输入信息"
  63. readonly="false"
  64. />
  65. </van-cell-group>
  66. </div>
  67. </div>
  68. <div class="contents">
  69. <div>
  70. <van-field
  71. v-model="value3"
  72. name="风险点"
  73. label="风险点"
  74. placeholder="风险点"
  75. :rules="[{ required: true, message: '请选择' }]"
  76. readonly="false"
  77. />
  78. </div>
  79. <div>
  80. <van-field
  81. v-model="value4"
  82. name="风险类型"
  83. label="风险类型"
  84. placeholder="风险类型"
  85. :rules="[{ required: true, message: '请选择' }]"
  86. readonly="false"
  87. />
  88. </div>
  89. <div>
  90. <van-field
  91. v-model="value5"
  92. name="风险等级"
  93. label="风险等级"
  94. placeholder="风险等级"
  95. :rules="[{ required: true, message: '请选择' }]"
  96. readonly="false"
  97. />
  98. </div>
  99. <div>
  100. <van-field
  101. v-model="value6"
  102. name="事故类型"
  103. label="事故类型"
  104. placeholder="事故类型"
  105. :rules="[{ required: true, message: '请选择' }]"
  106. readonly="false"
  107. />
  108. </div>
  109. <div>
  110. <van-cell-group>
  111. <van-field
  112. v-model="message3"
  113. rows="1"
  114. autosize
  115. label="风险描述"
  116. type="textarea"
  117. placeholder="请输入信息"
  118. readonly="false"
  119. />
  120. <van-field
  121. v-model="message4"
  122. rows="1"
  123. autosize
  124. label="后果及影响"
  125. type="textarea"
  126. placeholder="请输入信息"
  127. readonly="false"
  128. />
  129. <van-field
  130. v-model="message5"
  131. rows="1"
  132. autosize
  133. label="管控措施"
  134. type="textarea"
  135. placeholder="请输入信息"
  136. readonly="false"
  137. />
  138. </van-cell-group>
  139. </div>
  140. <!-- <div>
  141. <el-table
  142. ref="multipleTable"
  143. :data="tableData"
  144. tooltip-effect="dark"
  145. style="width: 100%"
  146. @selection-change="handleSelectionChange"
  147. >
  148. <el-table-column type="selection" width="45"> </el-table-column>
  149. <el-table-column label="日期" width="90">
  150. <template slot-scope="scope">{{ scope.row.date }}</template>
  151. </el-table-column>
  152. <el-table-column prop="name" label="姓名" width="120">
  153. </el-table-column>
  154. <el-table-column prop="address" label="地址" show-overflow-tooltip>
  155. </el-table-column>
  156. </el-table>
  157. </div> -->
  158. </div>
  159. <div class="contents1">
  160. <div>
  161. <van-cell-group>
  162. <van-field
  163. v-model="message6"
  164. rows="1"
  165. autosize
  166. label="整改责任单位"
  167. type="textarea"
  168. placeholder="请输入信息"
  169. readonly="false"
  170. />
  171. <van-field
  172. v-model="message7"
  173. rows="1"
  174. autosize
  175. label="整改责任人"
  176. type="textarea"
  177. placeholder="请输入信息"
  178. readonly="false"
  179. />
  180. </van-cell-group>
  181. </div>
  182. <div>
  183. <van-field
  184. v-model="value7"
  185. name="督办部门"
  186. label="督办部门"
  187. placeholder="督办部门"
  188. :rules="[{ required: true, message: '请选择' }]"
  189. readonly="false"
  190. />
  191. </div>
  192. <div>
  193. <van-field
  194. v-model="value8"
  195. name="督办责任人"
  196. label="督办责任人"
  197. placeholder="督办责任人"
  198. :rules="[{ required: true, message: '请选择' }]"
  199. readonly="false"
  200. />
  201. </div>
  202. <div>
  203. <van-field
  204. v-model="value11"
  205. name="整改类型"
  206. label="整改类型"
  207. placeholder="整改类型"
  208. readonly="false"
  209. />
  210. </div>
  211. <div>
  212. <van-field
  213. v-model="value9"
  214. name="整改期限"
  215. label="整改期限"
  216. placeholder="整改期限"
  217. readonly="false"
  218. />
  219. </div>
  220. </div>
  221. <div class="contents2">
  222. <div>
  223. <van-cell-group>
  224. <van-field
  225. v-model="message8"
  226. rows="1"
  227. autosize
  228. label="整改状态"
  229. type="textarea"
  230. placeholder="请输入信息"
  231. readonly="false"
  232. />
  233. </van-cell-group>
  234. </div>
  235. </div>
  236. <div class="contents3">
  237. <van-field
  238. v-model="value_dubanren"
  239. name="选择督办人"
  240. label="选择督办人"
  241. placeholder="请重新选择督办人"
  242. @click="open_overlay()"
  243. />
  244. </div>
  245. <!-- 遮罩层 -->
  246. <van-overlay :show="show" class="overlay" style="z-index: 999">
  247. <van-tree-select
  248. :items="items"
  249. :active-id.sync="activeIds"
  250. :main-active-index.sync="activeIndex"
  251. height="92%"
  252. @click-item="right_click"
  253. />
  254. <div class="buttons">
  255. <button @click="overlay_click()">确认</button>
  256. </div>
  257. </van-overlay>
  258. <div class="buttons">
  259. <button @click="tijiao()">提及督办</button>
  260. </div>
  261. </div>
  262. </template>
  263. <script>
  264. import { getAllUrlParams } from "../../../plugins/url-encapsulation.js";
  265. export default {
  266. data() {
  267. return {
  268. shows: true,
  269. value1: "", //检查专业
  270. value2: "", //隐患等级
  271. message1: "", //存在问题或隐患
  272. message2: "", //整改措施
  273. value3: "", //风险点
  274. value4: "", //风险类型
  275. value5: "", //风险等级
  276. value6: "", //事故类型
  277. message3: "", //风险描述
  278. message4: "", //后果及影响
  279. message5: "", //管控措施
  280. message6: "", //整改责任单位
  281. message7: "", //整改责任人
  282. value7: "", //督办部门
  283. value8: "", //督办责任人
  284. value9: "", //整改期限
  285. message8: "", //整改意见
  286. message9: "", //验收意见
  287. message10: "", //验收日期
  288. message11: "", //验收部门
  289. message12: "", //验收责任人
  290. message13: "", //验收结果
  291. fileList: [],
  292. infos: [],
  293. // 检查人部门
  294. value10: "",
  295. // 整改类型
  296. value11: "",
  297. // 检查人
  298. value12: "",
  299. // 详情id
  300. id: "",
  301. // 详情数据
  302. detail: {},
  303. // 提及督办
  304. show: false,
  305. value_dubanren: "",
  306. items: [],
  307. activeIds: [],
  308. activeIndex: 0,
  309. staffArr: [],
  310. // 新督办人
  311. staffArr_id: "",
  312. };
  313. },
  314. methods: {
  315. //返回按钮
  316. onClickLeft() {
  317. window.history.back();
  318. // console.log("sss");
  319. },
  320. // 获取详情
  321. getTroubleshootDetail(id) {
  322. this.$toast.loading();
  323. this.$http
  324. .post(
  325. "http://meihuajing.nxjiewei.com:8011/api/troubleshoot/getTroubleshootDetail",
  326. {
  327. id: id,
  328. }
  329. )
  330. .then((res) => {
  331. this.$toast.clear();
  332. console.log(res.data.data);
  333. this.detail = res.data.data;
  334. const data = res.data.data;
  335. this.value10 = data.inspected_unit;
  336. this.value1 = data.inspection_specialty;
  337. this.value2 = data.hidden_danger_level;
  338. this.message1 = data.hidden_danger;
  339. this.message2 = data.rectification_measures;
  340. this.value3 = data.risk_rating.risk_point;
  341. this.value4 = data.risk_rating.risk_type;
  342. this.value5 = data.risk_rating.risk_level;
  343. this.value6 = data.risk_rating.accident_type;
  344. this.message3 = data.risk_rating.risk_description;
  345. this.message4 = data.risk_rating.consequences_and_impact;
  346. this.message5 = data.risk_rating.control_measures;
  347. this.message6 = data.rectification_duty_unit;
  348. this.message7 = data.rectification_duty_person;
  349. this.value7 = data.supervision_department;
  350. this.value8 = data.supervision_duty_person;
  351. this.value11 = data.rectification_type;
  352. this.value9 = data.rectification_term;
  353. this.value12 = data.inspected_person;
  354. this.message8 = "逾期未整改";
  355. this.message9 = data.check_accept_opinion;
  356. this.message10 = data.check_accept_date;
  357. this.message11 = data.check_accept_department;
  358. this.message12 = data.check_accept_duty_person;
  359. this.message13 = "未通过";
  360. });
  361. },
  362. // 选择督办
  363. // 获取部门、人
  364. getSectionStaff() {
  365. this.$http
  366. .post(
  367. "http://meihuajing.nxjiewei.com:8011/api/section/getSectionStaff",
  368. {}
  369. )
  370. .then((res) => {
  371. // console.log(res.data.data);
  372. this.options = res.data.data;
  373. this.items = res.data.data;
  374. this.items.map((item, index) => {
  375. // console.log(item.children.map(v=>{return {id: v.value ,text:v.text}}))
  376. item.children = item.children.map((v) => {
  377. return { id: v.value, text: v.text };
  378. });
  379. });
  380. });
  381. },
  382. open_overlay() {
  383. this.show = true;
  384. this.value_dubanren = "";
  385. },
  386. overlay_click() {
  387. this.show = false;
  388. this.activeIds.map((item, index) => {
  389. // console.log(item);
  390. let activeIds_item = item;
  391. this.staffArr.map((item, index) => {
  392. // console.log(activeIds_item);
  393. // console.log(item.id);
  394. if (activeIds_item == item.id) {
  395. // console.log(item.name);
  396. this.value_dubanren += item.name + " , ";
  397. }
  398. });
  399. });
  400. console.log(this.activeIds);
  401. this.staffArr_id = " ";
  402. this.activeIds.map((item, index) => {
  403. this.staffArr_id += item + ",";
  404. });
  405. this.staffArr_id = this.staffArr_id.substring(
  406. 0,
  407. this.staffArr_id.lastIndexOf(",")
  408. );
  409. console.log(this.staffArr_id);
  410. },
  411. right_click(e) {},
  412. // 获取部门 和 责任人数据
  413. getStaffAndSectionData() {
  414. this.$http
  415. .post(
  416. "http://meihuajing.nxjiewei.com:8011/api/troubleshoot/getStaffAndSectionData",
  417. {}
  418. )
  419. .then((res) => {
  420. this.staffArr = res.data.data.staffArr;
  421. });
  422. },
  423. tijiao() {
  424. console.log(this.staffArr_id);
  425. if (this.staffArr_id == "") {
  426. this.$toast("请重新选择督办人");
  427. return;
  428. }
  429. this.$toast.loading();
  430. this.$http
  431. .post(
  432. "http://meihuajing.nxjiewei.com:8011/api/troubleshoot/updateTroubleshoot",
  433. {
  434. id: this.id,
  435. type: 6,
  436. // 督办责任人
  437. supervision_duty_person: this.staffArr_id,
  438. }
  439. )
  440. .then((res) => {
  441. this.$toast.clear();
  442. console.log(res.data);
  443. window.history.back();
  444. });
  445. },
  446. },
  447. mounted() {
  448. document.body.style.backgroundColor = "#f0f0f0"; //背景色
  449. this.id = getAllUrlParams(window.location.href).id;
  450. this.getTroubleshootDetail(this.id);
  451. this.getSectionStaff();
  452. this.getStaffAndSectionData();
  453. },
  454. };
  455. </script>
  456. <style scoped>
  457. >>> .van-nav-bar {
  458. background: #39f;
  459. }
  460. >>> .van-nav-bar__title {
  461. color: #fff;
  462. }
  463. >>> .van-nav-bar .van-icon {
  464. color: #fff;
  465. }
  466. >>> .van-nav-bar__text {
  467. color: #fff;
  468. }
  469. [class*="van-hairline"]:after {
  470. border: none;
  471. }
  472. .headers {
  473. width: 100%;
  474. background: #fff;
  475. }
  476. .contents,
  477. .contents1,
  478. .contents2,
  479. .contents3 {
  480. width: 100%;
  481. background: #fff;
  482. margin-top: 10px;
  483. }
  484. .buttons {
  485. width: 100%;
  486. text-align: center;
  487. }
  488. .buttons > .buttons_one {
  489. border: none;
  490. background: #4dc100;
  491. font-size: 14px;
  492. width: 100px;
  493. height: 40px;
  494. line-height: 40px;
  495. color: #fff;
  496. border-radius: 20px;
  497. margin: 15px 20px;
  498. }
  499. .buttons > .buttons_two {
  500. border: none;
  501. background: #c00201;
  502. font-size: 14px;
  503. width: 100px;
  504. height: 40px;
  505. line-height: 40px;
  506. color: #fff;
  507. border-radius: 20px;
  508. margin: 15px 20px;
  509. }
  510. .contents2_img {
  511. display: flex;
  512. }
  513. .contents2_img > p {
  514. font-size: 14px;
  515. margin-left: 16px;
  516. color: #646566;
  517. }
  518. .contents2_img > div {
  519. margin-left: 40px;
  520. }
  521. .buttons {
  522. width: 110px;
  523. height: 40px;
  524. background: #39f;
  525. margin: 10px auto;
  526. text-align: center;
  527. line-height: 40px;
  528. border-radius: 20px;
  529. }
  530. .buttons > button {
  531. border: none;
  532. color: #fff;
  533. background: #39f;
  534. }
  535. .overlay {
  536. box-sizing: border-box;
  537. padding: 25px;
  538. }
  539. </style>