mp_bjdm_baseInfo.html 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta
  6. name="viewport"
  7. content="width=device-width, initial-scale=1.0, user-scalable=no"
  8. />
  9. <title>基本信息</title>
  10. <script src="/js/mp_base/base.js"></script>
  11. <style>
  12. [v-cloak] {
  13. display: none !important;
  14. }
  15. #app {
  16. background: #f5f5f5;
  17. min-height: 100vh;
  18. padding-top: 8px;
  19. box-sizing: border-box;
  20. }
  21. /* 调整班级点名页加载态为纯转圈 by xu 2026-03-06 */
  22. .loading {
  23. min-height: 40vh;
  24. display: flex;
  25. align-items: center;
  26. justify-content: center;
  27. padding: 32px 16px;
  28. }
  29. .loading-spinner {
  30. width: 30px;
  31. height: 30px;
  32. border: 3px solid #e8f3ed;
  33. border-top-color: #40ac6d;
  34. border-radius: 50%;
  35. animation: page-spin 0.9s linear infinite;
  36. }
  37. @keyframes page-spin {
  38. from {
  39. transform: rotate(0deg);
  40. }
  41. to {
  42. transform: rotate(360deg);
  43. }
  44. }
  45. .error {
  46. text-align: center;
  47. padding: 50px;
  48. color: #ff4d4f;
  49. }
  50. .section-card {
  51. margin: 0 8px 10px;
  52. background: #ffffff;
  53. border-radius: 8px;
  54. overflow: hidden;
  55. }
  56. .form {
  57. width: 100%;
  58. border-collapse: collapse;
  59. }
  60. .form th {
  61. width: 140px;
  62. max-width: 170px;
  63. }
  64. </style>
  65. </head>
  66. <body>
  67. <div id="app" v-cloak>
  68. <!-- 调整班级点名页加载态为纯转圈 by xu 2026-03-06 -->
  69. <div v-if="loading" class="loading">
  70. <div class="loading-spinner"></div>
  71. </div>
  72. <div v-else-if="error" class="error">{{ error }}</div>
  73. <!-- 新增班级点名基本信息回显页 by xu 2026-03-06 -->
  74. <div v-else class="content-div">
  75. <div class="section-card">
  76. <table class="form">
  77. <tr>
  78. <th>班级</th>
  79. <td>{{ displayData.bjmc || formData.bjid || '-' }}</td>
  80. </tr>
  81. <tr>
  82. <th>节时间</th>
  83. <td>{{ displayData.jkssj || '-' }}</td>
  84. </tr>
  85. <tr>
  86. <th>点名时间</th>
  87. <td>{{ displayData.dmsj || '-' }}</td>
  88. </tr>
  89. <tr>
  90. <th>点名人</th>
  91. <td>{{ displayData.dmrymc || formData.dmryid || '-' }}</td>
  92. </tr>
  93. <tr>
  94. <th>旷课人数</th>
  95. <td>{{ displayData.kkrs ?? '-' }}</td>
  96. </tr>
  97. <tr>
  98. <th>请假人数</th>
  99. <td>{{ displayData.qjrs ?? '-' }}</td>
  100. </tr>
  101. </table>
  102. </div>
  103. </div>
  104. </div>
  105. <script>
  106. window.SS.ready(function () {
  107. window.SS.dom.initializeFormApp({
  108. el: "#app",
  109. data() {
  110. return {
  111. pageParams: {},
  112. loading: false,
  113. error: "",
  114. formData: {},
  115. displayData: {
  116. bjmc: "",
  117. jkssj: "",
  118. dmsj: "",
  119. dmrymc: "",
  120. kkrs: "",
  121. qjrs: "",
  122. },
  123. };
  124. },
  125. async mounted() {
  126. this.pageParams = this.getUrlParams();
  127. await this.loadData();
  128. },
  129. methods: {
  130. getUrlParams() {
  131. const params = {};
  132. const urlSearchParams = new URLSearchParams(
  133. window.location.search
  134. );
  135. for (const [key, value] of urlSearchParams) {
  136. params[key] = decodeURIComponent(value);
  137. }
  138. return params;
  139. },
  140. parseParamObject(paramStr) {
  141. if (!paramStr) return {};
  142. try {
  143. return JSON.parse(paramStr);
  144. } catch (err) {
  145. try {
  146. const fixed = paramStr.replace(
  147. /([,{]\s*)([a-zA-Z_][a-zA-Z0-9_]*)\s*:/g,
  148. '$1"$2":'
  149. );
  150. return JSON.parse(fixed);
  151. } catch (err2) {
  152. console.error("解析param失败:", err2);
  153. return {};
  154. }
  155. }
  156. },
  157. async loadData() {
  158. // 加载班级点名详情数据并回显 by xu 2026-03-06
  159. const service = this.pageParams.service;
  160. if (!service) {
  161. this.error = "缺少service参数";
  162. return;
  163. }
  164. this.loading = true;
  165. this.error = "";
  166. try {
  167. const paramObj = this.parseParamObject(this.pageParams.param);
  168. const requestData = {
  169. ...paramObj,
  170. };
  171. const appendIfMissing = (targetKey, sourceKeys) => {
  172. if (
  173. requestData[targetKey] !== undefined &&
  174. requestData[targetKey] !== null &&
  175. requestData[targetKey] !== ""
  176. ) {
  177. return;
  178. }
  179. for (let i = 0; i < sourceKeys.length; i += 1) {
  180. const sourceKey = sourceKeys[i];
  181. const value = this.pageParams[sourceKey];
  182. if (value !== undefined && value !== null && value !== "") {
  183. requestData[targetKey] = value;
  184. return;
  185. }
  186. }
  187. };
  188. appendIfMissing("sqid", ["sqid"]);
  189. appendIfMissing("shid", ["shid"]);
  190. appendIfMissing("ssObjName", ["ssObjName", "ssobjname"]);
  191. appendIfMissing("ssObjId", ["ssObjId", "ssobjid"]);
  192. appendIfMissing("bdlbm", ["bdlbm"]);
  193. appendIfMissing("dataType", ["dataType", "datatype"]);
  194. appendIfMissing("encode_shid", ["encode_shid"]);
  195. appendIfMissing("jdmc", ["jdmc"]);
  196. appendIfMissing("ssToken", ["ssToken"]);
  197. const response = await request.post(
  198. `/service?ssServ=${service}&ssDest=data`,
  199. requestData,
  200. { loading: false, formData: true }
  201. );
  202. const raw = this.pickBjdmData(response?.data);
  203. if (!raw) {
  204. this.error = "未获取到班级点名数据";
  205. return;
  206. }
  207. this.formData = raw;
  208. await this.buildDisplayData(raw);
  209. } catch (error) {
  210. console.error("加载班级点名基本信息失败:", error);
  211. this.error = "加载失败:" + (error.message || "未知错误");
  212. } finally {
  213. this.loading = false;
  214. }
  215. },
  216. pickBjdmData(data) {
  217. if (!data) return null;
  218. if (data.bjdm) return data.bjdm;
  219. if (Array.isArray(data.objectList) && data.objectList.length > 0) {
  220. return data.objectList[0]?.bjdm || data.objectList[0];
  221. }
  222. if (Array.isArray(data.data) && data.data.length > 0) {
  223. return data.data[0]?.bjdm || data.data[0];
  224. }
  225. if (typeof data === "object") return data;
  226. return null;
  227. },
  228. async buildDisplayData(raw) {
  229. // 格式化班级点名显示字段 by xu 2026-03-06
  230. const bjmc = await this.translateDict(
  231. "bj",
  232. raw.bjid,
  233. raw.bjmc || raw.bjname || raw.bjdm_mc
  234. );
  235. const dmrymc = await this.translateDict(
  236. "ry",
  237. raw.dmryid,
  238. raw.dmrymc || raw.dmryname || raw.xm
  239. );
  240. this.displayData = {
  241. bjmc,
  242. jkssj: this.formatDate(raw.jkssj),
  243. dmsj: this.formatDate(raw.dmsj),
  244. dmrymc,
  245. kkrs: raw.kkrs,
  246. qjrs: raw.qjrs,
  247. };
  248. },
  249. formatDate(value) {
  250. if (!value) return "";
  251. if (
  252. window.H5FieldFormatter &&
  253. typeof window.H5FieldFormatter.formatDate === "function"
  254. ) {
  255. return window.H5FieldFormatter.formatDate(
  256. value,
  257. "YYYY-MM-DD HH:mm:ss"
  258. );
  259. }
  260. return value;
  261. },
  262. async translateDict(dictName, value, fallbackName) {
  263. if (fallbackName) return fallbackName;
  264. if (value === undefined || value === null || value === "") {
  265. return "";
  266. }
  267. try {
  268. if (typeof window.getDictOptions === "function") {
  269. const options = await window.getDictOptions(dictName);
  270. const target = (options || []).find(
  271. (item) => String(item.v) === String(value)
  272. );
  273. if (target && target.n) return target.n;
  274. }
  275. } catch (error) {
  276. console.error(`${dictName} 字典翻译失败:`, error);
  277. }
  278. return String(value);
  279. },
  280. },
  281. });
  282. });
  283. </script>
  284. </body>
  285. </html>