<template>
  <!-- 手动下架 -->
  <el-dialog
    title="手动下架"
    width="35%"
    :visible.sync="OffShelfvisible"
    :before-close="close"
  >
    <div>下架原因</div>
    <div
      v-loading="loading"
      element-loading-text="加载中"
      element-loading-spinner="el-icon-loading"
    >
      <el-radio-group v-model="params.OffShelfStatus" style="margin: 10px 0">
        <el-radio
          :label="item.value"
          v-for="(item, index) in reasonList"
          :key="index"
          >{{ item.label }}</el-radio
        >
      </el-radio-group>
      <el-input
        v-model="params.otherReason"
        placeholder="请输入内容"
        v-if="params.OffShelfStatus == '3'"
      ></el-input>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="close">取 消</el-button>
      <el-button type="primary" @click="confirm">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { off_shelf_reason } from "@/api/providerList";
export default {
  props: ["OffShelfvisible"],
  data() {
    return {
      loading: true,
      params: {
        OffShelfStatus: "1",
        otherReason: "", //下架其他原因
      },
      reasonList: [],
    };
  },
  components: {},
  mounted() {
    this.getoffshelfreason();
  },
  methods: {
    //获取下架原因
    getoffshelfreason() {
      this.loading = true;
      off_shelf_reason().then((res) => {
        this.loading = false;
        this.reasonList = res.datas.off_shelf_type;
      });
    },
    // 确定
    confirm() {
      this.$emit("OffShelfconfirm", this.params);
    },
    // 关闭
    close() {
      this.$emit("OffShelfclose");
    },
  },
};
</script>

<style scoped lang='scss'>
::v-deep .el-dialog__body {
  padding-bottom: 0px !important;
}
.el-loading-mask {
  display: flex;
  align-items: center;
  justify-content: center;
}
.el-radio-group {
  min-height: 100px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
</style>