duoji-frontend/src/views/roadwayManage/index.vue

<template>
    <a-table
        :columns="columns"
        :row-key="record => record.id"
        :data-source="data"
        :pagination="pagination"
        @change="handleGetStreetList"
    >
         <span slot="leftType" slot-scope="text">
              {{ text === 0 ? '单伸' : '双伸' }}
         </span>
        <span slot="rightType" slot-scope="text">
              {{ text === 0 ? '单伸' : '双伸' }}
         </span>
        <span slot="actions" slot-scope="text">
              <template>
                  <span v-if="text.camera1Name">{{text.camera1Name}}</span>
                  <span v-if="text.camera2Name">{{text.camera2Name}}</span>
                  <span v-if="text.camera1Name && text.camera2Name">{{text.camera1Name}}/{{text.camera2Name}}</span>
              </template>
         </span>
        <span slot="action" slot-scope="text, record">
            <a @click="editModal(1,record)" v-action="'dosage_edit'">
              编辑
            </a>
            <a-divider type="vertical" v-action="'dosage_edit'"/>
            <a-popconfirm
                title="是否删除?"
                @confirm="() => delDosage(record)"
                v-action="'dosage_delete'"
            >
              <a>删除</a>
            </a-popconfirm>
          </span>
    </a-table>
</template>
<script>
// import reqwest from 'reqwest';
const columns = [
    {
        title: '巷道名称',
        dataIndex: 'name',
    },
    {
        title: 'PLC-ID',
        dataIndex: 'plcId',
    },
    {
        title: '左货架类型',
        dataIndex: 'leftType',
        scopedSlots: { customRender: 'leftType' }
    },
    {
        title: '右货架类型',
        dataIndex: 'rightType',
        scopedSlots: { customRender: 'rightType' }
    },
    {
        title: '对应球机',
        scopedSlots: { customRender: 'actions' },
    },
    {
        title: '修改时间',
        dataIndex: 'updateTime',
    },
    {
        title: '操作',
        dataIndex: 'action',
        scopedSlots: { customRender: 'action' }
    },
];
export default {
    data() {
        return {
            pageNum:1,
            pageSize:10,
            data: [],
            pagination: {},
            loading: false,
            columns,
        };
    },
    mounted() {
        this.handleGetStreetList()
    },
    methods: {
        handleGetStreetList(){
            this.$api.httpApi
                .getStreetList({
                    data: {
                        pageNum:this.pageNum,
                        pageSize:this.pageSize,
                    }
                })
                .then(res => {
                    // res.data[1].mediaPath =
                    //     "http://gitlab.zhehekeji.com/security_check/security_front/raw/1.0.0/src/assets/video/video2.mp4";
                    this.data = res.data.list;
                });
        }
    },
};
</script>