fourcal/src/main/resources/templates/admin/business/process-detail.ftl

<#assign base=request.contextPath />
<#import "../../common/defaultLayout.ftl" as defaultLayout>
<@defaultLayout.layout>
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <style>

      .el-upload__input {
          display: none !important;
      }

      .el-textarea .el-input__count {
          line-height: 15px;
      }

      .admin-content-body {
          margin-bottom: 100px;
      }

      .el-table__empty-block {
          height: 60px !important;
      }

      .el-upload-list__item-name [class^="el-icon"] {
          height: unset;
      }

      .el-tag--small {
          margin-right: 5px;
      }
  </style>

  <div class="admin-content" id="app">
    <div class="admin-content-body">
      <div class="am-cf am-padding">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">业务应用</strong> /
          <small>${process.processType.description}详情</small>
        </div>
      </div>

      <div class="am-u-sm-12 am-u-md-12">

        <el-descriptions title="${process.processType.description}详情">
          <el-descriptions-item label="项目编号">${process.projectNo}</el-descriptions-item>
          <el-descriptions-item label="项目标题">${process.projectTitle}</el-descriptions-item>
          <el-descriptions-item label="申请时间">${process.applyDate}</el-descriptions-item>
          <el-descriptions-item label="项目类型">${projectType}</el-descriptions-item>
          <el-descriptions-item label="合作类型">${cooperationType}</el-descriptions-item>

          <el-descriptions-item label="申请部门">${process.applyDept}</el-descriptions-item>
          <el-descriptions-item label="申请人">${process.applyPersonName}</el-descriptions-item>
          <el-descriptions-item label="申请部门领导">${process.applyDeptLeaderName}</el-descriptions-item>
          <el-descriptions-item label="申请人电话">${contract.applyPersonPhone}</el-descriptions-item>

          <el-descriptions-item label="合同编号">${process.contractNo}</el-descriptions-item>
          <el-descriptions-item label="合同名称">${process.contractName}</el-descriptions-item>
          <el-descriptions-item label="合同金额">${project.contractAmount}</el-descriptions-item>

          <el-descriptions-item label="客户名称">${contract.clientName}</el-descriptions-item>
          <el-descriptions-item label="最终用户名称">${project.terminalCustomer}</el-descriptions-item>

          <el-descriptions-item label="用印类型">
              <#list process.sealTypes.list as item>
                <el-tag size="small">${item.description}</el-tag>
              </#list>
          </el-descriptions-item>

          <el-descriptions-item label="税率">${process.taxRate}%</el-descriptions-item>
          <el-descriptions-item label="是否垫资">${isPrepaid}</el-descriptions-item>
          <el-descriptions-item label="垫资金额">${repaidAmount}元</el-descriptions-item>
          <el-descriptions-item label="预算毛利率">${project.grossProfitMargin}</el-descriptions-item>

          <el-descriptions-item label="收款条件">${contract.paymentTerms}</el-descriptions-item>
          <el-descriptions-item label="备注">${process.remark}</el-descriptions-item>
          <el-descriptions-item label="附件">
              <#list attachments as attachment>
                <el-tag size="small">
                  <a href="${attachment.uri}">
                    <i class="el-icon-document"></i> ${attachment.name}
                  </a>
                </el-tag>
              </#list>
          </el-descriptions-item>

        </el-descriptions>

          <#--
            <el-form :inline="true" ref="saleContractProcessForm" :model="processForm" label-position="right" label-width="100px">

            <div class="am-form-inline">

              <el-form-item label="项目编号">
                <span>${process.projectNo}</span>
              </el-form-item>

              <el-tooltip effect="light" :content="projectTitle" placement="top-start">
                <el-form-item label="项目标题">
                  <span>${process.projectTitle}</span>
                </el-form-item>
              </el-tooltip>

              <el-form-item label="申请时间">
                <span>${process.applyDate}</span>
              </el-form-item>

              <el-form-item label="项目类型">
                <span>${projectType}</span>
              </el-form-item>

              <el-form-item label="合作类型">
                <span>${cooperationType}</span>
              </el-form-item>

            </div>

            <div>

              <el-form-item label="申请部门">
                <span>${process.applyDept}</span>
              </el-form-item>

              <el-form-item label="申请人">
                <span>${process.applyPersonName}</span>
              </el-form-item>

              <el-form-item label="申请部门领导">
                <span>${process.applyDeptLeaderName}</span>
              </el-form-item>

              <el-form-item label="申请人电话" prop="applyPersonPhone">
                <span>${contract.applyPersonPhone}</span>
              </el-form-item>

            </div>

            <div>

              <el-form-item label="合同编号">
                <span>${process.contractNo}</span>
              </el-form-item>

              <el-form-item label="合同名称">
                <span>${process.contractName}</span>
              </el-form-item>

              <el-form-item label="合同金额">
                <span>${project.contractAmount}</span>
              </el-form-item>

            </div>

            <div>
              <el-form-item label="客户名称">
                <span>${contract.clientName}</span>
              </el-form-item>

              <el-form-item label="最终用户名称">
                <span>${project.terminalCustomer}</span>
              </el-form-item>
            </div>

            <div>
              <el-form-item label="用印类型">
                  <#list process.sealTypes.sealTypes as item>
                    <el-tag size="small">${item.description}</el-tag>
                  </#list>
              </el-form-item>
            </div>

            <div>

              <el-form-item label="税率">
                <span>${process.taxRate}%</span>
              </el-form-item>

              <el-form-item label="是否垫资">
                <span>${isPrepaid}</span>
              </el-form-item>

              <el-form-item label="垫资金额">
                <span>${repaidAmount}元</span>
              </el-form-item>

              <el-form-item label="预算毛利率">
                <span>${project.grossProfitMargin}</span>
              </el-form-item>

            </div>

            <div>
              <el-form-item label="收款条件">
                <div>${contract.paymentTerms}</div>
              </el-form-item>
            </div>

            <div>
              <el-form-item label="备注">
                <div>${process.remark}</div>
              </el-form-item>
            </div>

            <div>
              <el-form-item label="附件">
                  <#list attachments as attachment>
                    <a href="${attachment.uri}">
                      <i class="el-icon-document"></i> ${attachment.name}
                    </a>
                  </#list>
              </el-form-item>
            </div>

          </el-form>
-->

        <el-row>
          <el-button type="info" @click="backLastPage">返回上一级</el-button>
        </el-row>

      </div>

    </div>

  </div>

  </div>

  <script src="https://unpkg.com/vue@2/dist/vue.js"></script>
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>

  <script>

    const isEmpty = (obj) => {
      return !obj || (obj.length && obj.length === 0)
    }

    const isNotEmpty = (obj) => {
      return !isEmpty(obj)
    }

    const isBlank = (obj) => {
      return isEmpty(obj) || (obj.trim && isEmpty(obj.trim()))
    }

    const hasText = (obj) => {
      return !isBlank(obj)
    }

    const data = () => {
      return {}
    }

    const methods = {
      backLastPage() {
        window.history.back();
      }
    }

    new Vue({
      el: '#app',
      data,
      methods,
    })

  </script>

</@defaultLayout.layout>