<template>
  <div>
    <header-tool-bar>
      <span class="cust-title" slot="title">
        <a-icon type="hdd"/>业务操作明细-{{businessName}}
      </span>
      <a-button-group slot="extra">
        <!--<a-button type='primary' htmlType='submit'>保存</a-button>-->
        <a-button type="primary" @click="back" ghost>返回</a-button>
      </a-button-group>
    </header-tool-bar>
    <div class="cust-detail-form">
      <a-card title="操作列表" class="cust-normal-card">
        <a-button-group slot="extra">
          <a-button type="primary" @click="addRowOperate">添加</a-button>
          <a-button type="danger" @click="delItemOperate">删除</a-button>
        </a-button-group>
        <a-table
          :columns="operateColumns"
          :dataSource="operateList"
          rowKey="id"
          size="middle"
          :pagination="false"
          class="cust-card-table"
          :rowSelection="{selectedRowKeys: selectedRowKeysOperate, onChange: updateSelectOperate}"
          bordered
        >
          <span slot="action" slot-scope="text, record">
            <a @click="editRowOperate(record)">编辑</a>
            <a-divider type="vertical"/>
            <a @click="editResource(record)">修改资源</a>
          </span>
        </a-table>
      </a-card>
      <a-card v-show="resourceTableShow" :title="resourceTitle" class="cust-normal-card">
        <a-button-group slot="extra">
          <a-button type="primary" @click="addRowResource">添加</a-button>
          <a-button type="danger" @click="delItemResource">删除</a-button>
        </a-button-group>
        <a-table
          :columns="resourceColumns"
          :dataSource="resourceList"
          rowKey="id"
          size="middle"
          :pagination="false"
          class="cust-card-table"
          :rowSelection="{selectedRowKeys: selectedRowKeysResource, onChange: updateSelectResource}"
          bordered
        >
          <span slot="action" slot-scope="text, record">
            <a @click="editRowResource(record)">编辑</a>
          </span>
        </a-table>
      </a-card>
    </div>

    <sys-business-operate-item-detail @modifyItem="modifyOperateItem" ref="sysBusinessOperateItemDetail"/>
    <sys-business-resource-item-detail @modifyItem="modifyResourceItem" ref="sysBusinessResourceItemDetail"/>
  </div>
</template>

<script>
    import HeaderToolBar from '@/components/page/HeaderToolBar'
    import SysBusinessOperateItemDetail from './SysBusinessOperateItemDetailCom'
    import SysBusinessResourceItemDetail from './SysBusinessResourceItemDetailCom'

    import {getListOperate, saveOperate, updateOperate, deleteBatchOperate} from '@/api/system/sysBusinessOperate'
    import {getListResource, saveResource, updateResource, deleteBatchResource} from '@/api/system/sysBusinessResource'

    const operateColumns = [
        {title: '名称', dataIndex: 'name', width: 250},
        {title: 'key', dataIndex: 'operateKey',},
        {title: '操作', key: 'operation', width: 190, scopedSlots: {customRender: 'action'}}
    ]
    const resourceColumns = [
        {title: '操作地址', dataIndex: 'operateUrl', width: 250},
        {title: '请求类型', dataIndex: 'operateMethod',},
        {title: '操作', key: 'operation', width: 190, scopedSlots: {customRender: 'action'}}
    ]

    export default {
        name: "SysBusinessOperateDetailCom",
        components: {HeaderToolBar, SysBusinessOperateItemDetail, SysBusinessResourceItemDetail},
        props: ['pageData'],
        data() {
            return {
                id: 0,
                businessName: '',
                pageType: '',

                resourceTableShow: false,
                resourceTitle: "资源列表",
                currentOperate: {},
                currentOperateId: 0,
                currentResource: {},

                operateColumns: operateColumns,
                resourceColumns: resourceColumns,
                operateList: [],
                resourceList: [],
                selectedRowKeysOperate: [],
                selectedRowKeysResource: [],
            }
        },
        activated() {
            this.selectedRowKeysOperate = []
            this.initData()
        },
        deactivated() {
            this.operateList = [];
            this.resourceList = [];
            this.resourceTableShow = false;
        },
        methods: {
            initData() {
                this.id = this.pageData.id || 0;
                this.businessName = this.pageData.businessName || '';
                this.pageType = this.pageData.pageType || 'sys';

                getListOperate(this.optListUrl, this.pageData.id || 0).then(resp => {
                    if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
                        this.operateList = resp.data;
                        this.resourceTableShow = false
                    }
                })
            },
            initResource() {
                getListResource(this.resListUrl, this.currentOperateId).then(resp => {
                    if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
                        this.resourceList = resp.data;
                        this.resourceTableShow = true;
                    }
                })
            },
            updateSelectOperate(selectedRowKeys) {
                this.selectedRowKeysOperate = selectedRowKeys
            },
            back() {
                this.$router.push({name: this.listPathName});
            },
            deleteBatchOperate() {
                deleteBatchOperate(this.optDelUrl, this.selectedRowKeysOperate).then(response => {
                    if (response && response.code == SYS_CONST.REQUEST.SUCCEED) {
                        this.initData();
                    }
                });
            },
            delItemOperate() {
                if (this.selectedRowKeysOperate.length == 0) {
                    return;
                }
                let _this = this;
                this.$confirm({
                    title: '提示',
                    content: '操作下面的资源也会一起删除，确定删除选中的操作吗？',
                    onOk() {
                        _this.deleteBatchOperate()
                    },
                    onCancel() {
                    },
                });
            },
            deleteBatchResource() {
                deleteBatchResource(this.resDelUrl, this.selectedRowKeysResource).then(response => {
                    if (response && response.code == SYS_CONST.REQUEST.SUCCEED) {
                        this.initResource();
                    }
                });
            },
            delItemResource() {
                if (this.selectedRowKeysResource.length == 0) {
                    return;
                }
                let _this = this;
                this.$confirm({
                    title: '提示',
                    content: '确定删除选中的记录吗？',
                    onOk() {
                        _this.deleteBatchResource()
                    },
                    onCancel() {
                    },
                });
            },
            addRowOperate() {
                this.currentOperate = {}
                this.$refs.sysBusinessOperateItemDetail.show()
            },
            addRowResource() {
                this.currentResource = {}
                this.$refs.sysBusinessResourceItemDetail.show()
            },
            editRowOperate(row) {
                this.currentOperate = row
                this.$refs.sysBusinessOperateItemDetail.show(row)
            },
            editRowResource(row) {
                this.currentResource = row
                this.$refs.sysBusinessResourceItemDetail.show(row)
            },
            editResource(row) {
                this.currentOperateId = row.id
                this.resourceTitle = "资源列表-" + row.name
                this.initResource()
            },
            updateSelectResource(selectedRowKeys) {

                this.selectedRowKeysResource = selectedRowKeys
            },
            modifyOperateItem(item) {
                item.businessId = this.id
                this.$valueCopy(this.currentOperate, item)
                //判断operateKey是否重复
                if (this.getRepeatKey(this.currentOperate) > 0) {
                    this.$error({
                        title: '错误提示',
                        content: 'key已存在，请更换一个key',
                    });
                    return
                }
                if (this.currentOperate.id) {
                    updateOperate(this.optSaveUrl, this.currentOperate).then(resp => {
                        if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
                            this.initData()
                            this.$refs.sysBusinessOperateItemDetail.close()
                        }
                    });
                } else {
                    saveOperate(this.optSaveUrl, this.currentOperate).then(resp => {
                        if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
                            this.initData()
                            this.$refs.sysBusinessOperateItemDetail.close()
                        }
                    });
                }

            },
            getRepeatKey(item) {
                let count = 0;
                this.operateList.map(m => {
                    if (m.operateKey == item.operateKey && m.id != item.id) {
                        count++;
                    }
                })
                return count
            },
            modifyResourceItem(item) {
                item.businessOperateId = this.currentOperateId;
                let data = this.$valueCopy(this.currentResource, item);
                if (data.id) {
                    updateResource(this.resSaveUrl, data).then(resp => {
                        if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
                            this.initResource()
                        }
                    });
                } else {
                    saveResource(this.resSaveUrl, data).then(resp => {
                        if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
                            this.initResource()
                        }
                    });
                }

            }
        },
        computed: {
            optListUrl: function () {
                if (this.pageType === "company") {
                    return '/saas/business/operate/getByBusiness/';
                } else {
                    return '/sys/business/operate/getByBusiness/';
                }
            },
            optSaveUrl: function() {
                if (this.pageType === "company") {
                    return '/saas/business/operate/';
                } else {
                    return '/sys/business/operate/';
                }
            },
            optDelUrl: function() {
                if (this.pageType === "company") {
                    return '/saas/business/operate/batchDelete';
                } else {
                    return '/sys/business/operate/batchDelete';
                }
            },
            resListUrl: function () {
                if (this.pageType === "company") {
                    return '/saas/business/operate/resource/getByOperate/';
                } else {
                    return '/sys/business/operate/resource/getByOperate/';
                }
            },
            resSaveUrl: function() {
                if (this.pageType === "company") {
                    return '/saas/business/operate/resource/';
                } else {
                    return '/sys/business/operate/resource/';
                }
            },
            resDelUrl: function() {
                if (this.pageType === "company") {
                    return '/saas/business/operate/resource/batchDelete';
                } else {
                    return '/sys/business/operate/resource/batchDelete';
                }
            },
            listPathName: function () {
                if (this.pageType === "company") {
                    return 'companyBusinessList';
                } else {
                    return 'sysBusinessList';
                }
            }
        },
    }
</script>

