

<script>
/* eslint-disable */
// sd-skip-auto-import
import components from"./_import-components/sd-table-modal-import";var _render=function e(){var t=this,s=t._self._c;return s("a-modal",{attrs:{"destroy-on-close":"",width:1e3,title:t.title},model:{value:t.visible,callback:function(e){t.visible=e},expression:"visible"}},[s("template",{slot:"footer"},[s("a-button",{on:{click:function(e){t.visible=false}}},[t._v("退出")])],1),s("div",{class:t.$style.header},[s("a-space",[s("a-button",{attrs:{disabled:0===t.selectedRowKeys.length},on:{click:function(e){return t.remove(t.selectedRowKeys)}}},[t._v(" 删除 ")]),s("a-button",{attrs:{type:"primary"},on:{click:t.add}},[t._v(" 新建 ")])],1)],1),s("sd-table",{class:t.$style.table,attrs:{"row-selection":{onChange:t.onSelectChange,selectedRowKeys:t.selectedRowKeys},columns:t.formatColumns,"data-source":t.dataSource,sortable:true,pagination:false,"row-key":(e,t)=>t},on:{"update:data-source":e=>t.$emit("change",e)}})],2)};var staticRenderFns=[];_render._withStripped=true;export default{name:"SdTableModal",components:components,props:{dataSource:{type:Array,default:()=>[]},title:{type:String,default:""},columns:{type:Array,default:()=>[]}},data(){return{visible:false,selectedRowKeys:[]}},computed:{formatColumns(){return this.columns.map((e=>{if(e.sdClickable)e.customCell=(t,s)=>({class:this.$style.clickableCell,attrs:{title:t[e.dataIndex]},on:{click:()=>{this.$emit("rowClick",t,{rowIndex:s,column:e})}}});return e}))}},methods:{show(){this.visible=true},onSelectChange(e){this.selectedRowKeys=e},add(){this.$emit("add")},edit(e){this.$emit("edit",e)},remove(e){const t=e.sort(((e,t)=>t-e));t.forEach((e=>{this.dataSource.splice(e,1)}));this.selectedRowKeys=[];this.$emit("change",this.dataSource)}},render:_render,staticRenderFns:staticRenderFns};</script>

<style module lang="scss">
@use '@/common/design' as *;
.header {
  position: relative;
  width: 100%;
  min-height: 40px;
  margin: 3px 0;
  text-align: right;
}
.table {
  :global(.ant-table-tbody) {
    .clickable-cell {
      color: $primary-color;
      cursor: pointer;
      &:hover {
        color: $primary-5;
      }
      &:active {
        color: $primary-7;
      }
    }
  }
}
</style>
