<template>
  <base-list>
    <template slot="n_header">
      <el-form v-model="pagerDto" inline>
        <el-form-item label="公开渠道">
          <el-select
            v-model="pagerDto._Eq_PublicChannelId"
            placeholder="公开渠道"
            clearable
            filterable
          >
            <el-option
              v-for="item in publicChannels"
              :key="'p' + item.Id"
              :label="item.Name"
              :value="item.Id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="派送渠道">
          <el-select
            v-model="pagerDto._Eq_ChannelId"
            placeholder="派送渠道"
            clearable
            filterable
          >
            <el-option
              v-for="item in channels"
              :key="'channel2' + item.Id"
              :value="item.Id"
              :label="item.Name"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="是否以公开渠道配置">
          <el-select v-model="pagerDto._Eq_ApplyToChildChannels" clearable>
            <el-option
              v-for="item in applyToChildChannels"
              :key="item.key"
              :label="item.key"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="pagerSerach(0)">搜索</el-button>
          <el-button type="success" @click="openAddSetting('add')">新建设置</el-button>
        </el-form-item>
      </el-form>
    </template>
    <template slot="n_option" />
    <template>
      <el-table
        :data="data"
        :highlight-current-row="true"
        :select-on-indeterminate="true"
        width="100%"
        v-loading="dataLoading"
      >
        <el-table-column label="渠道名称" prop="ChannelName"> </el-table-column>
        <el-table-column label="以公开渠道配置">
          <template slot-scope="s">
            <el-tag v-if="s.row.ApplyToChildChannels" type="success">是</el-tag>
            <el-tag v-else type="primary">否</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="称重-扫描(小时)" prop="RecScnHour"> </el-table-column>
        <el-table-column label="扫描-出库(小时)" prop="ScnOutHour"> </el-table-column>
        <el-table-column label="出库-离港(小时)" prop="OutDptHour"> </el-table-column>
        <el-table-column label="到港-清关(天)" prop="ArrClrDay"> </el-table-column>
        <el-table-column label="清关-上网(天)" prop="ClrOlnDay"> </el-table-column>
        <el-table-column label="上网-签收(天)" prop="OlnSgnDay"> </el-table-column>
        <el-table-column label="是否启用">
          <template slot-scope="s">
            <el-tag v-if="s.row.Disabled" type="warning">禁用</el-tag>
            <el-tag v-else type="success">启用</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="250px">
          <template slot-scope="s">
            <el-button
              v-if="s.row.Disabled"
              size="mini"
              type="success"
              @click="setEnable(s.row, true)"
              >启用</el-button
            >
            <el-button
              v-else
              type="warning"
              size="mini"
              @click="setEnable(s.row, false)"
              >禁用</el-button
            >
            <el-button type="primary" size="mini" @click="openEditSetting(s.row)"
              >编辑</el-button
            >
            <el-button type="danger" size="mini" @click="remove(s.row.Id)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        :page-sizes="[10, 20, 40, 100, 400]"
        :current-page="pagerDto.PageIndex"
        :page-size.sync="pagerDto.PageSize"
        background
        layout="prev, pager, next ,total ,jumper,sizes,slot "
        :total="pagerDto.total"
        @size-change="changePager"
        @current-change="pagerSerach"
      />

      <el-dialog
        v-loading="dataLoading"
        :title="editMode == 'add' ? '新增设置' : '编辑设置'"
        :visible.sync="showEdit"
        width="40%"
      >
        <el-form>
          <el-alert
            :closable="false"
            title="公开渠道和派送渠道不能同时选择，如果选择公开渠道，则该设置会对所有子渠道生效"
            type="warning"
          >
          </el-alert>
          <br />
          <el-form-item label="公开渠道">
            <el-select
              v-model="editItem.PublicChannelId"
              placeholder="公开渠道"
              clearable
              filterable
            >
              <el-option
                v-for="item in publicChannels"
                :key="'p2' + item.Id"
                :label="item.Name"
                :value="item.Id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="派送渠道">
            <el-select
              v-model="editItem.ChannelId"
              placeholder="派送渠道"
              clearable
              filterable
            >
              <el-option
                v-for="item in channels"
                :key="'channel3' + item.Id"
                :value="item.Id"
                :label="item.Name"
              />
            </el-select>
          </el-form-item>
          <el-alert
            :closable="false"
            title="设置超时时间，0或留空代表不设置"
            type="warning"
          ></el-alert>
          <br />

          <el-form-item label="称重-装箱">
            <el-input-number v-model="editItem.RecScn"></el-input-number>(小时)
          </el-form-item>
          <el-form-item label="装箱-出库">
            <el-input-number v-model="editItem.ScnOut"></el-input-number>(小时)
          </el-form-item>
          <el-form-item label="出库-离港">
            <el-input-number v-model="editItem.OutDpt"></el-input-number>(小时)
          </el-form-item>
          <el-form-item label="到达-清关">
            <el-input-number v-model="editItem.ArrClr"></el-input-number>(天)
          </el-form-item>
          <el-form-item label="清关-上网">
            <el-input-number v-model="editItem.ClrOln"></el-input-number>(天)
          </el-form-item>
          <el-form-item label="上网-签收">
            <el-input-number v-model="editItem.OlnSgn"></el-input-number>(天)
          </el-form-item>
          <el-form-item label="是否启用">
            <el-switch v-model="editItem.Enabled"></el-switch>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="cancelEdit">取 消</el-button>
          <el-button type="primary" @click="save">确 定</el-button>
        </span>
      </el-dialog>
    </template>
  </base-list>
</template>
<script>
import BaseList from "@/components/Xyy/baselist";
import { _queryPage, _save, _enable, _remove } from "@/api/operateNodeTimeoutSetting";
import { _getAllPublic, _getDeliverChannel } from "@/api/baseInfo";

export default {
  name: "OperateNodeTimeOutSetting",
  components: { "base-list": BaseList },
  data() {
    return {
      applyToChildChannels: [
        { key: "是", value: true },
        { key: "否", value: false },
      ],
      data: [],
      publicChannels: [],
      channels: [],
      dataLoading: false,
      pagerDto: { _Eq_PublicChannelId: null, PageIndex: 0, PageSize: 10, total: 0 },
      showEdit: false,
      editMode: "add",
      editItem: {
        Id: null,
        PublicChannelId: null,
        ChannelId: null,
        RecScn: null,
        ScnOut: null,
        OutDpt: null,
        ArrClr: null,
        ClrOln: null,
        OlnSgn: null,
        Enabled: true,
      },
    };
  },
  methods: {
    setEnable(item, enabled) {
      let id=item.Id;
      let data = { id, enabled };
      this.dataLoading = true;
      _enable(data)
        .then((res) => {
          item.Disabled=!enabled;
          this.$message({ type: "success", message: "成功" });
        })
        .finally(() => {
          this.dataLoading = false;
        });
    },
    remove(id) {
      this.$confirm("是否删除?").then((res) => {
        if (res) {
          let data = { id };
          this.dataLoading = true;
          _remove(data)
            .then((res) => {
              let idx = this.data.findIndex(i=>i.Id==id);
              this.data.splice(idx,1);
              this.$message({ type: "success", message: "成功" });
            })
            .finally(() => {
              this.dataLoading = false;
            });
        }
      });
    },
    save() {
      if (this.editItem.PublicChannelId > 0 && this.editItem.ChannelId > 0) {
        this.$message({ type: "error", message: "公开渠道和派送渠道只能选择其中一项" });
        return;
      } else if (
        (!this.editItem.PublicChannelId || this.editItem.PublicChannelId <= 0) &&
        (!this.editItem.ChannelId || this.editItem.ChannelId <= 0)
      ) {
        this.$message({ type: "error", message: "公开渠道和派送渠道必须选择其中一项" });
        return;
      }
      this.dataLoading = true;
      _save(this.editItem)
        .then((res) => {
          this.showEdit = false;
          this.$message({ type: "success", message: "保存成功" });
          this.pagerSerach(1);
        })
        .finally(() => {
          this.dataLoading = false;
        });
    },
    openAddSetting() {
      this.editItem.Id = null;
      this.editItem.PublicChannelId = null;
      this.editItem.ChannelId = null;
      this.editItem.RecScn = null;
      this.editItem.ScnOut = null;
      this.editItem.OutDpt = null;
      this.editItem.ArrClr = null;
      this.editItem.ClrOln = null;
      this.editItem.OlnSgn = null;
      this.editItem.Enabled = true;
      this.editMode = "add";
      this.showEdit = true;
    },
    openEditSetting(item) {
      if (item.ApplyToChildChannels == true) {
        this.editItem.PublicChannelId = item.PublicChannelId;
        this.editItem.ChannelId = null;
      } else {
        this.editItem.PublicChannelId = null;
        this.editItem.ChannelId = item.ChannelId;
      }
      this.editItem.Id = item.Id;
      this.editItem.RecScn = item.RecScnHour;
      this.editItem.ScnOut = item.ScnOutHour;
      this.editItem.OutDpt = item.OutDptHour;
      this.editItem.ArrClr = item.ArrClrDay;
      this.editItem.ClrOln = item.ClrOlnDay;
      this.editItem.OlnSgn = item.OlnSgnDay;
      this.editItem.Enabled = true;
      this.editMode = "edit";
      this.showEdit = true;
    },
    cancelEdit() {
      this.showEdit = false;
    },
    pagerSerach(index) {
      this.dataLoading = true;
      if (index) {
        this.pagerDto.PageIndex = index;
      }
      _queryPage(this.pagerDto)
        .then((res) => {
          this.data = res.Result;
          this.pagerDto.total = res.TotalCount;
        })
        .finally((res) => {
          this.dataLoading = false;
        });
    },
    changePager(v) {
      this.PageSize = v;
      this.pagerSerach();
    },
  },
  mounted() {
    this.pagerSerach(1);
    _getAllPublic().then((resp) => {
      this.publicChannels = resp;
    });
    _getDeliverChannel().then((resp) => {
      this.channels = resp;
    });
  },
};
</script>
