<div> <a-table :columns="columns" :rowKey="record => record.id" :dataSource="dataSource" :scroll="{ x: 2200 }" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" :pagination="pagination" :loading="loading" @change="handleTableChange" bordered> <template slot="pop" slot-scope="text,record,index"> <div v-if="record.farmingContent==6"> <a-popover title="消息" placement="right"> <template slot="content"> <div style="width: 300px;"> <a-row> <a-col :span="10">提示文字:</a-col> <a-col :span="14">{{record.pestName}}</a-col> </a-row> </div> </template> {{farmingContentFormat(record.farmingContent)}} </a-popover> </div> <div v-else> {{farmingContentFormat(record.farmingContent)}} </div> </template> <template slot="actions" slot-scope="text, record, index"> <span> <a-button @click.native="handleEdit(record)" size="small" type="primary" v-has="'ams:farming:edit'">編輯</a-button> <a-button @click.native="handleDelete(record.id)" size="small" type="danger" v-has="'ams:farming:delete'">刪除</a-button> </span> </template> </a-table> </div>
data() { return { queryParam: {}, columns: [ { title: 'Id', dataIndex: 'id', key: 'id', width: 60, align: 'center' }, { title: '農事內容', dataIndex: 'farmingContent', key: 'farmingContent', width: 120, align: 'center', scopedSlots: { customRender: 'pop' } }, { title: '操作', key: 'actions', align: 'center', width: 240, fixed: 'right', scopedSlots: { customRender: 'actions' } } ] } },
methods: { farmingContentFormat(text) { return this.dictFilter('ams_farming_content', text) } }