appealDetail.vue 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288
  1. <template>
  2. <div>
  3. <Head :headText="headText"></Head>
  4. <div class="nav-right">
  5. <el-button type="info" plain size="mini" @click="back">返回</el-button>
  6. <el-button type="primary" @click="submission" size="mini">提交</el-button>
  7. </div>
  8. <div class="detailContainer">
  9. <div class="title Micbold">未执行申诉单</div>
  10. <div class="nav MicrYaHei">
  11. <span>项目名称:{{localName}}</span>
  12. <span>申请人:{{ applyUser||'--'}}</span>
  13. <span>申请时间:{{dateNow||'--'}}</span>
  14. </div>
  15. <div
  16. class="cont1 MicrYaHei"
  17. >申诉未执行指令:{{formatterStr(detailObj.recommend.date)}} {{formatterStr1(detailObj.recommend.time)}} {{detailObj.title||'--'}}</div>
  18. <div class="cont2">
  19. <audit-table :tableList="tableList"></audit-table>
  20. </div>
  21. <div class="cont3">
  22. <span class="Micbold">策略评价</span>
  23. <span
  24. class="MicrYaHei"
  25. >{{detailObj.recommend.evaluateStrategy||detailObj.recommend.remarks||'--'}}</span>
  26. </div>
  27. <div class="cont4">
  28. <span class="Micbold">申请原因</span>
  29. <span>
  30. <el-select size="mini" v-model="detailObj.reasonType" placeholder="请选择">
  31. <el-option
  32. v-for="item in options"
  33. :key="item.value"
  34. :label="item.label"
  35. :value="item.value"
  36. ></el-option>
  37. </el-select>
  38. </span>
  39. <span>
  40. <textarea placeholder="填写申请原因" v-model="detailObj.reason"></textarea>
  41. </span>
  42. </div>
  43. <div class="foot">
  44. <upload-img :souseArr="detailObj.pics"></upload-img>
  45. </div>
  46. </div>
  47. </div>
  48. </template>
  49. <script>
  50. var moment = require("moment");
  51. import "moment/locale/zh-cn";
  52. import Head from "../main/index";
  53. import AuditTable from "../audit/auditTable";
  54. import UploadImg from "../../components/uploadImg";
  55. import {
  56. queryWorkflow,
  57. querySimpleInfo,
  58. queryChillerExecuteInfo
  59. } from "@/api/appeal/appeal.js";
  60. import { updateWorkflow } from "@/api/audit/audit.js";
  61. // import { } from "@/api/appeal/appeal.js";
  62. export default {
  63. data() {
  64. return {
  65. headText: "申诉审核",
  66. reason: "",
  67. options: [
  68. {
  69. value: "0",
  70. label: "策略原因"
  71. },
  72. {
  73. value: "1",
  74. label: "设备原因"
  75. },
  76. {
  77. value: "2",
  78. label: "其他"
  79. }
  80. ],
  81. value: "",
  82. detailObj: {},
  83. souseArr: ["1576036336333_image.jpg", "1576036135588_image.jpg"],
  84. appealId: "",
  85. commandId: "",
  86. tableList: [],
  87. dateNow: "",
  88. applyUser: "",
  89. localName: ""
  90. };
  91. },
  92. components: {
  93. Head,
  94. AuditTable,
  95. UploadImg
  96. },
  97. methods: {
  98. formatterStr(str) {
  99. if (str) {
  100. return (
  101. str.substring(0, 4) +
  102. "." +
  103. str.substring(4, 6) +
  104. "." +
  105. str.substring(6, 8)
  106. );
  107. }
  108. },
  109. formatterStr1(str) {
  110. if (str) {
  111. return str.substring(0, 2) + ":" + str.substring(2, 4);
  112. }
  113. },
  114. quertName(id) {
  115. querySimpleInfo(id, {}).then(res => {
  116. this.applyUser = res.realname;
  117. });
  118. },
  119. back() {
  120. this.$router.push("/appeal");
  121. },
  122. queryDetail(commandId) {
  123. let params = {
  124. postParams: {
  125. criteria: {
  126. id: commandId
  127. }
  128. }
  129. };
  130. queryChillerExecuteInfo(params).then(res => {
  131. const list = res.data || [{}, {}, {}];
  132. this.tableList = Object.values(list[0]).map(i => i || {});
  133. this.tableList[0].title = "当前运行状态";
  134. this.tableList[1].title = "推送策略";
  135. this.tableList[2].title = "执行策略";
  136. });
  137. },
  138. submission() {
  139. let params = {
  140. postParams: {
  141. id: this.detailObj.id,
  142. commit: "apply",
  143. updateUser: this.detailObj.applyUser, //申请人
  144. applyUser: this.detailObj.applyUser, //申请人
  145. judgement:
  146. this.detailObj.recommend.evaluateStrategy ||
  147. this.detailObj.recommend.remarks ||
  148. "", //策略评价
  149. reasonType: this.detailObj.reasonType, //申诉原因类型:策略原因;设备原因;其他
  150. reason: this.reason, //具体申诉原因
  151. pics: this.souseArr
  152. }
  153. };
  154. updateWorkflow(params).then(res => {
  155. if (res.result == "success") {
  156. this.$message.success("申诉成功");
  157. } else {
  158. this.$message.error("申诉失败: " + res.message);
  159. }
  160. this.$router.push("/appeal");
  161. });
  162. }
  163. },
  164. mounted() {
  165. this.detailObj = JSON.parse(this.$route.query.item);
  166. this.dateNow = moment()
  167. .locale("zh-cn")
  168. .format("YYYY.MM.DD");
  169. if (Object.keys(this.detailObj).length > 0) {
  170. console.log(this.detailObj);
  171. this.quertName(this.detailObj.applyUser);
  172. let projects = this.$store.state.projects.projects;
  173. projects.forEach(el => {
  174. if (this.detailObj.projectId == el.id) {
  175. this.localName = el.localName;
  176. }
  177. });
  178. }
  179. }
  180. };
  181. </script>
  182. <style lang="scss" scoped>
  183. .nav-right {
  184. height: 48px;
  185. position: fixed;
  186. right: 24px;
  187. top: 53px;
  188. z-index: 1;
  189. display: flex;
  190. align-items: center;
  191. }
  192. .detailContainer {
  193. max-width: 762px;
  194. width: 60%;
  195. margin: 0 auto;
  196. padding-top: 36px;
  197. padding-bottom: 24px;
  198. .title {
  199. height: 32px;
  200. font-size: 24px;
  201. color: rgba(31, 36, 41, 1);
  202. line-height: 32px;
  203. text-align: center;
  204. }
  205. .nav {
  206. display: flex;
  207. justify-content: space-between;
  208. margin-top: 40px;
  209. margin-bottom: 12px;
  210. span {
  211. height: 22px;
  212. font-size: 14px;
  213. color: rgba(31, 36, 41, 1);
  214. line-height: 19px;
  215. }
  216. }
  217. .cont1 {
  218. height: 22px;
  219. font-size: 14px;
  220. color: rgba(31, 36, 41, 1);
  221. line-height: 19px;
  222. margin-bottom: 16px;
  223. }
  224. .cont2 {
  225. margin-bottom: 24px;
  226. height: 180px;
  227. }
  228. .cont3 {
  229. margin-bottom: 24px;
  230. span {
  231. display: block;
  232. }
  233. span:nth-of-type(1) {
  234. height: 24px;
  235. font-size: 16px;
  236. color: rgba(31, 36, 41, 1);
  237. line-height: 21px;
  238. margin-bottom: 8px;
  239. }
  240. span:nth-of-type(2) {
  241. height: 22px;
  242. font-size: 14px;
  243. color: rgba(100, 108, 115, 1);
  244. line-height: 19px;
  245. }
  246. }
  247. .cont4 {
  248. margin-bottom: 8px;
  249. span {
  250. display: block;
  251. }
  252. span:nth-of-type(1) {
  253. height: 24px;
  254. font-size: 16px;
  255. color: rgba(31, 36, 41, 1);
  256. line-height: 21px;
  257. }
  258. span:nth-of-type(2) {
  259. margin: 8px 0;
  260. }
  261. span:nth-of-type(3) {
  262. textarea {
  263. width: 100%;
  264. // max-width: 762px;
  265. height: 64px;
  266. border-radius: 4px;
  267. border: 1px solid rgba(195, 199, 203, 1);
  268. color: rgba(195, 199, 203, 1);
  269. }
  270. }
  271. }
  272. .foot {
  273. // width: 112px;
  274. // height: 112px;
  275. // background: rgba(248, 249, 250, 1);
  276. // border: 1px solid red;
  277. }
  278. }
  279. </style>
  280. <style lang="scss">
  281. .detailContainer {
  282. .el-input--mini .el-input__inner {
  283. height: 32px;
  284. border: 1px solid rgba(195, 199, 203, 1);
  285. }
  286. }
  287. </style>