Files
mosr-web/src/views/project-management/initiation/index.vue
2024-05-14 21:32:10 +08:00

203 lines
4.3 KiB
Vue

<template>
<fvSearchForm :searchConfig="searchConfig" @search="search"></fvSearchForm>
<fvTable ref="tableIns" :tableConfig="tableConfig">
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
import fvSelect from '@/fvcomponents/fvSelect/index.vue'
import {reactive, shallowRef} from "vue";
const router = useRouter()
const searchConfig = reactive([
{
label: '名称',
prop: 'requirementName',
component: 'el-input',
props: {
placeholder: '请输入名称查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '项目类型',
prop: 'collectType',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择项目类型',
clearable: true,
filterable: true,
}
},
{
label: '项目影响',
prop: 'projectEffect',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择项目影响',
clearable: true,
filterable: true,
},
colProps: {}
},
{
label: '研发主体',
prop: 'collectType',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择研发主体',
clearable: true,
filterable: true,
}
},
{
label: '起止时间',
prop: 'time',
component: 'el-date-picker',
props: {
placeholder: '请选择起止时间',
clearable: true,
},
colProps: {}
},
{
label: '最小金额',
prop: 'requirementName',
component: 'el-input',
props: {
placeholder: '请输入金额查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '最大金额',
prop: 'requirementName',
component: 'el-input',
props: {
placeholder: '请输入金额查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
])
const tableIns = ref()
const tableConfig = reactive({
columns: [
{
prop: 'name',
label: '名称',
align: 'center'
},
{
prop: 'company',
label: '所属公司',
align: 'center'
},
{
prop: 'projectType',
label: '项目类型',
align: 'center'
},
{
prop: 'productMainBody',
label: '研发主体',
align: 'center'
},
{
prop: 'projectEffect',
label: '项目影响',
align: 'center'
},
{
prop: 'survey',
label: '经营概况',
align: 'center'
},
{
prop: 'time',
label: '起止时间',
align: 'center'
},
{
prop: 'status',
label: '发布状态',
align: 'center',
showOverflowTooltip: false,
currentRender: ({row, index}) => (<Tag dictType={'process_state'} value={row.state}/>)
},
{
prop: 'oper',
label: '操作',
align: 'center',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
let btn = [{label: '详情', func: () => handleDetail(row), type: 'primary'}]
if (row.state === '3') {
btn.push({label: '编辑', func: () => handleEdit(row), type: 'primary'})
} else if (row.state === '4') {
btn.push({label: '申请', func: () => handleApply(row), type: 'primary'})
}
return (
<div style={{width: '100%'}}>
{
btn.map(item => (
<el-button
type={item.type}
// v-perm={item.auth}
onClick={() => item.func()}
link
>
{item.label}
</el-button>
))
}
</div>
)
}
}
],
api: '/workflow/mosr/requirement',
params: {},
})
const search = (val) => {
tableConfig.params = {...val}
tableIns.value.refresh()
}
const handleDetail = (row) => {
router.push({
name:'Initiation/detail',
query: {
id: row.requirementId
}
})
}
const handleEdit = (row) => {
router.push({
name:'Initiation/edit',
query: {
id: row.requirementId
}
})
}
const handleApply = (row) => {
router.push({
name:'Initiation/apply',
query: {
id: row.requirementId
}
})
}
</script>