icore-pass/src/views/TMS/components/importedShip/instructionsCapacity.vue

<template>
  <!-- 船只信息页面 -->
  <div class="homeworkPath">
    <page-title>船只信息</page-title>
    <div class="shipName">
      <span class="text">江船船名</span>
      <el-autocomplete
        v-model="state"
        :fetch-suggestions="querySearch"
        placeholder="请输入内容"
        :trigger-on-focus="false"
        @select="handleSelect"
      >
        <template slot-scope="{ item }">
          <div class="name">{{ item.capacityName }}</div>
        </template></el-autocomplete
      >
    </div>
    <div class="form">
      <dil-form :formId="119" v-model="form"></dil-form>
    </div>
    <div class="btn">
      <el-button type="primary" @click="makeSure">新增船只</el-button>
    </div>
    <dilTable v-bind.sync="option">
      <el-table-column fixed="right" label="操作" align="center" width="150">
        <template slot-scope="scope">
          <el-button
            type="text"
            size="mini"
            @click="deleteclick(scope.row.orderId)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </dilTable>
  </div>
</template>

<script>
import PageTitle from "@/components/Page/Title";
import { sjTime } from "@/utils/sharedJsFile";
export default {
  components: { PageTitle },
  data() {
    return {
      restaurants: [],
      state: "",
      form: {},
      capacityIds: "",
      option: {
        // 表格请求数据的地址
        requestUrl:
          "/api/v1/tms/getCapacities?apiId=76&instructionsId=" +
          this.$route.params.instructionsId
      }
    };
  },
  methods: {
    querySearch(queryString, cb) {
      this.axios
        .post("/api/v1/tms/getShipNameList?state=" + this.state)
        .then(res => {
          console.log(res.data.data);
          var restaurants = res.data.data;
          var results = queryString
            ? restaurants.filter(this.createFilter(queryString))
            : restaurants;
          // 调用 callback 返回建议列表的数据
          cb(results);
        });
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.capacityName
            .toLowerCase()
            .indexOf(queryString.toLowerCase()) > -1
        );
      };
    },
    handleSelect(item) {
      this.capacityIds = item.capacityId;
      this.state = item.capacityName;
      console.log(this.capacityIds);
      this.axios
        .get("/api/v1/uc/getCapacityTel?capacityId=" + item.capacityId)
        .then(res => {
          console.log(res.data);
          if (res.data) {
            this.$set(this.form, "instructionContactInf", res.data.capacityTel);
          }
        });
      //根据运力ID查询联系方式
    },

    // 新增
    makeSure() {
      let omsshipInstructionsCapacity = {
        instructionsId: this.$route.params.instructionsId,
        state: this.state,
        capacityName: this.state,
        capacityIds: this.capacityIds,
        instructionPlannedLoading: this.form.instructionPlannedLoading,
        instructionsShipPosition: this.form.instructionsShipPosition,
        instructionContactInf: this.form.instructionContactInf,
        instructionsCapacityStatus: this.form.instructionsCapacityStatus,
        instructionEsarrivalTime: sjTime(this.form.instructionEsarrivalTime)
      };
      //判断是否为电话号码
      function isTelePhone() {
        var value2 = omsshipInstructionsCapacity.instructionContactInf;
        //验证是否为数字
        var patrn = /^1[3-9]\d{9}$/;
        // var patrn2 = /^(\d{3,4}-)?\d{7,8}$/;
        if (patrn.exec(value2) == null || value2 == "") {
          return false;
        } else {
          return true;
        }
      }

      //判断放货数量是否为数字
      function isNumber() {
        var value = omsshipInstructionsCapacity.instructionPlannedLoading;
        //验证是否为数字
        var patrn = /^(-)?\d+(\.\d+)?$/;
        if (patrn.exec(value) == null || value == "") {
          return false;
        } else {
          return true;
        }
      }
      var val = this.value;
      var val2 = this.value2;
      if (
        omsshipInstructionsCapacity.state == null ||
        omsshipInstructionsCapacity.instructionPlannedLoading == null ||
        omsshipInstructionsCapacity.instructionsShipPosition == null ||
        omsshipInstructionsCapacity.instructionContactInf == null ||
        omsshipInstructionsCapacity.instructionsCapacityStatus == null ||
        omsshipInstructionsCapacity.instructionEsarrivalTime == null ||
        omsshipInstructionsCapacity.capacityName == null
      )
        this.$message.error("存在空值！");
      else if (!isNumber(val)) this.$message.warning("计划装载吨位必须为数字");
      else if (!isTelePhone(val2)) this.$message.warning("联系方式格式错误");
      else
        this.axios
          .post(
            "/api/v1/tms/addInstructionsCapacity",
            omsshipInstructionsCapacity
          )
          .then(res => {
            if (res.data.code == 200) {
              this.$message({
                type: "success",
                message: "新增成功!"
              });
              // this.$refs.table.refreshData();
              this.option.requestUrl =
                "/api/v1/tms/getCapacities?apiId=76&instructionsId=" +
                this.$route.params.instructionsId +
                "&i=" +
                new Date();
              // this.$router.go(this.option);
            } else {
              this.$message.error("新增失败！");
            }
            this.$refs["table"].resetField();
          });
    },
    click(orderId, instructionsId) {
      this.$router.push(
        "/ship/updateInstructionsCapacity/" +
          orderId +
          "?instructionsId=" +
          instructionsId
      );
    },
    deleteclick(scope) {
      let orderId = scope;
      this.$confirm("是否删除", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true
      })
        .then(() => {
          this.axios
            .post("/api/v1/tms/deleteInstructionsCapacity/" + orderId)
            .then(() => {
              this.$message({
                type: "success",
                message: "删除成功!"
              });
              this.option.requestUrl =
                "/api/v1/tms/getCapacities?apiId=76&instructionsId=" +
                this.$route.params.instructionsId +
                "&i=" +
                new Date();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "取消删除!"
          });
        });
    }
  }
};
</script>
<style lang="scss">
.homeworkPath {
  .shipName {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.25rem;
    .text {
      width: 6.25rem;
      text-align: right;
      padding-right: 0.9375rem;
      font-size: 0.9375rem;
      font-weight: 600;
      color: #606266;
    }
  }
  .form {
    margin-top: 1.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
</style>