<template>
  <div v-loading="loading">
    <div class="heior_box">
      <el-button size="small" type="primary" icon="el-icon-plus" @click="showDialogDiscount=true">折扣价格</el-button>
      <!-- <div class="search-box">
        <el-input v-model="searchModel.keyWord" placeholder="请输入套餐名称/标题" clearable size="small">
          <el-button slot="append" icon="el-icon-search" @click="get"></el-button>
        </el-input>
      </div> -->
    </div>
    <div>
      <el-tabs tab-position="left" :style="$getStyleHeight(100)">
        <el-tab-pane :label="item.Product.Name" v-for="(item,index) in product" :key="index">
          <el-table
            :data="item.PackageUserPrices"
            row-key="Id"
            border
            size="medium"
            :height="$getHeight(100)"
          >
            <el-table-column prop="Package.Name" label="套餐名称"></el-table-column>           
            <el-table-column prop="Package.Price" label="原价格"></el-table-column>
            <el-table-column prop="UserPrice.price" label="会员价格">
              <template slot-scope="scope">
                {{scope.row.UserPrice.price||'--'}}
              </template></el-table-column>           
                 <el-table-column prop="UserPrice.refund" label="退款单价"></el-table-column>
            <!-- <el-table-column prop="UserPrice.Remark" label="说明"></el-table-column> -->
            <el-table-column prop="UserPrice.status" label="启用状态" width="100">
              <template slot-scope="scope">
                <el-switch
                  v-model="scope.row.UserPrice.status"
                  active-value="1"
                  inactive-value="0"
                  active-color="#13ce66"
                  inactive-color="#dcdfe6"
                  @change="changeStatus(scope.row)"
                ></el-switch>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <span class="handel cursor edit" @click="goEdit(scope.row)">编辑</span>              
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </div>
    <el-dialog title="会员价格" :visible.sync="showDialog" width="400px">
      <el-form
        :model="current"
        :rules="rules"
        ref="inputPackageForm"
        label-width="80px"
      >
        <el-form-item prop="Name" label="套餐名称">
          <el-input v-model="current.Name" size="small" disabled=""></el-input>
        </el-form-item>
        <el-form-item prop="Price" label="原价格">
          <el-input v-model="current.Price" type="number" size="small" disabled=""></el-input>
        </el-form-item>       
        <el-form-item prop="MinPrice" label="会员价格">
          <el-input v-model="current.UserPrice" type="number" size="small"></el-input>
        </el-form-item>
                <el-form-item prop="RefundDayPrice" label="退款单价">
          <el-input v-model="current.RefundDayPrice" type="number" size="small"></el-input>
        </el-form-item>
        <!-- <el-form-item prop="Remark" label="说明">
          <el-input v-model="current.Remark" size="small"></el-input>
        </el-form-item> -->
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="resetForm">取 消</el-button>
        <el-button type="primary" @click="save">确定</el-button>
      </span>
    </el-dialog>

        <el-dialog title="价格折扣" :visible.sync="showDialogDiscount" width="300px">
      <el-form
        :model="current"
        :rules="rules"
        ref="inputPackageForm"
        label-width="80px"
      >
        <el-form-item prop="Name" label="折扣方案">
         <el-select size="small" v-model="currentDiscount.schemeId">
            <el-option v-for="(item,index) in productDiscounts" :key="index" :label="item.Name" :value="item.Id"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showDialogDiscount=false">取 消</el-button>
        <el-button type="primary" @click="setDiscount">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  name: "treeTable",
  components: {},
  data() {
    return {
      loading: false,
      showDialog:false,
      showDialogDiscount:false,
      retData: { TotalCount: 0, Data: [] },
      searchModel: {
        PageIndex: 1,
        keyWord: ""
      },
      product:[],
      current: {
        Name:"",
        Remark:'',
        Price:0,
        UserPrice:0,
        UserId:0,
        PackageId:0,
        ProductId:0,
        RefundDayPrice:0,
      },
      rules:{},
      currentDiscount:{
        schemeId:null,
        userId:null,
      },
      productDiscounts:[]
    };
  },
  created() {
    this.$store.commit("setCurrentNav", "用户管理>>代理最低价");
    this.current.UserId=this.$route.query.id;
    this.currentDiscount.userId=this.$route.query.id;
    this.get();
    this.getProductDiscounts();
  },
  methods: {
    get() {
      this.$api.get(this.$api.phpURL + "agent/agent/price",{'userId':this.current.UserId}).then(res => {
          console.log(res)
        this.product = res.Data;
      });
    },    
    getProductDiscounts(){
         this.$api
        .get("course/v1/scheme/page")
        .then(res => {
          this.productDiscounts= res.Data;        
        });
    },
    goEdit(item) {
      console.log(item)
      this.showDialog = true;
      this.current.Name =item.Package.Name;
      this.current.Price =item.Package.Price;
      this.current.ProductId =item.Package.ProductId;
      this.current.PackageId =item.Package.Id;   
      this.current.UserPrice =item.UserPrice.UserPrice;       
      this.current.RefundDayPrice =item.UserPrice.RefundDayPrice;        
    },
    save() {
      this.$api
        .post(this.$api.phpURL + "agent/agent/setPrice", this.current)
        .then(res => {
          this.resetForm();
             this.get();         
        });
    },
    changeStatus(item) {
      this.$api
        .post(this.$api.phpURL + "agent/agent/setPriceStatus",item.UserPrice)
        .then(res => {
          item.Status = res.Data;
        });
    },
    setDiscount() {
      if(!this.currentDiscount.schemeId){
        this.$warn('请选择方案')
        return ;
      }
      this.$api
        .post(this.$api.phpURL + "agent/agent/setPriceDiscount",this.currentDiscount)
        .then(res => {
          this.showDialogDiscount=false;
           this.get();
        });
    },
    resetForm() {
      this.$refs["inputPackageForm"].resetFields();
      this.showDialog = false;
    }
  }
};
</script>
<style scoped>
</style>
