<template>
<!-- 分析项目新增 -->
  <div class="examination">
    <el-dialog :close-on-click-modal='false' @close="testCancel" width='80%' :visible.sync="testShow" customClass="boxWidth33">
        <div slot="title" class="titleBox">
        <i class='el-icon-document' style="font-size: 20px"></i>
        <span style="margin-left:10px;font-size:18px">新增分析项目</span>
        </div>
        <el-row>
          <el-col :span='12'>
            <div>
                <div class="common-title-name">
                    <img style="width: 25px; height: 25px; margin-left: 20px" src='../../../../assets/img/imgScreen/logo.png' />
                     分析项目
                    <el-input v-model="testItemName2" size="small" placeholder="请输入查询内容" @keyup.enter.native="getDataLists2()" style="width: 150px"></el-input>
                </div>
                <div class="common-table-div">
                     <el-table v-loading="taskDataLoading" ref="dataTable" border :height="heightTop" highlight-current-row :data="table.listTests"
                     :header-cell-style="tableHeaderCellStyle" :icore-filter-flag="icoreFilterFlag">
                      <el-table-column type="index" label="NO" align="center"></el-table-column>
                      <el-table-column label="操作" width="50">
                          <template slot-scope="{row}">
                              <el-button type="text" style="padding:0"  @click="rightData2(row)">右移</el-button>
                          </template>
                      </el-table-column>
                      <el-table-column min-width="120px" :show-overflow-tooltip="true" sortable prop="anlyItemName" label="分析项目名称" align="center"></el-table-column>
                      <el-table-column min-width="120px" :show-overflow-tooltip="true" sortable prop="reviseRuleName" label="修约规则" align="center"></el-table-column>
                     </el-table>
                </div>
                <div style="margin-top: 20px; margin-left: 10px">
                    <el-pagination  @size-change="SizeTest" @current-change="pageChangeTest"
                      :current-page="pageTests.pageNum" :page-sizes="[10, 20, 50, 100, 200]" :page-size="pageTests.pageSize" layout="total, sizes, prev, pager, next"
                      :total="pageTests.totalPage" background>
                    </el-pagination>
                </div>
            </div>
          </el-col>
          <el-col :span='12'>
            <div>
                <div class="common-title-name">
                  <img style="width: 25px; height: 25px; margin-left: 20px" src='../../../../assets/img/imgScreen/logo.png' />
                    选择任务
                </div>
                <div class="common-table-div">
                     <el-table v-loading="dataLoading2" ref="dataTable2" border :height="heightTop" :data="table.addTest"
                     :header-cell-style="tableHeaderCellStyle">
                      <el-table-column type="index" label="NO" align="center"></el-table-column>
                      <el-table-column label="操作" width="120px">
                        <template slot-scope="scope">
                          <el-button type="text" style="padding:0" :disabled="scope.$index == 0" @click="moveUpward(scope.row, scope.$index)">上移</el-button>
                          <el-button type="text" style="padding:0" :disabled="(scope.$index + 1) == table.addTest.length" @click="moveDown(scope.row, scope.$index)">下移</el-button>
                          <el-button type="text" style="padding:0"  @click="leftData2(scope.$index,scope.row)">删除</el-button>
                        </template>
                      </el-table-column>
                      <el-table-column min-width="120px"  :show-overflow-tooltip="true" prop="anlyItemName" label="分析项目名称" align="center"></el-table-column>
                      <el-table-column min-width="120px"  :show-overflow-tooltip="true" prop="reviseRuleName" label="修约规则" align="center"></el-table-column>
                     </el-table>
                </div>
            </div>
          </el-col>
        </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button type="goon" size="mini" icon="el-icon-check" :loading='addtestLoading' @click="addtestData()">确定</el-button>
        <el-button size="mini" type="goon" icon="el-icon-remove-outline" @click="testCancel">取消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { getCookie } from "@/utils/util.js";
import { cookieUserId, cookieUserName } from "@/config/config.js";
let userName = getCookie(cookieUserName);
let userId = getCookie(cookieUserId);
export default {
  props: ["showFlag", "Params"],
  data() {
    return {
      testShow: false,
      taskDataLoading:false,
      icoreFilterFlag: true,
      addtestLoading:false,
      dataLoading2:false,
      testItemName2:'',
      heightTop:0,
      stId:'',
      pageTests: {
        pageSize: 50,
        pageNum: 1,
        totalPage: 0
      },
      table:{
        addTest:[],
        listTests:[],
      },
      addList:[]
    };
  },
  created(){
    this.heightTop = window.innerHeight/2 - 130 < 249 ? 249 : window.innerHeight/2 - 130
  },
  mounted() {
    this.getDataLists2()
  },
  methods: {
    testCancel(){
      this.table.addTest = []
      this.addList = []
      this.testShow = false
      this.addtestLoading = false
    },
    //新增确定操作
    addtestData(){
      if (this.table.addTest.length < 1) {
        this.$message.warning('请先移动数据到右边的表格中')
        return
      } 
      this.table.addTest.forEach(item =>{
        item.dspOrder = null
        item.stIdD = null
      })
      this.addtestLoading = true
      this.axios.post('pass/testManagement/v1/limssampletestds/batchaddLimsSampleTestD/'+this.stId, this.table.addTest, {individualType: 'json'}).then(res => {
        if (res.succeed) {
          this.$message.success("新增成功")
          this.testShow = false
          this.$emit('refresh')
        } else {
         this.$message.error(res.message)
        }
        this.addtestLoading = false
      }).catch(e => {
        this.addtestLoading = false
        this.$message.error(e.message)
      })
    },
    getDataLists2() {
      this.pageTests.pageNum = 1
      this.getDataListTest2()
    },
    getDataListTest2 () {
      let obj = {
        object:{
          validFlag:1,
          anlyItemName:this.testItemName2
        },
        pageIndex:this.pageTests.pageNum,
        pageSize:this.pageTests.pageSize
      }
      this.taskDataLoading = true;
      this.axios.post('pass/baseManagement/v1/limsstdanlyitems/queryLimsStdAnlyItemPage',obj,{individualType: 'json'}).then(res => {
        this.taskDataLoading = false;
        this.table.listTests = res.data.list;
        this.pageTests.totalPage = res.data.total;
      }).catch(e => {
        this.taskDataLoading = false;
      });
    },
    //表格数据右移
    rightData2 (row) {
      //新增的数据清空id
      row.cretNoD = ''
      row.createMan = ''
      row.createNo = ''
      row.createTime = ''
      row.updateNo = ''
      row.updateMan = ''
      row.updateTime = ''
      this.table.addTest.push(row)
    },
    //删除表格数据
    leftData2 (index,row) { 
      if (row.cretNoD) {
         this.$message.warning('不可删除原有数据！')
         return false
      }
      this.table.addTest.splice(index, 1);
    },
    //上移
    moveUpward(row, index) {
      if (index > 0) {
          let upData = this.table.addTest[index - 1];
          this.table.addTest.splice(index - 1, 1);
          this.table.addTest.splice(index, 0, upData);
      } else {
        this.$message({message: '已经是第一条，上移失败',type: 'warning'});
      }
    },
    //下移
    moveDown(row, index) {
      if ((index + 1) == this.table.addTest.length) {
          this.$message({message: '已经是最后一条，下移失败',type: 'warning' });
      } else {
          let downData = this.table.addTest[index + 1];
          this.table.addTest.splice(index + 1, 1);
          this.table.addTest.splice(index, 0, downData);
      }
    },
    SizeTest (size) {
      this.pageTests.pageSize = size;
      this.getDataListTest2();
    },
    pageChangeTest (index) {
      this.pageTests.pageNum = index;
      this.getDataListTest2();
    },
    tableHeaderCellStyle () {
      return 'background-color: rgb(249,249,249) !important;color: rgb(73, 72, 72);border-bottom: 1px solid #DCDFE7;border-top:3px solid #3ac1ea;'
    }
  },
  watch: {
    showFlag(arg) {
      this.testShow = true;
      this.stId = this.Params.stId
    },
  },
};
</script>
<style lang="less">
.customWidth_test {
  width: 1000px !important;
}
</style>
