<template>
  <div class="content-main">
    <div class="search-bm-boder">
      <el-row>
        <el-form
          :inline="true"
          ref="formInline"
          :model="formInline"
          class="demo-form-inline search-form"
        >
          <el-form-item
            label="手续费率:"
            prop="sxfl"
            :rules="{
              required: true,
              message: '请输入手续费率',
              trigger: 'change',
            }"
          >
            <el-input
              class="inputCompatible"
              clearable
              v-model="formInline.sxfl"
              placeholder="请输入手续费率"
              oninput="this.value= this.value.replace(/[^\d.]/g, '').replace(/(\d+\.\d{1,2})\.?\d*/, '$1')"
            ></el-input>
          </el-form-item>
          <el-form-item
            label="适用粮食性质:"
            prop="clxzbm"
            :rules="{
              required: true,
              message: '请选择适用粮食性质',
              trigger: 'change',
            }"
          >
            <el-select
              clearable
              v-model="formInline.clxzbm"
              class="addFormInputWidth"
            >
              <el-option
                v-for="item in lsxzList"
                :key="item.dictCode"
                :label="item.dictName"
                :value="item.dictCode"
              ></el-option>
            </el-select>
          </el-form-item>
          <div class="search-button">
            <span class="search-line"></span>
            <el-button
              type="primary"
              size="small"
              class="iconfont iconzanxun"
              @click="save"
              >新增</el-button
            >
            <el-button
              type="primary"
              @click="resetInfo('formInline')"
              size="small"
              class="iconfont iconzhongzhi"
              >重置</el-button
            >
          </div>
        </el-form>
      </el-row>
    </div>
    <el-row>
      <el-table
        :data="tableData"
        stripe
        v-loading="listLoading"
        border
        fit
        highlight-current-row
        style="width: 100%"
      >
        <el-table-column align="center" label="序号" width="70">
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          align="center"
          prop="sxfl"
          label="手续费率"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="clxzmc"
          label="适用粮食性质"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="refreshTime"
          label="更新时间"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="refresher"
          label="操作人员"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="fbztmc"
          label="状态"
        ></el-table-column>
        <el-table-column align="center" label="操作" width="200">
          <template slot-scope="scope">
            <el-tooltip
              class="item"
              effect="light"
              content="应用"
              v-if="buttonNameList.indexOf('应用') > -1 && scope.row.fbzt == 0"
            >
              <el-button
                type="primary"
                class="operate_show_btn iconfont icontongyi"
                @click="handleDetail(scope.row, 1)"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="禁用"
              v-if="buttonNameList.indexOf('禁用') > -1 && scope.row.fbzt == 1"
            >
              <el-button
                type="primary"
                class="operate_delete_btn iconfont iconquxiao"
                @click="handleDetail(scope.row, 0)"
              ></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <el-row>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="pageForm.page"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="pageForm.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pageForm.total"
      ></el-pagination>
    </el-row>
  </div>
</template>

<script>
import {
  selectFeeRatePageList,
  insertFeeRate,
  updateFeeRate,
  findByPid,
} from "@/api/transaction/registrationFee/feeMaintain/index";
import { getCodeName } from "@/utils/statusList.js";
import { authorityControl } from "@/api/menuList";
export default {
  // components: {},
  // name: 'userInfo',
  data() {
    return {
      listLoading: false,
      formInline: {
        clxzbm: null,
        sxfl: null,
      },
      pageForm: {
        page: 1,
        size: 10,
        total: 0,
      },
      tableData: [],
      lsxzList: [],
      buttonNameList: [],
    };
  },
  methods: {
    getresourceCode() {
      let codeData = {
        resourceCode: sessionStorage.getItem("resourceCode"),
        userId: sessionStorage.getItem("userCode"),
      };
      authorityControl(codeData).then((res) => {
        this.buttonNameList = [];
        res.data.forEach((item) => {
          this.buttonNameList.push(item.resourceName);
        });
        this.getList("start");
      });
    },
    getList(type) {
      if (type != "start") {
        //非初始化调用：查询、分页
        sessionStorage.setItem("searchData", JSON.stringify(this.formInline));
        sessionStorage.setItem("pageData", JSON.stringify(this.pageForm));
      } else {
        //初始化分两种情况，详情页等返回后的初始化，以及第一次进入此菜单的初始化
        if (JSON.parse(sessionStorage.getItem("searchData"))) {
          //详情页返回后，将对应查询条件和分页的字段赋值，页面回显参数
          this.formInline = JSON.parse(sessionStorage.getItem("searchData"));
          this.pageForm = JSON.parse(sessionStorage.getItem("pageData"));
        } else {
          //第一次进去此菜单时，保存上方默认的data
          sessionStorage.setItem("searchData", JSON.stringify(this.formInline));
          sessionStorage.setItem("pageData", JSON.stringify(this.pageForm));
        }
      }
      let data = {
        pageNum: this.pageForm.page,
        pageSize: this.pageForm.size,
      };
      selectFeeRatePageList(data).then((res) => {
        if (res.infoCode == 200) {
          this.tableData = res.data.items;
          this.pageForm.total = res.data.total;
          this.tableData.map((item) => {
            if (!item.fbztmc) {
              item.fbztmc = "已禁用";
            }
          });
        }
      });
    },
    save() {
      this.$refs.formInline.validate((valid) => {
        if (valid) {
          let data = {
            fbzt: 1,
            fbztmc: "应用中",
            sxfl: this.formInline.sxfl,
            clxzbm: this.formInline.clxzbm,
            clxzmc: getCodeName(
              this.formInline.clxzbm,
              this.lsxzList,
              "dictCode",
              "dictName"
            ),
          };
          insertFeeRate(data).then((res) => {
            if (res.infoCode == 200) {
              this.$message({
                message: "保存成功",
                type: "success",
              });
              this.getList();
              this.$refs.formInline.resetFields();
            } else {
              this.$message({
                message: res.msg,
                type: "warning",
              });
            }
          });
        } else {
          this.$message.warning("请先完成必填项!");
        }
      });
    },
    resetInfo(formName) {
      this.$refs[formName].resetFields();
      this.getList();
    },
    handleDetail(row, state) {
      if (state == 0) {
        let data = {
          flbm: row.flbm,
          fbzt: 0,
          fbztmc: "禁用中",
          clxzbm: row.clxzbm,
        };
        updateFeeRate(data).then((res) => {
          if (res.infoCode == 200) {
            this.$message({
              message: "操作成功",
              type: "success",
            });
            this.getList();
          }
        });
      } else {
        let data = {
          flbm: row.flbm,
          fbzt: 1,
          fbztmc: "应用中",
          clxzbm: row.clxzbm,
        };
        updateFeeRate(data).then((res) => {
          if (res.infoCode == 200) {
            this.$message({
              message: "操作成功",
              type: "success",
            });
            this.getList();
          }
        });
      }
    },
    handleSizeChange(val) {
      this.pageForm.size = val;
      this.getList();
    },
    handleCurrentChange(val) {
      this.pageForm.page = val;
      this.getList();
    },
  },
  created() {
    this.getresourceCode();
  },
  beforeCreate() {
    findByPid("LSXZ").then((res) => {
      this.lsxzList = res.data;
    });
  },
  mounted() {},
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.line {
  border-bottom: 1px solid #000;
}
.title {
  margin-bottom: 20px;
  text-align: center;
  font-size: 16px;
}
.text {
  text-align: center;
}
</style>
<style>
#nibansealpostion {
  position: relative;
}
#websignPlan {
  left: 100px !important;
  top: -100px !important;
}
</style>
