WXL
2025-01-17 8c79267eb478e2986c5293d3fb48f1c3da18c544
src/components/SFtable/index.vue
@@ -1,7 +1,14 @@
<!-- 表格组件封装 -->
<template>
  <el-table
    :data="currentList"
    ref="multipleTableson"
    :height="heights"
    :data="
      currentList.filter(
        (data) =>
          !search || data.name.toLowerCase().includes(search.toLowerCase())
      )
    "
    @selection-change="handleSelectionChange"
    :header-cell-style="{
      background: '#f3f6fb',
@@ -14,6 +21,7 @@
  >
    <el-table-column
      v-if="multiplechoice"
      fixed="left"
      type="selection"
      width="50"
      align="center"
@@ -25,7 +33,43 @@
      key="id"
      prop="id"
    />
    <el-table-column
    <div v-for="(item, index) in tableLabel">
      <el-table-column
        v-if="item.label == '出院日期'"
        :key="index"
        :prop="item.prop"
        :width="item.width"
        :label="item.label"
        :formatter="formatData"
      >
        <template slot-scope="scope">
          <span>{{ formatTime(scope.row.endtime) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="item.label == '性别'"
        :key="index"
        :prop="item.prop"
        :width="item.width"
        :label="item.label"
        :formatter="formatData"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.sex == 1 ? "男" : "女" }}</span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="item.label != '性别' && item.label != '出院日期'"
        :key="index"
        :prop="item.prop"
        :width="item.width"
        :label="item.label"
        :formatter="formatData"
      >
      </el-table-column>
    </div>
    <!-- <el-table-column
      v-for="(item, index) in tableLabel"
      :key="index"
      :prop="item.prop"
@@ -33,7 +77,7 @@
      :label="item.label"
      :formatter="formatData"
    >
    </el-table-column>
    </el-table-column> -->
    <!-- <el-table-column
      label="是否可用"
      align="center"
@@ -46,13 +90,45 @@
      </template>
    </el-table-column> -->
    <el-table-column
      v-if="center"
      v-if="center && !searchTrue"
      label="操作"
      fixed="right"
      align="center"
      width="120"
      class-name="small-padding fixed-width"
    >
      <template slot-scope="scope">
        <el-button
          v-if="controlxz"
          size="medium"
          type="text"
          @click.native="$emit('selectfn', scope.row, typeinfo)"
          ><span class="button-zx"
            ><i class="el-icon-s-promotion"></i>选择</span
          ></el-button
        >
        <el-button
          v-if="controlsc"
          size="medium"
          type="text"
          @click.native="$emit('details', scope.row, typeinfo)"
          ><span style="color: red"
            ><i class="el-icon-delete"></i>删除</span
          ></el-button
        >
      </template>
    </el-table-column>
    <el-table-column
      v-if="center && searchTrue"
      label="操作"
      fixed="right"
      align="right"
      width="200"
      class-name="small-padding fixed-width"
    >
      <template slot="header" slot-scope="scope">
        <el-input v-model="search" size="mini" placeholder="输入患者名称搜索" />
      </template>
      <template slot-scope="scope">
        <el-button
          v-if="controlxz"
@@ -89,6 +165,7 @@
      editabshape: [],
      qyoptions: [],
      precedencetype: [],
      search: "",
    };
  },
  props: {
@@ -120,10 +197,18 @@
      type: Boolean,
      default: true,
    },
    // 1模版列表 2选中患者 3患者列表
    // 1模板列表 2选中患者 3患者列表
    typeinfo: {
      type: Number,
      default: 1,
    },
    heights: {
      type: Number,
      default: 600,
    },
    searchTrue: {
      type: Boolean,
      default: false,
    },
  },
  created() {
@@ -156,8 +241,17 @@
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      console.log(selection);
      this.$emit("handleSelectionChange", selection);
    },
    toggleRowSelection(row, selected) {
      this.$refs.multipleTableson.toggleRowSelection(row, selected);
    },
    clearSelection() {
      // 在这里编写清除选择的逻辑
      this.$refs.multipleTableson.clearSelection();
    },
  },
};
</script>