
<template>
  <div>
    <basicLayout 
      ref="basicLayout" 
      :oldFormPath="{
        add:'HDrpManagement/ProductMag/modules'
      }"
      tableName="productManageTable" 
      idName="itemid"
      ownertable="plm_item"
      :apiId="{query:20220923140602,del:20220923152202}"
      :options="options"
      @onFixedClick="rows"
      :specialKey="[{key:'itemclass',value:null},{key:'tradefield',value:null},{key:'brand',value:null}]"
      @checkboxCallBack="rows"
      :detailPath="{
        path:'/productmagDetail'
      }"
      >
      <template #titleRight>
        <to_examine v-if="tool.checkAuth($route.name,'toExamine')" class="inline-16" style="margin-left: 10px" :rowData="rowData" @examineSuccess="onSuccess" :disabled="rowData.length === 0"></to_examine>
        <counter_examine v-if="tool.checkAuth($route.name,'reverseReview')" class="inline-16" :rowData="rowData" @examineSuccess="onSuccess" :disabled="rowData.length === 0"></counter_examine>
        <priceLevelSetting class="inline-16" v-if="tool.checkAuth($route.name,'priceSet')" ></priceLevelSetting>
        <el-button class="inline-16" size="small" v-if="tool.checkAuth($route.name,'refreshStock')" type="primary" @click="refreshStock">刷新库存</el-button>
        <importFile 
          v-if="tool.checkAuth($route.name,'export')"
          ref="importFile" 
          class="inline-16" 
          :bindData="{ownertable:'plm_item',ownerid:$route.query.id,usetype:'default'}" 
          :errorUrl="errorUrl" 
          @clearUrl="errorUrl = null" 
          @onSuccess="bindImportOrder"
        ></importFile>
      </template>
      <template #custom>
        <div class="mt-10">
          <label  class="search__label" >是否上架:</label>
          <el-select class="inline-24" v-model="selectParam.isonsale" placeholder="请选择是否上架" @change="selectChange" size="small" clearable>
            <el-option
                v-for="item in isOnSaleData"
                :key="item.value"
                :label="item.label"
                :value="item.value">
            </el-option>
          </el-select>
        </div>
        <div class="mt-10">
          <label  class="search__label" >状态:</label>
          <el-select class="inline-24" v-model="selectParam.status" placeholder="请选择状态" @change="selectChange" size="small" clearable>
            <el-option
                v-for="item in statusData"
                :key="item.value"
                :label="item.value"
                :value="item.value">
            </el-option>
          </el-select>
        </div>
      </template>
      <template v-slot:tbList="scope">
        <div>
        <p :style="scope.data.column.data.isonsale === 1?'color:#52c41a':'color:red'" v-if="scope.data.column.columnname === 'isonsale'">
          {{ scope.data.column.data.isonsale ? '上架' : '下架' }}
        </p>
        <p v-else-if="scope.data.column.columnname === 'cover'">
          <previewImage v-if="scope.data.column.data.attinfos[0]" class="image" :image="scope.data.column.data.attinfos[0]" :list="scope.data.column.data.attinfos" :deletebtn="false"></previewImage>
        </p>
        <p v-else-if="scope.data.column.columnname === 'tradefield'">
          <span v-if="JSON.stringify(scope.data.column.data.tradefield) !== '[]' && scope.data.column.data.tradefield">
            <span v-for="item in scope.data.column.data.tradefield">
              <el-tag style="margin-right: 10px;margin-top: 5px;margin-bottom: 5px">{{item.tradefield}}</el-tag>
            </span>
          </span>
          <span v-else>

           </span>
        </p>
        <p v-else-if="scope.data.column.columnname === 'brand'">
          <span v-if="JSON.stringify(scope.data.column.data.brand) !== '[]' && scope.data.column.data.brand">
             <span v-for="item in scope.data.column.data.brand">
               <el-tag style="margin-right: 10px;margin-top: 5px;margin-bottom: 5px" type="warning">{{item.brandname}}</el-tag>
            </span>
          </span>
         <span v-else>

         </span>
        </p>
        <p v-else-if="scope.data.column.columnname === 'itemclass'">
        <span v-if="JSON.stringify(scope.data.column.data.itemclass) !== '[]' && scope.data.column.data.itemclass">
           <span v-for="item in scope.data.column.data.itemclass" :key="item.index">
             <el-tag style="margin-right: 10px;margin-top: 5px;margin-bottom: 5px" type="success">{{item.itemclassfullname}}</el-tag>
          </span>
        </span>
          <span v-else>

       </span>
        </p>
        <p v-else-if="scope.data.column.columnname === 'istool'">
          {{scope.data.column.data[[scope.data.column.columnname]] === 0?'否':'是'}}
        </p>
        <p v-else-if="scope.data.column.columnname === 'status'">
          <span style="color:#52C41A" v-if="scope.data.column.data[[scope.data.column.columnname]] == '审核'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
          <span style="color:#000000" v-else-if="scope.data.column.data[[scope.data.column.columnname]] == '新建'">{{scope.data.column.data[[scope.data.column.columnname]]}}</span>
        </p>
        <p v-else>{{scope.data.column.data[[scope.data.column.columnname]]}}</p>
        </div>
      </template>
      <!-- <template v-slot:tbOpreation="scope">
       <editTemp :data="scope.data.data"></editTemp>
      </template> -->
    </basicLayout>
  </div>
</template>

<script>
/**
 * @basicLayout 提供this.$ref['basicLayout'].listData()方法查询列表信息
 * @param {string} formPath 新建,编辑组件所在文件夹名称,以后所有列表新增修改文件统一放入Form文件夹下面,并创建与开发应用相同的名称的子文件夹
 * @param {string} tableName 开发端配置的表格名称
 * @param {String} idName 数据主id名称
 * @param {object} apiId:{query:查询的接口id,del:删除的接口id} 
 * @param {Array} options:{label:描述,value:值} 
 */
import previewImage from '@/components/previewImage/index'
import editTemp from './modules/edit.vue'
import to_examine from './modules/toExamine'
import counter_examine from './modules/counterExamine'
import priceLevelSetting from './modules/priceLevelSetting'
import importFile from './modules/importFile.vue'
import { Loading } from 'element-ui';

export default {
  data () {
    return {
      options:[],
      isOnSaleData:[
        {
          value:0,
          label:'否'
        },
        {
          value:1,
          label:'是'
        }
      ],
      statusData:[
        {
          value:'新建',
          label:'新建'
        },
        {
          value:'审核',
          label:'审核'
        }
      ],
      selectParam:{
        isonsale:'',
        status:''
      },
      rowData:[],
      errorUrl:null
    }
  },
  components:{
    previewImage,
    editTemp,
    to_examine,
    counter_examine,
    priceLevelSetting,
    importFile
  },
  methods:{
    async isOnSaleChange(val){
      if (val.isonsale) {
        if(!this.tool.checkAuth(this.$route.name,'isTop')) {
          return this.$message({
            title:'提示',
            message:'暂无上架权限',
            type:'warning'
          })
        }
      }
      if (!val.isonsale) {
        if(!this.tool.checkAuth(this.$route.name,'isBottom')) {
          return this.$message({
            title:'提示',
            message:'暂无下架权限',
            type:'warning'
          })
        }
      }
      const res = await this.$api.requested({
        "id": 20220923154802,
        "content": {
          "itemids": [val.itemid],
          "isonsale": val.isonsale//0：下架，1：上架
        },
      })
      this.$refs.basicLayout.listData()
      this.tool.showMessage(res,()=>{

      })

    },
    async bindImportOrder (id) {
      const res = await this.$api.requested({
        "id": 20230311111404,
        "content": {
        "attachmentid":id
        }
      })
      if (res.data !== '成功') {
        this.errorUrl = res.data
      }
      this.tool.showMessage(res,() => {
        this.$refs.basicLayout.listData()
      })
    },
    selectChange(){
      this.$refs.basicLayout.param.content.where = this.selectParam
      this.$refs.basicLayout.listData()
    },
    onSuccess(){
      this.$refs.basicLayout.listData()
    },
    rows(val){
      console.log("点击")
      console.log(val)
      this.rowData = val
    },
    async refreshStock () {
      Loading.service({ fullscreen: true ,text:'刷新中...'});
      const res = await this.$api.requested({
        "id": "20230222203703",
        "version":1,
        "content": {
        }
      })
      Loading.service().close()
      this.$message({
        message:'刷新成功',
        type:"success"
      })
    }
  }
}

</script>
<style>
</style>
<style scoped>
.image{
  height: 38px;
  width: 38px;
  margin-top:0;
}
</style>