<template><div><button-dialog@open="open"ref="dialog"width="1000px"title="内容关联"ok-button-text="确认关联":destroy-on-close="true"@ok="confirmAssociation"><!----><custom-table@size-changes="list"  @pagination-change="list"ref="table":data="tableData":columns="columns":pagination="pagination"@selection-change="handleSelect"><template v-slot:action><el-table-column fixed="right" label="操作" width="100"><template slot-scope="scope"><el-button type="text" @click="handleContentPreview(scope.row)">内容预览</el-button></template></el-table-column></template></custom-table></button-dialog><content-list ref="assot"></content-list></div>
</template><script>
import ContentList from "@/views/task/task/Components/ContentList";
import CustomTable from "@/component/table/CustomTable";
import ButtonDialog from "@/component/dialog/ButtonDialog";
import {TableListMixin} from "@/component/table/TableMixin";
import {getAction, putAction} from "../../../api";
export default {name: "ContentAssociation",mixins: [TableListMixin],components: {ButtonDialog, CustomTable,ContentList},data() {return {columns: [{type: "selection", width: "50"},/*任务名称id*/{prop: "id", label: "ID", width: "100", sortable: true},/*内容名称 name*/{prop: "title", label: "内容名称", sortable: true},/*内容类型 1是图文 2是视屏*/{prop: "content_type_name", label: "内容类型", sortable: true},/*创建人*/{prop: "username", label: "创建人", sortable: true},/*创建时间*/{prop: "created_at", label: "创建时间", sortable: true},/*业务单元*/{prop: "business_module", label: "业务单元", sortable: true},/*  /!*内容状态*!/{prop: "status_name", label: "内容状态", sortable: true}*/],url: {list: "/content/list",put: "/task"},selected: "",tableData: [],task_id: null};},/*created() {this.list1()},*/methods: {/*  list1() {},*/select(id) {this.$refs["dialog"].show();this.task_id = id;/*this.list1();*/},handleSelect(val) {// TODO: 单选好像有点问题，选中一条的情况下，无法直接点击其他条数据更换选择if (val && val.length !== 0) {if (val.length === 1) {this.selected = val[0].id;} else {this.$refs["table"].toggleRowSelection([val[val.length - 2]]);}} else {this.selected = "";}},/*控制按钮打开调用此接口*/open(){getAction(this.url.list).then(res => {this.tableData = res.data})},clearSelection() {this.selected = "";this.$refs["table"].toggleRowSelection();},handleContentPreview(record) {console.log(this)this.$refs["assot"].show(record);},confirmAssociation() {putAction(this.url.put + '/' + this.task_id + '/bound', {content_id: this.selected}).then(res => {this.$message.success("绑定成功");this.$refs["dialog"].close();})}}
};
</script><style scoped></style>

运行结果