mp_stateChgSure.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  6. <title>变动确认</title>
  7. <script src="/js/mp_base/base.js"></script>
  8. <style>
  9. [v-cloak] {
  10. display: none !important;
  11. }
  12. #app {
  13. min-height: 100vh;
  14. background: #f5f5f5;
  15. box-sizing: border-box;
  16. }
  17. .form-wrap {
  18. background: #fff;
  19. }
  20. .table th {
  21. width: 140px;
  22. max-width: 170px;
  23. }
  24. .loading {
  25. min-height: 40vh;
  26. display: flex;
  27. align-items: center;
  28. justify-content: center;
  29. }
  30. .loading-spinner {
  31. width: 30px;
  32. height: 30px;
  33. border: 3px solid #e8f3ed;
  34. border-top-color: #40ac6d;
  35. border-radius: 50%;
  36. animation: page-spin 0.9s linear infinite;
  37. }
  38. @keyframes page-spin {
  39. from { transform: rotate(0deg); }
  40. to { transform: rotate(360deg); }
  41. }
  42. .error-card {
  43. margin: 8px;
  44. padding: 16px;
  45. background: #fff;
  46. border-radius: 8px;
  47. color: #ff4d4f;
  48. line-height: 1.6;
  49. word-break: break-all;
  50. }
  51. </style>
  52. </head>
  53. <body>
  54. <div id="app" v-cloak>
  55. <div v-if="loading" class="loading">
  56. <div class="loading-spinner"></div>
  57. </div>
  58. <div v-else-if="errorMessage" class="error-card">{{ errorMessage }}</div>
  59. <form v-else id="tjform" class="form-wrap" @submit.prevent>
  60. <table class="table">
  61. <tr>
  62. <th>标题</th>
  63. <td>
  64. <!-- 状态变动确认页标题改为普通输入框 by xu 2026-03-07 -->
  65. <ss-input
  66. v-model="formData.mc"
  67. name="mc"
  68. placeholder="请输入标题"
  69. />
  70. </td>
  71. </tr>
  72. <tr>
  73. <th>说明</th>
  74. <td>
  75. <!-- 状态变动确认页说明改为 ms 普通录入,不使用富文本 by xu 2026-03-07 -->
  76. <ss-input
  77. v-model="formData.ms"
  78. name="ms"
  79. placeholder="请输入说明"
  80. />
  81. </td>
  82. </tr>
  83. </table>
  84. </form>
  85. <ss-bottom
  86. v-if="!loading && !errorMessage"
  87. :buttons="bottomButtons"
  88. @button-click="handleBottomAction"
  89. >
  90. </ss-bottom>
  91. </div>
  92. <script>
  93. window.SS.ready(function () {
  94. window.SS.dom.initializeFormApp({
  95. el: '#app',
  96. data() {
  97. return {
  98. pageParams: {},
  99. initPayload: {},
  100. loading: false,
  101. submitting: false,
  102. errorMessage: '',
  103. formData: {
  104. mc: '',
  105. ms: ''
  106. },
  107. bottomButtons: [
  108. { text: '关闭', action: 'close' },
  109. {
  110. text: '提交',
  111. action: 'submit',
  112. backgroundColor: '#575d6d',
  113. color: '#fff'
  114. }
  115. ]
  116. }
  117. },
  118. async mounted() {
  119. this.pageParams = this.getUrlParams()
  120. await this.loadInitData()
  121. },
  122. methods: {
  123. getUrlParams() {
  124. const params = {}
  125. const urlSearchParams = new URLSearchParams(window.location.search)
  126. for (const [key, value] of urlSearchParams) {
  127. params[key] = decodeURIComponent(value)
  128. }
  129. return params
  130. },
  131. parseJsonString(text) {
  132. if (!text || typeof text !== 'string') return {}
  133. try {
  134. const obj = JSON.parse(text)
  135. return obj && typeof obj === 'object' ? obj : {}
  136. } catch (_) {
  137. return {}
  138. }
  139. },
  140. unwrapData(data) {
  141. if (!data || typeof data !== 'object') return {}
  142. if (data.ssData && typeof data.ssData === 'object') return data.ssData
  143. return data
  144. },
  145. getMergedParams() {
  146. const routeParam = this.parseJsonString(this.pageParams.param)
  147. return {
  148. ...routeParam,
  149. ...this.pageParams
  150. }
  151. },
  152. goBack(refreshParent = false) {
  153. if (window.NavigationManager && typeof window.NavigationManager.goBack === 'function') {
  154. window.NavigationManager.goBack({ refreshParent })
  155. } else {
  156. window.history.back()
  157. }
  158. },
  159. // 功能说明:状态变动确认页先调当前 service 补齐标题、对象参数和提交服务 by xu 2026-03-07
  160. async loadInitData() {
  161. const params = this.getMergedParams()
  162. const serviceName = String(params.service || params.ssServ || '').trim()
  163. const presetTitle = String(params.applicationName || params.mc || '').trim()
  164. const presetDesc = String(params.sqmswj || params.sqms || params.ms || '').trim()
  165. this.formData.mc = presetTitle
  166. this.formData.ms = presetDesc
  167. if (!serviceName) {
  168. this.initPayload = {}
  169. return
  170. }
  171. this.loading = true
  172. this.errorMessage = ''
  173. try {
  174. const response = await request.post(
  175. `/service?ssServ=${encodeURIComponent(serviceName)}`,
  176. params,
  177. { loading: false, formData: true }
  178. )
  179. const payload = this.unwrapData(response && response.data)
  180. this.initPayload = payload
  181. if (!this.formData.mc) {
  182. this.formData.mc = String(payload.applicationName || payload.mc || '')
  183. }
  184. if (!this.formData.ms) {
  185. this.formData.ms = String(payload.sqmswj || payload.sqms || payload.ms || '')
  186. }
  187. } catch (error) {
  188. console.error('[mp_stateChgSure] 初始化失败', error)
  189. this.errorMessage = '初始化失败,请稍后重试'
  190. } finally {
  191. this.loading = false
  192. }
  193. },
  194. validateForm() {
  195. if (!String(this.formData.mc || '').trim()) return '请输入标题'
  196. return ''
  197. },
  198. getSubmitConfig() {
  199. const params = this.getMergedParams()
  200. const payload = this.initPayload || {}
  201. return {
  202. serviceName: String(payload.sureChgServName || params.sureChgServName || params.service || params.ssServ || '').trim(),
  203. dest: 'info',
  204. ssObjName: String(payload.ssObjName || params.ssObjName || '').trim(),
  205. ssObjIdName: String(payload.ssObjIdName || params.ssObjIdName || 'ssObjId').trim(),
  206. ssObjId: String(payload.ssObjId || params.ssObjId || '').trim(),
  207. ssPobjName: String(payload.ssPobjName || params.ssPobjName || '').trim(),
  208. }
  209. },
  210. // 功能说明:状态变动确认页按 JSP tjform 提交 mc、ms、mswj 到 sureChgServName by xu 2026-03-07
  211. async submitForm() {
  212. if (this.submitting) return
  213. const message = this.validateForm()
  214. if (message) {
  215. if (typeof showToastEffect === 'function') showToastEffect(message, 1800, 'warning')
  216. return
  217. }
  218. const cfg = this.getSubmitConfig()
  219. if (!cfg.serviceName) {
  220. if (typeof showToastEffect === 'function') showToastEffect('缺少提交服务,无法提交', 2200, 'error')
  221. return
  222. }
  223. if (!cfg.ssObjName || !cfg.ssObjId) {
  224. if (typeof showToastEffect === 'function') showToastEffect('缺少对象参数,无法提交', 2200, 'error')
  225. return
  226. }
  227. this.submitting = true
  228. try {
  229. const submitPayload = {
  230. ssObjName: cfg.ssObjName,
  231. ssPobjName: cfg.ssPobjName,
  232. mc: String(this.formData.mc || '').trim(),
  233. ms: String(this.formData.ms || '').trim(),
  234. mswj: String(this.formData.ms || '').trim(),
  235. [cfg.ssObjIdName]: cfg.ssObjId,
  236. }
  237. const response = await request.post(
  238. `/service?ssServ=${encodeURIComponent(cfg.serviceName)}&ssDest=${encodeURIComponent(cfg.dest)}`,
  239. submitPayload,
  240. { loading: true, formData: true }
  241. )
  242. console.log('[mp_stateChgSure] 提交响应', response)
  243. if (typeof showToastEffect === 'function') {
  244. showToastEffect('提交成功', 1500, 'success')
  245. }
  246. setTimeout(() => this.goBack(true), 600)
  247. } catch (error) {
  248. console.error('[mp_stateChgSure] 提交失败', error)
  249. if (typeof showToastEffect === 'function') {
  250. showToastEffect('提交失败,请稍后重试', 2200, 'error')
  251. }
  252. } finally {
  253. this.submitting = false
  254. }
  255. },
  256. handleBottomAction(payload) {
  257. if (!payload || !payload.action) return
  258. if (payload.action === 'close') {
  259. this.goBack(false)
  260. return
  261. }
  262. if (payload.action === 'submit') {
  263. this.submitForm()
  264. }
  265. }
  266. }
  267. })
  268. })
  269. </script>
  270. </body>
  271. </html>