<template>
  <div>
    <basicLayout 
      ref="basicLayout" 
      formPath="projectManage"
      tableName="projectStageTable"
      idName="sa_projstagemagid"
      :apiId="{query:20221128143604,del:20221128143704}"
      :options="options"
      >
      <div slot="custom">
<!--        <label  class="search__label" style="margin: auto;width: 70px;">项目类型:</label>
        <el-select class="inline-24" v-model="selectParam.projecttype" placeholder="请选择项目类型" @change="selectChange" size="small" clearable>
          <el-option
              v-for="item in projectType"
              :key="item.value"
              :label="item.value"
              :value="item.value">
          </el-option>
        </el-select>
        <label  class="search__label" style="margin: auto;width: 70px;">是否启用:</label>
        <el-select class="inline-24" v-model="selectParam.isused" placeholder="请选择项目类型" @change="selectChange" size="small" clearable>
          <el-option
              v-for="item in isUsedList"
              :key="item.value"
              :label="item.label"
              :value="item.value">
          </el-option>
        </el-select>
        <label class="search__label" style="margin: auto;width: 65px;">创建时间:</label>
        <el-date-picker
            style="margin-right: 24px !important;"
            size="small"
            @change="selectChange"
            value-format="yyyy-MM-dd"
            v-model="dateSelect"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            clearable>
        </el-date-picker>-->
      </div>
      <template v-slot:tbList="scope">
        <div v-if="scope.data.column.columnname === 'isorder'">
          <span v-if="scope.data.column.data[scope.data.column.columnname] === 1">是</span>
          <span v-else>否</span>
        </div>
        <div v-else-if="scope.data.column.columnname === 'isused'">
          <span v-if="scope.data.column.data[scope.data.column.columnname] === 1">是</span>
          <span v-else>否</span>
        </div>
        <div v-else-if="scope.data.column.columnname === 'locked'">
          <span v-if="scope.data.column.data[scope.data.column.columnname] === 1">是</span>
          <span v-else>否</span>
        </div>
        <div v-else>
          {{scope.data.column.data[[scope.data.column.columnname]]}}
        </div>
      </template>
      <template v-slot:tbOpreation="scope">
        <stage-detail class="inline-16" :data="scope.data.data" @onSuccess="onSuccess"/>
<!--        <delete-btn v-if="tool.checkAuth($route.name,'delete')" :id="scope.data.data.sa_projstagetempid" @deleteSuccess="$refs.basicLayout.listData()" nameId="20221019085804" nameKey="sa_projstagetempids"/>-->
      </template>
    </basicLayout>
  </div>
</template>

<script>
import stageDetail from './detail/index'
export default {
  components:{stageDetail},
  name: "index",
  projectType:() => this.projectType,
  data() {
    return {
      options:[],
      projectType:'',
      isUsedList:[
        {
          value:'1',
          label:'是'
        },
        {
          value:'0',
          label:'否'
        }
      ],
      dateSelect:'',
      selectParam: {
        projecttype:'',
        isused:'',
        begindate:'',
        enddate:'',
      },
    }
  },
  created() {
    this.getSysetms()
  },
  methods:{
    async getSysetms () {
      /* 获取项目类型 */
      let res = await this.$store.dispatch('optiontypeselect','projecttype')
      this.projectType = res.data
    },
    onSuccess(){
      this.$refs.basicLayout.listData()
    },
    selectChange(){
      if (this.dateSelect !== '' && this.dateSelect !== null){
        this.selectParam.begindate = this.dateSelect[0]
        this.selectParam.enddate = this.dateSelect[1]
      }else {
        this.selectParam.begindate = ''
        this.selectParam.enddate = ''
      }
      this.$refs.basicLayout.param.content.where = this.selectParam
      this.$refs.basicLayout.listData()
    }
  }
}
</script>

<style scoped>

</style>