Xurh
/
ss_dc_wechat_mini_program_h5


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300
							<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
    <title>基本信息</title>
    <script src="/js/mp_base/base.js"></script>

    <style>
      [v-cloak] {
        display: none !important;
      }

      #app {
        background: #f5f5f5;
        min-height: 100vh;
        padding-top: 8px;
        box-sizing: border-box;
      }

      /* 新增考勤记录基本信息页纯转圈加载态 by xu 2026-03-06 */
      .loading {
        min-height: 40vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 32px 16px;
      }

      .loading-spinner {
        width: 30px;
        height: 30px;
        border: 3px solid #e8f3ed;
        border-top-color: #40ac6d;
        border-radius: 50%;
        animation: page-spin 0.9s linear infinite;
      }

      @keyframes page-spin {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
      }

      .error {
        text-align: center;
        padding: 50px;
        color: #ff4d4f;
      }

      .section-card {
        margin: 0 8px 10px;
        background: #ffffff;
        border-radius: 8px;
        overflow: hidden;
      }

      .form {
        width: 100%;
        border-collapse: collapse;
      }

      .form th {
        width: 140px;
        max-width: 170px;
      }

      .desc-text {
        white-space: pre-wrap;
        line-height: 1.6;
      }
    </style>
  </head>
  <body>
    <div id="app" v-cloak>
      <!-- 新增考勤记录基本信息页纯转圈加载态 by xu 2026-03-06 -->
      <div v-if="loading" class="loading">
        <div class="loading-spinner"></div>
      </div>
      <div v-else-if="error" class="error">{{ error }}</div>
      <!-- 新增考勤记录基本信息回显页 by xu 2026-03-06 -->
      <div v-else class="content-div">
        <div class="section-card">
          <table class="form">
            <tr>
              <th>名称</th>
              <td>{{ displayData.mc || formData.mc || '-' }}</td>
            </tr>
            <tr>
              <th>人员</th>
              <td>{{ displayData.rymc || formData.ryid || '-' }}</td>
            </tr>
            <tr>
              <th>开始时间</th>
              <td>{{ displayData.kssj || '-' }}</td>
            </tr>
            <tr>
              <th>结束时间</th>
              <td>{{ displayData.jssj || '-' }}</td>
            </tr>
            <tr>
              <th>考勤类别</th>
              <td>{{ displayData.kqlb || formData.kqlbm || '-' }}</td>
            </tr>
            <tr>
              <th>班级</th>
              <td>{{ displayData.bjmc || formData.bjid || '-' }}</td>
            </tr>
            <tr>
              <th>描述</th>
              <td class="desc-text">{{ displayData.ms || formData.ms || formData.mswj || '-' }}</td>
            </tr>
          </table>
        </div>
      </div>
    </div>

    <script>
      window.SS.ready(function () {
        window.SS.dom.initializeFormApp({
          el: "#app",
          data() {
            return {
              pageParams: {},
              loading: false,
              error: "",
              formData: {},
              displayData: {
                mc: "",
                rymc: "",
                kssj: "",
                jssj: "",
                kqlb: "",
                bjmc: "",
                ms: "",
              },
            };
          },
          async mounted() {
            this.pageParams = this.getUrlParams();
            await this.loadData();
          },
          methods: {
            getUrlParams() {
              const params = {};
              const urlSearchParams = new URLSearchParams(window.location.search);
              for (const [key, value] of urlSearchParams) {
                try {
                  params[key] = decodeURIComponent(value);
                } catch (_) {
                  params[key] = String(value);
                }
              }
              return params;
            },

            parseParamObject(paramStr) {
              if (!paramStr) return {};
              if (typeof paramStr === 'object') return paramStr;
              try {
                return JSON.parse(paramStr);
              } catch (_) {
                try {
                  const fixed = String(paramStr)
                    .replace(/([{,]\s*)([A-Za-z0-9_]+)\s*:/g, '$1"$2":')
                    .replace(/'/g, '"');
                  return JSON.parse(fixed);
                } catch (error) {
                  console.error('解析param失败:', error);
                  return {};
                }
              }
            },

            async loadData() {
              // 加载考勤记录详情数据并回显 by xu 2026-03-06
              const service = String(this.pageParams.service || this.pageParams.ssServ || '').trim();
              if (!service) {
                this.error = '缺少service参数';
                return;
              }

              this.loading = true;
              this.error = '';

              try {
                const requestData = {
                  ...this.parseParamObject(this.pageParams.param),
                };
                const appendIfMissing = (targetKey, sourceKeys) => {
                  if (
                    requestData[targetKey] !== undefined &&
                    requestData[targetKey] !== null &&
                    requestData[targetKey] !== ''
                  ) {
                    return;
                  }
                  for (let i = 0; i < sourceKeys.length; i += 1) {
                    const value = this.pageParams[sourceKeys[i]];
                    if (value !== undefined && value !== null && value !== '') {
                      requestData[targetKey] = value;
                      return;
                    }
                  }
                };

                appendIfMissing('sqid', ['sqid']);
                appendIfMissing('shid', ['shid']);
                appendIfMissing('ssObjName', ['ssObjName', 'ssobjname']);
                appendIfMissing('ssObjId', ['ssObjId', 'ssobjid']);
                appendIfMissing('bdlbm', ['bdlbm']);
                appendIfMissing('dataType', ['dataType', 'datatype']);
                appendIfMissing('encode_shid', ['encode_shid']);
                appendIfMissing('jdmc', ['jdmc']);
                appendIfMissing('ssToken', ['ssToken']);

                const response = await request.post(
                  `/service?ssServ=${service}&ssDest=data`,
                  requestData,
                  { loading: false, formData: true }
                );

                const raw = this.pickKqjlData(response && response.data ? response.data : response);
                if (!raw) {
                  this.error = '未获取到考勤记录数据';
                  return;
                }

                this.formData = raw;
                await this.buildDisplayData(raw);
              } catch (error) {
                console.error('加载考勤记录基本信息失败:', error);
                this.error = '加载失败：' + ((error && error.message) || '未知错误');
              } finally {
                this.loading = false;
              }
            },

            pickKqjlData(data) {
              if (!data) return null;
              if (data.kqjl) return data.kqjl;
              if (data.bjdmKqjl) return data.bjdmKqjl;
              if (Array.isArray(data.objectList) && data.objectList.length > 0) {
                return data.objectList[0].kqjl || data.objectList[0].bjdmKqjl || data.objectList[0];
              }
              if (Array.isArray(data.data) && data.data.length > 0) {
                return data.data[0].kqjl || data.data[0].bjdmKqjl || data.data[0];
              }
              if (typeof data === 'object') return data;
              return null;
            },

            async buildDisplayData(raw) {
              // 格式化考勤记录显示字段 by xu 2026-03-06
              this.displayData = {
                mc: raw.mc || '',
                rymc: await this.translateDict('ry', raw.ryid, raw.rymc || raw.xm),
                kssj: this.formatDate(raw.kssj),
                jssj: this.formatDate(raw.jssj),
                kqlb: await this.translateDict('kqlb', raw.kqlbm, raw.kqlb),
                bjmc: await this.translateDict('bj', raw.bjid, raw.bjmc || raw.bjname),
                ms: this.normalizeDesc(raw.ms || raw.mswj || ''),
              };
            },

            formatDate(value) {
              if (!value) return '';
              if (window.H5FieldFormatter && typeof window.H5FieldFormatter.formatDate === 'function') {
                return window.H5FieldFormatter.formatDate(value, 'YYYY-MM-DD HH:mm:ss');
              }
              return value;
            },

            normalizeDesc(value) {
              if (!value) return '';
              return String(value)
                .replace(/<br\s*\/?\>/gi, '\n')
                .replace(/<[^>]+>/g, '')
                .trim();
            },

            async translateDict(dictName, value, fallbackName) {
              if (fallbackName) return fallbackName;
              if (value === undefined || value === null || value === '') return '';
              try {
                if (typeof window.getDictOptions === 'function') {
                  const options = await window.getDictOptions(dictName);
                  const target = (options || []).find((item) => String(item.v) === String(value));
                  if (target && target.n) return target.n;
                }
              } catch (error) {
                console.error(`${dictName} 字典翻译失败:`, error);
              }
              return String(value);
            },
          },
        });
      });
    </script>
  </body>
</html>