完善公共组件,以及Mixin混入的公共方法,数据等问题

This commit is contained in:
BianLzhaoMin 2024-08-08 15:00:50 +08:00
parent 26480bc213
commit 25f6d12ce4
15 changed files with 303 additions and 119 deletions

View File

@ -0,0 +1,21 @@
/**
* 往来单位管理页面 API
*/
import request from '@/utils/request'
/** 新增往来单位 */
export const addContactUnitsApi = (data) => {
return request.post('/xxx/xx', data)
}
/** 删除往来单位 */
export const deleteContactUnitsApi = (id) => {
return request.delete('/xxx/xx', id)
}
/** 修改往来单位 */
export const editContactUnitsApi = (data) => {
return request.post('/xxx/xx', data)
}
/** 往来单位列表查询 */
export const queryContactUnitsListApi = (data) => {
return request.post('/xxx/xx', data)
}

View File

@ -1,3 +1,6 @@
/**
* 工程管理页面 API
*/
import request from '@/utils/request'
/** 新增工程 */

View File

@ -0,0 +1,21 @@
/**
* 协议管理页面 API
*/
import request from '@/utils/request'
/** 新增协议 */
export const addProtocolApi = (data) => {
return request.post('/xxx/xx', data)
}
/** 删除协议 */
export const deleteProtocolApi = (id) => {
return request.delete('/xxx/xx', id)
}
/** 修改协议 */
export const editProtocolApi = (data) => {
return request.post('/xxx/xx', data)
}
/** 协议列表查询 */
export const queryProtocolListApi = (data) => {
return request.post('/xxx/xx', data)
}

View File

@ -0,0 +1,21 @@
/**
* 单位类型管理页面 API
*/
import request from '@/utils/request'
/** 新增单位类型*/
export const addUnitTypeApi = (data) => {
return request.post('/xxx/xx', data)
}
/** 删除单位类型*/
export const deleteUnitTypeApi = (id) => {
return request.delete('/xxx/xx', id)
}
/** 修改单位类型*/
export const editUnitTypeApi = (data) => {
return request.post('/xxx/xx', data)
}
/** 单位类型列表查询 */
export const queryUnitTypeListApi = (data) => {
return request.post('/xxx/xx', data)
}

View File

@ -222,6 +222,7 @@ export default {
this.getTableList()
},
updated() {
//
this.dynamicWidth = this.getOperatorWidth()
},
methods: {
@ -236,14 +237,9 @@ export default {
},
/** 重置按钮 */
resetQuery() {
// this.$refs.queryFormRef.resetFields()
this.$refs.queryFormRef.resetFields()
this.getTableList()
},
/** 筛选列 */
checkboxChange(list) {
this.columCheckList = list
},
/** 动态设置操作列的列宽 */
getOperatorWidth() {
const operatorColumn =

View File

@ -1,12 +0,0 @@
export const commonMixin = {
methods: {
/** 关闭外侧弹框 */
closeDialogOuter() {
this.dialogConfig.outerVisible = false
},
/** 关闭内侧弹框 */
closeDialogInner() {
this.dialogConfig.innerVisible = false
},
}
}

View File

@ -8,8 +8,8 @@
:model="contactUnitsParams"
:rules="contactUnitsParamsRules"
>
<el-form-item label="单位名称" prop="pro_name">
<el-input v-model="contactUnitsParams.pro_name" />
<el-form-item label="单位名称" prop="scrapNum">
<el-input v-model="contactUnitsParams.scrapNum" />
</el-form-item>
<el-form-item label="单位类型" prop="pro_type_of">
<el-select v-model="contactUnitsParams.pro_type_of"></el-select>
@ -48,10 +48,21 @@
<script>
export default {
name: 'FormContactUnits',
props: {
editParams: {
type: Object,
default: () => null,
},
},
mounted() {
if (this.editParams) {
Object.assign(this.contactUnitsParams, this.editParams)
}
},
data() {
return {
contactUnitsParams: {
pro_name: '',
scrapNum: '',
pro_code: '',
pro_unit: '',
pro_type_of: '',

View File

@ -1,22 +1,45 @@
<template>
<!-- 往来单位 -->
<!-- 往来单位管理页面 -->
<div class="app-container">
<!-- 列表 -->
<TableModel :formLabel="formLabel" :columnsList="columnsList">
<template slot="btn">
<el-button type="primary" @click="addContactUnits()"
<template slot="btn" slot-scope="{ queryParams }">
<el-button type="primary" @click="handleAddData()"
>新建</el-button
>
<el-button>导入</el-button>
<el-button>导出</el-button>
<el-button @click="handleImportData()">导入</el-button>
<el-button @click="handleExportData(queryParams)"
>导出</el-button
>
</template>
<template slot="handle" slot-scope="{ data }">
<el-button
type="primary"
size="mini"
@click="handleEditData(data)"
>编辑</el-button
>
<el-button
type="danger"
size="mini"
@click="handleDeleteData(data)"
>删除</el-button
>
</template>
</TableModel>
<!-- 新增以及修改时的弹框 -->
<DialogModel
:dialogConfig="dialogConfig"
@closeDialogOuter="closeDialogOuter"
>
<template slot="outerContent">
<FormContactUnits @closeDialog="closeDialog" />
<!-- 新增以及修改数据的表单组件 -->
<FormContactUnits
@closeDialog="closeDialog"
:editParams="editParams"
/>
</template>
</DialogModel>
</div>
@ -24,7 +47,7 @@
<script>
import { formLabel, columnsList, dialogConfig } from './config'
import { commonMixin } from '@/mixins/common.js'
import { commonMixin } from '../mixins/common'
import FormContactUnits from './components/form-contact-units.vue'
export default {
name: 'ContactUnits',
@ -35,18 +58,11 @@ export default {
formLabel,
columnsList,
dialogConfig,
//
addDialogTitle: '新建往来单位',
//
editDialogTitle: '修改往来单位',
}
},
methods: {
/** 新建往来单位 */
addContactUnits() {
this.dialogConfig.outerTitle = '新建往来单位'
this.dialogConfig.outerVisible = true
},
/** 关闭弹框 */
closeDialog() {
this.dialogConfig.outerVisible = false
},
},
}
</script>

View File

@ -10,8 +10,8 @@
>
<el-row type="flex" justify="space-between" :gutter="24">
<el-col :span="12">
<el-form-item label="工程名称" prop="pro_name">
<el-input v-model="projectParams.pro_name" />
<el-form-item label="工程名称" prop="scrapNum">
<el-input v-model="projectParams.scrapNum" />
</el-form-item>
</el-col>
<el-col :span="12">
@ -112,10 +112,21 @@
<script>
export default {
name: 'FormProject',
props: {
editParams: {
type: Object,
default: () => null,
},
},
mounted() {
if (this.editParams) {
Object.assign(this.projectParams, this.editParams)
}
},
data() {
return {
projectParams: {
pro_name: '',
scrapNum: '',
pro_code: '',
pro_unit: '',
pro_type_of: '',
@ -126,7 +137,7 @@ export default {
},
//
projectParamsRules: {
pro_name: [
scrapNum: [
{
required: true,
message: '请输入工程名称',

View File

@ -1,26 +1,44 @@
<template>
<!-- 工程管理 -->
<!-- 工程管理页面 -->
<div class="app-container">
<!-- 表格 -->
<TableModel :formLabel="formLabel" :columnsList="columnsList">
<template slot="btn">
<el-button type="primary" @click="addProject()">新建</el-button>
<el-button>导入</el-button>
<el-button>导出</el-button>
<template slot="btn" slot-scope="{ queryParams }">
<el-button type="primary" @click="handleAddData()"
>新建</el-button
>
<el-button @click="handleImportData()">导入</el-button>
<el-button @click="handleExportData(queryParams)"
>导出</el-button
>
</template>
<template slot="handle" slot-scope="{ data }">
<el-button type="primary" size="mini">编辑</el-button>
<el-button type="danger" size="mini">删除</el-button>
<el-button
type="primary"
size="mini"
@click="handleEditData(data)"
>编辑</el-button
>
<el-button
type="danger"
size="mini"
@click="handleDeleteData(data)"
>删除</el-button
>
</template>
</TableModel>
<!-- 新增弹框 -->
<!-- 新增以及修改时的弹框 -->
<DialogModel
:dialogConfig="dialogConfig"
@closeDialogOuter="closeDialogOuter"
>
<template slot="outerContent">
<FormProject @closeDialog="closeDialog" />
<!-- 新增以及修改数据的表单组件 -->
<FormProject
:editParams="editParams"
@closeDialog="closeDialog"
/>
</template>
</DialogModel>
</div>
@ -28,7 +46,7 @@
<script>
import { formLabel, columnsList, dialogConfig } from './config'
import { commonMixin } from '@/mixins/common.js'
import { commonMixin } from '../mixins/common'
import FormProject from './components/form-project'
export default {
name: 'ProjectManage',
@ -40,23 +58,15 @@ export default {
return {
//
formLabel,
//
//
columnsList,
//
//
dialogConfig,
//
addDialogTitle: '新建工程',
//
editDialogTitle: '修改工程',
}
},
methods: {
/** 新建工程 */
addProject() {
this.dialogConfig.outerTitle = '新建工程'
this.dialogConfig.outerVisible = true
},
/** 关闭弹框 */
closeDialog() {
this.dialogConfig.outerVisible = false
},
},
}
</script>

View File

@ -10,8 +10,8 @@
>
<el-row type="flex" justify="space-between" :gutter="24">
<el-col :span="12">
<el-form-item label="租赁单位" prop="pro_name">
<el-input v-model="protocolParams.pro_name" />
<el-form-item label="租赁单位" prop="scrapNum">
<el-input v-model="protocolParams.scrapNum" />
</el-form-item>
</el-col>
<el-col :span="12">
@ -92,10 +92,21 @@
<script>
export default {
name: 'FormProtocol',
props: {
editParams: {
type: Object,
default: () => null,
},
},
mounted() {
if (this.editParams) {
Object.assign(this.protocolParams, this.editParams)
}
},
data() {
return {
protocolParams: {
pro_name: '',
scrapNum: '',
pro_code: '',
pro_unit: '',
pro_type_of: '',
@ -106,7 +117,7 @@ export default {
},
//
protocolParamsRules: {
pro_name: [
scrapNum: [
{
required: true,
message: '请选择租赁单位',

View File

@ -1,28 +1,43 @@
<template>
<!-- 协议管理 -->
<!-- 协议管理页面 -->
<div class="app-container">
<!-- 表格 -->
<TableModel :formLabel="formLabel" :columnsList="columnsList">
<template slot="btn">
<el-button type="primary" @click="addProtocol()"
<template slot="btn" slot-scope="{ queryParams }">
<el-button type="primary" @click="handleAddData()"
>新增协议</el-button
>
<el-button>导出</el-button>
<el-button @click="handleExportData(queryParams)"
>导出</el-button
>
</template>
<template slot="handle" slot-scope="{ data }">
<el-button type="primary" size="mini">查看</el-button>
<el-button type="primary" size="mini">编辑</el-button>
<el-button type="danger" size="mini">删除</el-button>
<el-button
type="primary"
size="mini"
@click="handleEditData(data)"
>编辑</el-button
>
<el-button
type="danger"
size="mini"
@click="handleDeleteData(data)"
>删除</el-button
>
</template>
</TableModel>
<!-- 新增弹框 -->
<!-- 新增以及修改时的弹框 -->
<DialogModel
:dialogConfig="dialogConfig"
@closeDialogOuter="closeDialogOuter"
>
<template slot="outerContent">
<FormProtocol @closeDialog="closeDialog" />
<!-- 新增以及修改数据的表单组件 -->
<FormProtocol
@closeDialog="closeDialog"
:editParams="editParams"
/>
</template>
</DialogModel>
</div>
@ -30,7 +45,7 @@
<script>
import { formLabel, columnsList, dialogConfig } from './config'
import { commonMixin } from '@/mixins/common.js'
import { commonMixin } from '../mixins/common'
import FormProtocol from './components/form-protocol'
export default {
name: 'ProtocolManage',
@ -43,19 +58,11 @@ export default {
formLabel,
columnsList,
dialogConfig,
//
addDialogTitle: '新增协议',
//
editDialogTitle: '修改协议',
}
},
methods: {
/** 新增协议 */
addProtocol() {
this.dialogConfig.outerTitle = '新增协议'
this.dialogConfig.outerVisible = true
console.log('新增协议---')
},
/** 关闭弹框 */
closeDialog() {
this.dialogConfig.outerVisible = false
},
},
}
</script>

View File

@ -8,8 +8,8 @@
:model="unitsTypeParams"
:rules="unitsTypeParamsRules"
>
<el-form-item label="单位类型名称" prop="pro_type_name">
<el-input v-model="unitsTypeParams.pro_type_name" />
<el-form-item label="单位类型名称" prop="scrapNum">
<el-input v-model="unitsTypeParams.scrapNum" />
</el-form-item>
<el-form-item label="启用状态" prop="pro_type">
@ -37,16 +37,26 @@
<script>
export default {
name: 'FormUnitsType',
props: {
editParams: {
type: Object,
default: () => null,
},
},
mounted() {
if (this.editParams) {
Object.assign(this.unitsTypeParams, this.editParams)
}
},
data() {
return {
unitsTypeParams: {
pro_type_name: '',
scrapNum: '',
pro_type: '',
},
//
unitsTypeParamsRules: {
pro_type_name: [
scrapNum: [
{
required: true,
message: '请输入单位类型名称',

View File

@ -1,28 +1,44 @@
<template>
<!-- 单位类型 -->
<!-- 单位类型管理页面 -->
<div class="app-container">
<!-- 表格 -->
<TableModel :formLabel="formLabel" :columnsList="columnsList">
<template slot="btn">
<el-button type="primary" @click="addUnitType()"
<template slot="btn" slot-scope="{ queryParams }">
<el-button type="primary" @click="handleAddData()"
>新建</el-button
>
<el-button>导入</el-button>
<el-button>导出</el-button>
<el-button @click="handleImportData()">导入</el-button>
<el-button @click="handleExportData(queryParams)"
>导出</el-button
>
</template>
<template slot="handle" slot-scope="{ data }">
<el-button type="primary" size="mini">编辑</el-button>
<el-button type="danger" size="mini">删除</el-button>
<el-button
type="primary"
size="mini"
@click="handleEditData(data)"
>编辑</el-button
>
<el-button
type="danger"
size="mini"
@click="handleDeleteData(data)"
>删除</el-button
>
</template>
</TableModel>
<!-- 新增弹框 -->
<!-- 新增以及修改时的弹框 -->
<DialogModel
:dialogConfig="dialogConfig"
@closeDialogOuter="closeDialogOuter"
>
<template slot="outerContent">
<FormUnitsType @closeDialog="closeDialog" />
<!-- 新增以及修改数据的表单组件 -->
<FormUnitsType
@closeDialog="closeDialog"
:editParams="editParams"
/>
</template>
</DialogModel>
</div>
@ -30,7 +46,7 @@
<script>
import { formLabel, columnsList, dialogConfig } from './config'
import { commonMixin } from '@/mixins/common.js'
import { commonMixin } from '../mixins/common'
import FormUnitsType from './components/form-units-type'
export default {
name: 'UnitType',
@ -43,18 +59,11 @@ export default {
formLabel,
columnsList,
dialogConfig,
//
addDialogTitle: '新建单位类型',
//
editDialogTitle: '修改单位类型',
}
},
methods: {
/** 新建单位类型 */
addUnitType() {
this.dialogConfig.outerTitle = '新建单位类型'
this.dialogConfig.outerVisible = true
},
/** 关闭弹框 */
closeDialog() {
this.dialogConfig.outerVisible = false
},
},
}
</script>

View File

@ -0,0 +1,49 @@
export const commonMixin = {
data() {
return {
// 修改时的数据源
editParams: null,
}
},
methods: {
/** 新建 */
handleAddData() {
this.editParams = null
this.dialogConfig.outerTitle = this.addDialogTitle
this.dialogConfig.outerVisible = true
},
/** 删除 */
handleDeleteData(data) {
this.$modal.confirm('是否确定删除').then(() => {
console.log('确定删除--')
})
},
/** 编辑 */
handleEditData(data) {
this.editParams = data
this.dialogConfig.outerTitle = this.editDialogTitle
this.dialogConfig.outerVisible = true
},
/** 导入数据 */
handleImportData() {
console.log('导入--')
},
/** 导出数据 */
handleExportData() {
console.log('导出--')
},
/** 关闭外侧弹框 */
closeDialogOuter() {
this.dialogConfig.outerVisible = false
},
/** 关闭内侧弹框 */
closeDialogInner() {
this.dialogConfig.innerVisible = false
},
/** 关闭弹框 由表单组件通知父组件关闭弹框的自定义事件 */
closeDialog() {
this.dialogConfig.outerVisible = false
},
}
}