Files
income_payments_client/src/views/projectManagement/WorkingGroupUnderStudyProject.vue
T

129 lines
4.2 KiB
Vue

<template>
<div>
<page-header-title :is-level-one="false" :level-two-title="$route.query.title"></page-header-title>
<a-card :bordered="false">
<!-- 查询区域-start -->
<div class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
<a-form-item label="项目名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input placeholder="请输入项目名称" v-model="queryParam.companyName" :maxLength='50'></a-input>
</a-form-item>
</a-col>
<a-col :xl="6" :lg="7" :md="8" :sm="24">
<span class="table-page-search-submitButtons">
<a-button type="primary" icon="search" @click="searchQuery" v-has="'workingGroup:underStudy:search'">查询</a-button>
<a-button icon="reload" @click="searchReset" class="reset-button">重置</a-button>
</span>
</a-col>
</a-row>
</a-form>
</div>
<!-- 查询区域-end-->
<!-- 操作按钮区域-->
<div class="table-operator">
<a-button type="primary" icon="plus" @click="handleAdd" v-has="'workingGroup:underStudy:add'">新增</a-button>
<a-button type="danger" icon="delete" @click="batchDel" v-has="'workingGroup:underStudy:batchDel'">批量删除</a-button>
</div>
<!-- 操作按钮区域-end-->
<!-- table表格区域-->
<div>
<a-table
ref="table"
size="middle"
bordered
rowKey="id"
:columns="columns"
:scroll="{x: 1000}"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange"
class="j-table-force-nowrap">
<template slot="text" slot-scope="text">
<j-ellipsis :value="text" :length="18"></j-ellipsis>
</template>
<span slot="action" class="action-span-cell" slot-scope="text, record">
<a @click="handleEdit(record)" v-has="'workingGroup:underStudy:edit'">编辑</a>
<a @click="handleDelete(record.id)" v-has="'workingGroup:underStudy:delete'">删除</a>
</span>
</a-table>
</div>
</a-card>
<working-group-under-study-project-modal ref="modalForm" @ok="modalFormOk"></working-group-under-study-project-modal>
</div>
</template>
<script>
import PageHeaderTitle from '../../components/layouts/PageHeaderTitle'
import { JeroListMixin } from '../../mixins/JeroListMixin'
import WorkingGroupUnderStudyProjectModal from './modules/WorkingGroupUnderStudyProjectModal'
export default {
name: 'WorkingGroupUnderStudyProject',
components: { PageHeaderTitle, WorkingGroupUnderStudyProjectModal },
mixins: [JeroListMixin],
data() {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 10 }
},
columns: [
{
title: '序号',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
}, {
title: '项目名称',
align: 'center',
dataIndex: 'companyName',
scopedSlots: { customRender: 'text' }
}, {
title: '主要起草单位',
align: 'center',
dataIndex: 'companyAddress',
scopedSlots: { customRender: 'text' }
}, {
title: '项目进度',
align: 'center',
dataIndex: 'companyPhone',
scopedSlots: { customRender: 'text' }
}, {
title: '操作',
align: 'center',
width: 180,
fixed: 'right',
dataIndex: 'bankAccountName',
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '',
delete: '',
deleteBatch: ''
}
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
</style>