<template>
    <div>
      <el-dialog width="60%" :visible.sync="dialogVisible" :title="query.conName" top="5vh">
        <div class="app-container">
          <!-- <div class="head-container">
            <el-form :model="query" inline>
              <el-form-item>
                <el-input v-model="query.conName" placeholder="耗材信息名称" />
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="getTableData">查询</el-button>
                <el-button @click="resetHandle">重置</el-button>
              </el-form-item>
            </el-form>
          </div> -->
          <div class="head-container">
            <el-table
              ref="table"
              :data="clickseetableData.data"
              v-loading="clickseetableData.loading"
              row-key="id"
              height="50vh"
            >
              <el-table-column label="耗材名称" prop="conName" />
              <el-table-column label="变动库存" prop="amount">
                <template v-slot="scope">
                  <span :class="{ red: scope.row.bizType == '-' }"
                    >{{ scope.row.bizType }}{{ scope.row.amount }}</span
                  >
                </template>
              </el-table-column>
              <el-table-column label="现有库存" prop="balance" />
              <el-table-column label="业务说明" prop="bizName" />
              <el-table-column label="商品名称" prop="productName" />
              <el-table-column label="订单编号" >
                <template v-slot="scope">
                  <a class="cursor-pointer" @click="toOrderList(scope.row)">{{ scope.row.orderNo||'' }}</a>
                </template>
              </el-table-column>
              <el-table-column
                label="创建时间"
                prop="createTime"
              ></el-table-column>
            </el-table>
          </div>
        </div>
      </el-dialog>
  
  
    </div>
  </template>
    
    <script>
    
  export default {
    data() {
      return {
        query: {
          conName: "",
          consId:''
        },
        dialogVisible:false,
        clickseetableData: {
          data: [],
          page: 0,
          size: 10,
          loading: false,
          total: 0,
        },
      };
    },
    mounted() {
    },
    methods: {
      open(data){
        console.log(data)
          this.dialogVisible = true;
          this.clickseetableData=data
      },
      close(){
          this.dialogVisible = false;
      },
      lookDetail(row) {
        console.log(row);
      },
      resetHandle() {
      },
      pageSizeChange(e) {
      },
      paginationChangetype(e) {
      }
    }
  };
  </script>
    <style scoped>
    .head-container{
    max-height: 60vh;
    overflow-y: scroll;
}
  .cursor-pointer{
    cursor: pointer;
    color: #1890ff;
    transition: all 0.3s;
  }
  .cursor-pointer:hover{
    opacity: .7;
  }
  
  </style>