projectmanager/app/workorder/view/index/view.html

<form class="layui-form page-content p-4">
  <input
    type="hidden"
    name="id"
    id="id"
    value="<?php echo isset($view['id']) ? $view['id'] : ''; ?>"
  />
  <h3 class="h3-title">工单详情 - ID:{$view['id']}</h3>
  <table class="layui-table layui-table-form">
    <tr>
        <td class="layui-td-gray-2">工单状态</td>
        <td>
          <?php
                      $statusMap = [
                          0 =>
          "未解决", 1 => "解决中", 2 => "已解决", 3 => "已关闭" ]; $statusClass =
          isset($view['status']) ? 'gdzt gd-' . intval($view['status']) : '';
          $statusText = (isset($view['status']) &&
          isset($statusMap[$view['status']])) ? $statusMap[$view['status']] : '-';
          ?>
          <span class="<?php echo $statusClass; ?>"
            ><?php echo $statusText; ?></span
          >
        </td>
      <td class="layui-td-gray-2">隶属项目</td>
      <td>{$view['project_id']}</td>
    </tr>
    <tr>
      <td class="layui-td-gray-2">提交人</td>
      <td>{$view['creater']}</td>
      <td class="layui-td-gray-2">提交人项目ID</td>
      <td>{$view['uid']}</td>
    </tr>
    <tr>
      <td class="layui-td-gray-2">联系电话</td>
      <td>{$view['contact']}</td>
      <td class="layui-td-gray-2">电子邮箱</td>
      <td>{$view['email']}</td>
    </tr>
    <tr>
      <td class="layui-td-gray-2">提交时间</td>
      <td>{$view['sub_time']}</td>
      <td class="layui-td-gray-2">分派处理人</td>
      <td>
        <?php echo isset($view['solve']) && $view['solve'] !== '' ? $view['solve'] : '暂无'; ?>
      </td>
    </tr>
    <tr>
      <td class="layui-td-gray-2">问题类型</td>
      <td>{$view['problemtype']}</td>
      <td class="layui-td-gray-2">项目工单ID</td>
      <td>{$view['project_order_id']}</td>
    </tr>
    <tr>
      <td class="layui-td-gray-2">项目问题</td>
      <td colspan="4">
        <div id="workorder-content">
          <?= $view['content'] ?>
        </div>
      </td>
    </tr>
    <tr>
      <td class="layui-td-gray-2">备注</td>
      <td colspan="4">{$view.remark}</td>
    </tr>
  </table>
</form>

<script>
  // 获取URL参数id
  function getQueryId() {
    var match = window.location.pathname.match(/\/edit\/id\/(\d+)/);
    return match ? match[1] : "";
  }
  var id = getQueryId();
  // 赋值给input（如果不是php渲染，也可保留此段，防止页面未渲染id时赋值）
  document.addEventListener("DOMContentLoaded", function () {
    var idInput = document.getElementById("id");
    if (idInput && !idInput.value) {
      idInput.value = id;
    }
  });

  layui.use(["form", "layer", "upload"], function () {
    var form = layui.form,
      layer = layui.layer,
      upload = layui.upload;

    layer.photos({
      photos: "#workorder-content",
      anim: 5,
    });

    var selectedFile = null; // 用于存储选择的文件

    form.render();

    // 监听提交事件
    form.on("submit(webform)", function (data) {
      // 发送请求并处理响应
      fetch("/download/index/edit?id=" + idValue, {
        method: "POST",
        body: JSON.stringify({
          id: document.getElementById("id").value,
          name: document.getElementById("name").value,
          cid: document.querySelector('select[name="cid"]').value,
          version: document.querySelector('input[name="version"]').value,
          path: document.querySelector('input[name="path"]').value,
          download_url: document.querySelector('input[name="download_url"]')
            .value,
          download_code: document.querySelector('input[name="download_code"]')
            .value,
          description: document.querySelector('textarea[name="description"]')
            .value,
          update_time: updateTime,
        }),

        headers: {
          "Content-Type": "application/json",
        },
      })
        .then((response) => response.json())
        .then((result) => {
          layer.msg(result.msg);
          if (result.code === 2) {
            setTimeout(function () {
              // document.querySelector("form").reset();
              // location.reload(); // 刷新页面
            }, 1000);
          }
        });

      return false;
    });
  });
</script>
<style>
  .layui-table td {
    height: 40px;
  }
  .gdzt {
    padding: 3px 5px;
    border-radius: 4px;
  }

  .gd-0 {
    color: #555;
    background-color: #eee;
  }

  .gd-1 {
    color: #fff;
    background-color: #1e9fff;
  }

  .gd-2 {
    color: #fff;
    background-color: #16b777;
  }

  .gd-3 {
    color: #fff;
    background-color: #a233c6;
  }
  .pt-1 {
    margin-top: 15px;
  }
  .page-content img {
    padding: 15px;
  }
  .layui-layer-shade {
    background-color: rgba(0, 0, 0, 0.5) !important;
  }
</style>