addEnterprise.html 17 KB

Edit Raw Blame History Permalink

<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
  <th:block th:include="include :: header('下拉框')"/>
  <th:block th:include="include :: select2-css"/>
  <th:block th:include="include :: bootstrap-select-css"/>
  <th:block th:include="include :: bootstrap-fileinput-css" />
  <style>
      .file-caption.form-control.kv-fileinput-caption{
          width: 200px;
          text-align: left;
      }
  </style>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
  <form class="form-horizontal m" id="form-menu-add">
    <!--			<input id="treeId" name="parentId" type="hidden" th:value="${menu.menuId}" />-->
    <!--			部门id-->
    <input name="orgId" type="hidden" id="treeId" th:value="${treeId}"/>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>代下单用户部门：</label>
      <div class="col-sm-8">
        <div class="input-group">
          <input name="deptName" onclick="selectDeptTree()" id="treeName" type="text" placeholder="请选择归属部门" th:value="${treeName}"
                 class="form-control" required>
          <span class="input-group-addon"><i class="fa fa-search"></i></span>
        </div>
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>代下单用户名：</label>
      <div class="col-sm-8">
        <select id="userId" name="userId" class="form-control m-b" required>
          <option value="">请选择</option>
          <!--						<option value="menuItem">页签</option>-->
          <!--						<option value="menuBlank">新窗口</option>-->
        </select>
        <!--					<span id="userWarm" style="color: red; display: none"> 请先选择用户部门</span>-->
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>报告类型：</label>
      <div class="col-sm-8">
        <!--<select id="reportType" name="reportType" th:with="type=${@dict.getType('background_report_type')}"
                class="form-control m-b" required>
          <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
        </select>-->
        <select id="reportType" name="reportType" class="form-control m-b" required>
        </select>
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>国别：</label>
      <div class="col-sm-8">
        <select id="country" class="form-control m-b" required>
          <option th:each="item:${countryList}" th:value="${item.jcCode}" th:text="${item.gj}"></option>
        </select>
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>订单名称：</label>
      <div class="col-sm-8">
        <input id="enterpriseName" name="enterpriseName" class="form-control" type="text">
      </div>
    </div>

    <input id="createImmediate" name="createImmediate" class="form-control" type="hidden" disabled>
    <div class="form-group"  id="entrustTypeDiv" style="display: none">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>委托类型：</label>
      <div class="col-sm-8">
        <!--<select id="entrustType" name="entrustType" th:with="type=${@dict.getType('entrust_type')}" class="form-control m-b" required>
          <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
        </select>-->
        <select id="entrustType" name="entrustType" class="form-control m-b" required>
        </select>
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>城市：</label>
      <div class="col-sm-8">
        <input id="city" name="city" class="form-control" type="text">
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>企业地址：</label>
      <div class="col-sm-8">
        <input id="address" name="address" class="form-control" type="text">
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label">邮编：</label>
      <div class="col-sm-8">
        <input id="postCode" name="postCode" class="form-control" type="text">
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label">电子邮箱：</label>
      <div class="col-sm-8">
        <input id="email" name="email" class="form-control" type="text">
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label">联系电话：</label>
      <div class="col-sm-8">
        <input id="phone" name="phone" class="form-control" type="text">
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label">公司注册号码：</label>
      <div class="col-sm-8">
        <input id="regNo" name="regNo" class="form-control" type="text">
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label"><span style="color: red; ">*</span>是否需要翻译：</label>
      <div class="col-sm-8">
        <select id="translateType" name="translateType" class="form-control m-b" required>
          <option value="NO">无</option>
          <option value="CN">英译中</option>
          <option value="ON">中译日</option>
          <option value="EN">中译英</option>
        </select>
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label">附件：</label>
      <div class="col-sm-8">
        <input id="fileUpload" class="file" type="file"  data-show-preview="false">
        <input id="attachment" name="attachment" type="hidden">
      </div>
    </div>

    <div class="form-group">
      <label class="col-sm-3 control-label">备注：</label>
      <div class="col-sm-8">
        <input id="remark" name="remark" class="form-control" type="text">
      </div>
    </div>
  </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: select2-js"/>
<th:block th:include="include :: bootstrap-select-js"/>
<th:block th:include="include :: bootstrap-fileinput-js" />
<script type="text/javascript" th:inline="javascript">
  var prefix = ctx + "web/report";

  let contractReportBusinessTypeList = []
  let entrustTypeList = []
  let reportTableList = []

  /**
   * 提交表单，保存用户下单信息
   */
  function submitHandler() {
    //报告下单公司
    let enterpriseName = $("#enterpriseName").val();
    //代下单用户名
    let userName = $("#userId").find(":selected").text();
    //代下单用户id
    let userId = $("#userId").val();
    //代下单用户部门id
    let orgId = $("#treeId").val();
    //代下单用户部门名称
    let orgName = $("#treeName").val();
    //报告类型
    let reportType = $("#reportType").val();
    //报告名称
    let reportName = $("#reportType").find(":selected").text();
    //委托类型
    let entrustType = $("#entrustType").val();
    //备注
    let remark = $("#remark").val();

    let country = $("#country").val();
    let city = $("#city").val();
    let address = $("#address").val();
    let postCode = $("#postCode").val();
    let email = $("#email").val();
    let phone = $("#phone").val();
    let regNo = $("#regNo").val();
    let translateType = $("#translateType").val();
    let createImmediate = $("#createImmediate").val();
    let attachment = $("#attachment").val();

    //初始化请求参数
    const data = {
      "enterpriseName": enterpriseName,
      "userName": userName,
      "userId": userId,
      "orgId": orgId,
      "orgName": orgName,
      "reportType": reportType,
      "reportName": reportName,
      "entrustType": entrustType,
      "remark": remark,
      country: country,
      city: city,
      address: address,
      postCode: postCode,
      email: email,
      phone: phone,
      regNo: regNo,
      translateType: translateType,
      createImmediate: createImmediate,
      attachment: attachment
    }
    //需要校验 报告下单公司 ，其余字段 由jQuery Validation使用 $.validate.form() 校验
    if ($.validate.form()) {
      reportTableList.forEach(item => {
        if (item.typeId == $("#reportType").val()) {
          if ($("#createImmediate").val() == "Y") {
            data.templateParamId = item.templateConfigurationParametersList[0].id
          } else {
            item.templateConfigurationParametersList.forEach(template => {
              if (template.clientType == $("#entrustType").val()) {
                data.templateParamId = template.id
              }
            })
          }
        }
      })
      const jsonData = JSON.stringify(data);

      fetch(prefix + '/backgroundOrder', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: jsonData
      })
        .then(response => {
          if (!response.ok) {
            throw new Error('接口返回错误' + response.statusText);
          }
          return response.json();
        })
        .then(data => {
          if (data.code === 2000) {
            $.modal.msgReload("保存成功", modal_status.SUCCESS);
            // $.modal.alertSuccess("保存成功")
            // $.modal.close();
          } else {
            $.modal.alertError(data.msg)
          }
        })
        .catch(error => {
          console.log('请求出错', error);
        })
    }
  }

  function validateOthers(property) {
    if (property === '' || property === null) {
      $.modal.alertError("请填写报告下单公司")
      return false;
    }
    return true;
  }


  /**
   * 委托类型,报告类型 销毁select2 直接下拉即可
   */
  $(document).ready(function () {
    $("#entrustType").select2('destroy');
    $("#reportType").select2('destroy');
    // $("#entrustType").select2({
    // 	// placeholder: "请输入需要下单的公司",
    // 	searchable: false
    // });
  });

  /*用户管理-新增-选择部门树*/
  function selectDeptTree() {
    var treeId = $("#treeId").val();
    var deptId = $.common.isEmpty(treeId) ? "23" : $("#treeId").val();
    var url = ctx + "business/frontDept/selectDeptTree/" + deptId;
    console.log(url)
    var options = {
      title: '选择部门',
      width: "380",
      url: url,
      expandLevel: 2,
      callBack: doSubmit
    };
    $.modal.openOptions(options);
  }

  function doSubmit(index, layero) {
    var body = layer.getChildFrame('body', index);
    $("#treeId").val(body.find('#treeId').val());
    $("#treeName").val(body.find('#treeName').val());
    layer.close(index);
    //部门树回调结束，调用接口获取用户信息
    updateDept();
    getUserReportType();
  }

  let beforeTreeId = [[${treeId}]]
  let beforeUserId = [[${userId}]]
  console.log(beforeTreeId)
  if (beforeTreeId != '-100') {
    updateDept();
    getUserReportType();
  }

  /**
   * 代下单用户校验
   */
  $('#userId').on('select2:open', function () {
    let deptId = $("#treeId").val();
    if (deptId === null || deptId === '') {
      // console.log(111111111111)
      // $("#userWarm").show();
      $.modal.alertError("请先选择部门")
      return;
    }
  });

  /**
   * 根据 选定的部门id 查询对应部门下的用户，并设置 代下单用户的 option
   */
  function updateDept() {

    let deptId = $("#treeId").val();
    // console.log(ctx + '/business/frontUser/getFrontUserByOrgId/')
    //调用后端接口，获取用户
    fetch(ctx + 'business/frontUser/getFrontUserByOrgId/' + deptId).then(response => response.json()).then(data => {
      //先将 select标签置空，防止多次点击 累加option
      const userSelect = document.getElementById('userId');
      userSelect.innerHTML = '';
      data.data.forEach(option => {
        //拼接对应的 option
        //'<option value="'+ option.id+'"> '+ option.userName +' </option>'
        let optionElement = document.createElement('option');
        optionElement.textContent = option.userName;
        optionElement.value = option.id
        userSelect.appendChild(optionElement);
      });

      if (beforeTreeId!= '-100') {
        $("#userId").val(beforeUserId)
      }

    }).catch(error => console.error("Error fetching options:" + error));
  }

  function getUserReportType () {
    let deptId = $("#treeId").val();
    fetch(ctx + 'business/bCreditReport/getUserReportType?orgId='+ deptId).then(response => response.json()).then(res => {
      reportTableList = res.data.reportTableList
      // contractReportBusinessTypeList = res.data.contractReportBusinessTypeList
      // entrustTypeList = res.data.entrustTypeList
      //先将 select标签置空，防止多次点击 累加option
      const reportTypeSelect = document.getElementById('reportType');
      reportTypeSelect.innerHTML = '';
      reportTableList.forEach(option => {
        if (option.typeId == '-10') {
          let optionElement = document.createElement('option');
          optionElement.textContent = option.typeName;
          optionElement.value = option.typeId
          reportTypeSelect.appendChild(optionElement);
        }
      })
      handleChangeReportType(1) // 自动执行一次
    }).catch(error => console.error("Error fetching options:" + error));
  }

  $("#reportType").on("change", function () {
    handleChangeReportType(1);
  })
  function handleChangeReportType (type) {
    let reportType = $("#reportType").val();
    $("#createImmediate").val("N");
    const entrustTypeSelect = $("#entrustType")
    entrustTypeSelect.empty();
    $("#translateType").empty();

    // $("#addEnterprise").show();
    // $("#hwName").show();
    $("#hwEntDiv").show();
    $("#enterpriseNameDiv").hide();
    $("#clientIdDiv").hide()
    reportTableList.forEach(item => {
      if (item.typeId == reportType) {
        item.templateConfigurationParametersList.forEach(option => {
          if (option.clientType == "3") {
            $("#createImmediate").val("Y")
            $("#entrustTypeDiv").hide();
          }
        })
        if ($("#createImmediate").val() == "N") {
          $("#entrustTypeDiv").show();
          item.templateConfigurationParametersList.forEach(option => {
            let optionElement = document.createElement('option');
            optionElement.textContent = getClientTypeStr(option.clientType)
            optionElement.value = option.clientType
            entrustTypeSelect.append(optionElement);
          })
        }
      }
    })

    // 赋值报告翻译
    reportTableList.forEach(item => {
      if (item.typeId == reportType) {
        if (item.typeId != "-11") {
          // 除了定制
          item.templateConfigurationParametersList.forEach(option => {
            if (option.clientType === null) {
              let optionElement = document.createElement('option');
              optionElement.textContent = '无'
              optionElement.value = "NO"
              $("#translateType").append(optionElement)
              let optionElement2 = document.createElement('option');
              optionElement2.textContent = getReportTranslationTypeStr(option.reportTranslationType);
              optionElement2.value = option.reportTranslationType
              $("#translateType").append(optionElement2)
            }
          })
        }
      }
    })

  }

  $("body").on("change", "#clientId", function () {
    handleChangeReportType(2);
  })

  function getClientTypeStr (type) {
    let str = ""
    switch (type) {
      case "0":
        str = "普通"
        break;
      case "1":
        str = "加急"
        break;
      case "2":
        str = "特急"
        break;
      case "4":
        str = "其他"
        break;
    }
    return str
  }

  function getReportTranslationTypeStr (type) {
    let str = ""
    switch (type) {
      case "ON":
        str = "中译日"
        break;
      case "CN":
        str = "英译中"
        break;
      case "EN":
        str = "中译英"
        break;
    }
    return str
  }

  $("#fileUpload").fileinput({
    // theme: 'explorer-fas',
    uploadUrl: '/web/common/uploadForBReport',
    maxFileCount: 1,   //一次上传文件最大数
    maxFileSize: 10240, //允许上传大小
    uploadAsync: true, //同步上传
    showUpload: false, //是否显示上传按钮
    showRemove: false, //显示移除按钮
    showCaption: true, //是否显示标题
    browseClass: "btn btn-primary btn-sm", //按钮样式
    dropZoneEnabled: false,//是否显示拖拽区域
  }).on('fileuploaded', function(event, data, previewId, index) {
    let fileData = data.response;
    if (fileData.code === 2000) {
      $("#attachment").val(fileData.data[0].fileAttachments)
    } else {
      $.modal.alertError(fileData.msg)
    }
  }).on('filebatchselected', function (event, files) {
    $("#fileUpload").fileinput("upload");//上传文件
  }).on('filebatchuploaderror', function (event, data, msg) {
    //即同步上传错误结果处理
    $.modal.alertError("上传失败")
  });

</script>
</body>
</html>