<template>
  <div class="releaseManage">
     <div class="search">
            <el-input placeholder="请输入版本号" class="search-input" v-model.trim="mixins_query.verId"></el-input>
             <el-select clearable class="servertype-serch" v-model="mixins_query.productType" placeholder="请选择产品类型">
                <el-option v-for="(item) in versionTypeList" :key="item.value" :label="item.value" :value="item.label">{{
                    item.value
                }}</el-option>
            </el-select> 
            <el-button class="search-btn" type="primary"  @click="getVersionList"><i class="iconfont">&#xe6fc;</i>查询</el-button>
           <div class="search-icon">
                <!-- 删除  -->
                <i  class="iconfont fr-fs-fc" @click="deleteVersion" v-txt-tip data-txt="删除">&#xe63b;</i>
                <!-- 新增 -->
                <i  class="iconfont fr-fs-fc" @click="addOrEdit" v-left-txt-tip data-txt="新增">&#xe641;</i>
            </div>
      </div>
      <!-- 表格 -->
        <div class="device-manage-table">
            <zz-table
                :cols="cols"
                :settings="{ showCheckbox: true, showIndex: true}"
                :data="mixins_list"
                :pageset="mixins_pageset"
                @selection-change="handleSelectionChange"
                @page-change="pageChange"
            >
            <template slot-scope="scope" slot="opt">
                <div class="opt">
                    <i @click="addOrEdit('edit',scope.row)" class="iconfont"  v-txt-tip data-txt="修改">&#xe645;</i>
                    <i @click="deleteVersion(scope.row)" class="iconfont" style="color: #ff7272" v-txt-tip data-txt="删除">&#xe63a;</i>
                </div>
                </template>
            </zz-table>
        </div>
  </div>
  
</template>

<script>
import list from '@utils/list.js';
export default {
  mixins: [list],
  data() {
    return {
      mixins_query:{
        
      },
      selectDelectCheckbox:'',
      versionTypeList: [],
      cols: [
                {
                    label: '产品类型',
                    prop: 'productTypeName'
                },
                {
                    label: '当前版本',
                    prop: 'curAppVer'
                },
                {
                    label: '强制升级版本',
                    prop: 'forcedUpgradeVer'
                },
                {
                    label: '手机系统',
                    prop: 'mobileOS'
                },
                {
                    label: '是否最新版本',
                    prop: 'isNewestVer',
                    format(val) {
                        if (val === 0) {
                            return '否';
                        } else if (val === 1) {
                            return '是';
                        }
                    }
                },
                {
                    label:'是否强制升级',
                    prop:'isForcedUpgrade',
                    format(val) {
                        if (val === 0) {
                            return '否';
                        } else if (val === 1) {
                            return '是';
                        }
                    }
                },
                {
                    label: '更新内容',
                    prop: 'remark'
                },
                {
                    label: '操作',
                    prop: 'opt',
                    slot: 'opt'
                }
            ],
    }

  },
  methods: {
    handleSelectionChange(val) {
          this.selectDelectCheckbox = val;
          // this.selectSubmitCheckbox = val;
      },
    addOrEdit(tip, item) {
            let row = {},
                title = '添加版本';
            new Promise((resolve) => {
                if (tip === 'edit') {
                    title = '修改版本';
                    row = item;
                    resolve();
                } else {
                    resolve();
                }
            }).then(() => {
                new Promise((resolve) => {
                    // console.log("item的值",item)
                    this.$store.dispatch('openModal', {
                        url: '/sysManage/appVersionManage/popups/addAppVersionManage.vue',
                        width: '680px',
                        height: '662px',
                        props: {
                            data: row,
                            todo: tip,
                            callback: resolve
                        },
                        title: title,
                        confirmButtonText:'保存'
                    });
                }).then(() => {
                    this.mixins_search();
                });
            });
    },
    getVersionList() {
      this.mixins_dataUrl = '/sc-user-center/verManage/findVerManage';
      this.mixins_pageset = {
          pageNum: this.mixins_pageset.pageNum,
          pageSize: this.mixins_pageset.pageSize
      };
      this.mixins_post = 'get';
      this.mixins_search();
    },
    getProductType() {
        this.$http.post('/sc-user-center/dict/selectList', { parentDictCode: 'SYSTEM_PRODUCT_TYPE' }).then(({ status, data, msg}) => {
          if(0 === status) {
            console.log(data);
              let datas = [];
              datas = data.map((item, index) => ({
                  label: parseInt(item.dictCode),
                  value: item.dictValue
              }))
              this.versionTypeList = datas;
          }
      })
    },
    //删除、批量删除
        deleteVersion(item) {
            let ids = [];
            if (item.id) {
                ids.push(item.id);
            } else {
                if (!this.selectDelectCheckbox.length) {
                    this.$message.error('您尚未选择要删除的记录，请选择后再操作批量删除');
                    return;
                }
                this.selectDelectCheckbox.forEach((v) => {
                    ids.push(v.id);
                });
            }
            this.$msgBox(`确定要删除?`, '删除后将无法恢复，是否继续？').then(() => {
            this.$http.delete('/sc-user-center/verManage/deleteVerManage', { ids: ids.join(',') }).then(({ status, data, msg }) => {
                if (status === 0) {
                    this.$message.success('删除成功');
                    this.mixins_search();
                } else {
                    this.$message.error(msg);
                }
            });
            });
        },
  },
  created() {
    this.getProductType();
    this.getVersionList();
  },
}
</script>

<style lang="scss" scoped>

.search {
    width: 100%;
    height: .6rem;
    margin-bottom: .2rem;
    background: #fff;
    padding: .15rem .2rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: .06rem;
}


.search-icon{
    vertical-align: top;
    float: right;
	.fr-fs-fc:first-child{
		margin-right: 20px;
	}
    
}

.search .search-btn {
    height: .3rem;
    border-radius: .04rem;
    padding: .09rem .08rem;
    box-sizing: border-box;
    line-height: .1rem;
}
\deep\ .ael-form-item__content{
    width:3.5rem;
}

</style>