物资类型管理-相关功能开发
This commit is contained in:
parent
143a920733
commit
296ed51e45
|
|
@ -5,7 +5,7 @@ VUE_APP_TITLE = 博诺思管理系统
|
||||||
ENV = 'development'
|
ENV = 'development'
|
||||||
|
|
||||||
# 博诺思管理系统/开发环境
|
# 博诺思管理系统/开发环境
|
||||||
VUE_APP_BASE_API = '/prod'
|
VUE_APP_BASE_API = '/dev-api'
|
||||||
|
|
||||||
# 路由懒加载
|
# 路由懒加载
|
||||||
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
/**
|
||||||
|
* 物资类型管理页面 API
|
||||||
|
*/
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
/** 物资类型树查询 */
|
||||||
|
export const queryMaTypeTreeListApi = (data) => {
|
||||||
|
return request.get('/material/maType/getMaTypeList', {
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 树形下物资查询 */
|
||||||
|
export const queryMaListApi = (data) => {
|
||||||
|
return request.get('/material/maType/getListByMaType', {
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 新增时查询id */
|
||||||
|
export const queryIdWhenAddMa = (data) => {
|
||||||
|
return request.get('/material/maType/addMaType', {
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,9 @@
|
||||||
|
/** 公共接口 */
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 公共下拉选接口
|
||||||
|
export const fetchSelOptApi = (data) => {
|
||||||
|
return request.get('/common/getSelectData', {
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -94,12 +94,13 @@
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
select-on-indeterminate
|
select-on-indeterminate
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
|
v-loading="loading"
|
||||||
>
|
>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
type="selection"
|
type="selection"
|
||||||
width="45"
|
width="45"
|
||||||
align="center"
|
align="center"
|
||||||
v-if="selectionShow"
|
v-if="showSel"
|
||||||
/>
|
/>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
width="55"
|
width="55"
|
||||||
|
|
@ -169,11 +170,17 @@ export default {
|
||||||
type: Function,
|
type: Function,
|
||||||
default: () => function () {},
|
default: () => function () {},
|
||||||
},
|
},
|
||||||
/* 列表配置项 */
|
/** 列表配置项 */
|
||||||
columnsList: {
|
columnsList: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: () => [],
|
default: () => [],
|
||||||
},
|
},
|
||||||
|
/** 是否显示选择框 */
|
||||||
|
showSel: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
|
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
/* 根据操作栏控制表头是否显示 */
|
/* 根据操作栏控制表头是否显示 */
|
||||||
|
|
@ -194,6 +201,7 @@ export default {
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
loading: false,
|
||||||
// 列表接口查询参数
|
// 列表接口查询参数
|
||||||
queryParams: {
|
queryParams: {
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
|
|
@ -227,6 +235,7 @@ export default {
|
||||||
this.formLabel.map(e => {
|
this.formLabel.map(e => {
|
||||||
this.$set(this.queryParams, e.f_model, '')
|
this.$set(this.queryParams, e.f_model, '')
|
||||||
})
|
})
|
||||||
|
// Object.assign(this.queryParams, this.sendParams)
|
||||||
this.getTableList()
|
this.getTableList()
|
||||||
},
|
},
|
||||||
updated() {
|
updated() {
|
||||||
|
|
@ -236,9 +245,18 @@ export default {
|
||||||
methods: {
|
methods: {
|
||||||
/** 获取列表数据 */
|
/** 获取列表数据 */
|
||||||
async getTableList() {
|
async getTableList() {
|
||||||
|
this.loading = true
|
||||||
|
console.log(this.queryParams)
|
||||||
const res = await this.requestApi(this.queryParams)
|
const res = await this.requestApi(this.queryParams)
|
||||||
|
this.loading = false
|
||||||
console.log(res, '列表数据')
|
console.log(res, '列表数据')
|
||||||
if(res.code === 200) this.tableList = res.rows
|
if(res.code === 200) {
|
||||||
|
if(res.data) {
|
||||||
|
this.tableList = res.data.rows
|
||||||
|
} else {
|
||||||
|
this.tableList = res.rows
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
/** 查询按钮 */
|
/** 查询按钮 */
|
||||||
handleQuery() {
|
handleQuery() {
|
||||||
|
|
@ -277,6 +295,11 @@ export default {
|
||||||
return width
|
return width
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
queryTableList(params) {
|
||||||
|
Object.assign(this.queryParams, params)
|
||||||
|
this.getTableList()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -14,7 +14,7 @@ router.beforeEach((to, from, next) => {
|
||||||
// next()
|
// next()
|
||||||
NProgress.start()
|
NProgress.start()
|
||||||
if (getToken()) {
|
if (getToken()) {
|
||||||
console.log(getToken())
|
// console.log(getToken())
|
||||||
to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
|
to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
|
||||||
/* has token*/
|
/* has token*/
|
||||||
if (to.path === '/login') {
|
if (to.path === '/login') {
|
||||||
|
|
|
||||||
|
|
@ -61,5 +61,14 @@ export const commonMixin = {
|
||||||
this.$refs.tableRef.getTableList()
|
this.$refs.tableRef.getTableList()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
/** 手机号脱密处理 */
|
||||||
|
phoneCrypto(phoneNumber) {
|
||||||
|
let reg = /^(1[3-9][0-9])\d{4}(\d{4}$)/
|
||||||
|
let isMobile = reg.test(phoneNumber)
|
||||||
|
if (isMobile) {
|
||||||
|
return phoneNumber.replace(reg, "$1****$2")
|
||||||
|
}
|
||||||
|
return phoneNumber
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,7 @@ export const columnsList = [
|
||||||
{ t_props: 'startTime', t_label: '开始日期', },
|
{ t_props: 'startTime', t_label: '开始日期', },
|
||||||
// { t_props: 'itemType', t_label: '租赁期限(天)', },
|
// { t_props: 'itemType', t_label: '租赁期限(天)', },
|
||||||
{ t_props: 'authorizingPerson', t_label: '授权人', },
|
{ t_props: 'authorizingPerson', t_label: '授权人', },
|
||||||
{ t_props: 'authorizingPhone', t_label: '授权人电话', },
|
{ t_props: 'authorizingPhone', t_label: '授权人电话', t_slot: 'authorizingPhone' },
|
||||||
// { t_props: 'itemType', t_label: '租赁单位类型', },
|
// { t_props: 'itemType', t_label: '租赁单位类型', },
|
||||||
{ t_props: 'url', t_label: '合同文件', t_slot: 'url' },
|
{ t_props: 'url', t_label: '合同文件', t_slot: 'url' },
|
||||||
{ t_props: 'remark', t_label: '备注', },
|
{ t_props: 'remark', t_label: '备注', },
|
||||||
|
|
|
||||||
|
|
@ -33,6 +33,9 @@
|
||||||
<template slot="url" slot-scope="{ data }">
|
<template slot="url" slot-scope="{ data }">
|
||||||
<img :src="data.url" style="width: 50px; height: 50px">
|
<img :src="data.url" style="width: 50px; height: 50px">
|
||||||
</template>
|
</template>
|
||||||
|
<template slot="authorizingPhone" slot-scope="{ data }">
|
||||||
|
{{ phoneCrypto(data.authorizingPhone) }}
|
||||||
|
</template>
|
||||||
</TableModel>
|
</TableModel>
|
||||||
|
|
||||||
<!-- 新增以及修改时的弹框 -->
|
<!-- 新增以及修改时的弹框 -->
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,13 @@
|
||||||
|
|
||||||
export const formLabel = [
|
export const formLabel = [
|
||||||
{ f_label: '单位名称', f_model: 'keyWords', f_type: 'ipt' },
|
{ f_label: '单位名称', f_model: 'name', f_type: 'ipt' },
|
||||||
]
|
]
|
||||||
export const columnsList = [
|
export const columnsList = [
|
||||||
{ t_props: 'name', t_label: '单位名称', },
|
{ t_props: 'name', t_label: '单位名称', },
|
||||||
{ t_props: 'typeId', t_label: '单位类型' },
|
{ t_props: 'typeId', t_label: '单位类型' },
|
||||||
{ t_props: 'companyId', t_label: '所属分公司' },
|
{ t_props: 'companyId', t_label: '所属分公司' },
|
||||||
{ t_props: 'materialClerk', t_label: '材料员', },
|
{ t_props: 'materialClerk', t_label: '材料员', },
|
||||||
{ t_props: 'phone', t_label: '联系电话', },
|
{ t_props: 'phone', t_label: '联系电话', t_slot: 'phone' },
|
||||||
{ t_props: 'isActive', t_label: '状态', t_slot: 'isActive' },
|
{ t_props: 'isActive', t_label: '状态', t_slot: 'isActive' },
|
||||||
|
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -35,6 +35,9 @@
|
||||||
<template slot="isActive" slot-scope="{ data }">
|
<template slot="isActive" slot-scope="{ data }">
|
||||||
{{ data.isActive == '1' ? '启用' : '不启用' }}
|
{{ data.isActive == '1' ? '启用' : '不启用' }}
|
||||||
</template>
|
</template>
|
||||||
|
<template slot="phone" slot-scope="{ data }">
|
||||||
|
{{ phoneCrypto(data.phone) }}
|
||||||
|
</template>
|
||||||
</TableModel>
|
</TableModel>
|
||||||
|
|
||||||
<!-- 新增以及修改时的弹框 -->
|
<!-- 新增以及修改时的弹框 -->
|
||||||
|
|
@ -54,15 +57,28 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { formLabel, columnsList, dialogConfig } from './config'
|
import { columnsList, dialogConfig, formLabel } from './config'
|
||||||
import { commonMixin } from '../mixins/common'
|
import { commonMixin } from '../mixins/common'
|
||||||
import FormContactUnits from './components/form-contact-units.vue'
|
import FormContactUnits from './components/form-contact-units.vue'
|
||||||
import { queryContactUnitsListApi, deleteContactUnitsApi } from '@/api/base/customer'
|
import { deleteContactUnitsApi, queryContactUnitsListApi } from '@/api/base/customer'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'ContactUnits',
|
name: 'ContactUnits',
|
||||||
mixins: [commonMixin], // 混入公共方法和数据
|
mixins: [commonMixin], // 混入公共方法和数据
|
||||||
components: { FormContactUnits },
|
components: { FormContactUnits },
|
||||||
methods: { queryContactUnitsListApi, deleteContactUnitsApi },
|
methods: {
|
||||||
|
queryContactUnitsListApi,
|
||||||
|
deleteContactUnitsApi,
|
||||||
|
// 手机号脱密
|
||||||
|
/* phoneCrypto(phoneNumber) {
|
||||||
|
let reg = /^(1[3-9][0-9])\d{4}(\d{4}$)/
|
||||||
|
let isMobile = reg.test(phoneNumber)
|
||||||
|
if (isMobile) {
|
||||||
|
return phoneNumber.replace(reg, "$1****$2")
|
||||||
|
}
|
||||||
|
return phoneNumber
|
||||||
|
} */
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
formLabel,
|
formLabel,
|
||||||
|
|
|
||||||
|
|
@ -113,14 +113,17 @@
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="关联i8工程" prop="isMatch">
|
<el-form-item label="关联i8工程" prop="isMatch">
|
||||||
<el-switch
|
<span
|
||||||
|
style="box-sizing: border-box; padding: 5px 10px; background-color: #00afff; color: #fff; border-radius: 10px"
|
||||||
|
>{{ projectParams.proId === null || projectParams.proId === '' ? '未关联' : '已关联' }}</span>
|
||||||
|
<!-- <el-switch
|
||||||
v-model="projectParams.isMatch"
|
v-model="projectParams.isMatch"
|
||||||
active-color="#13ce66"
|
active-color="#13ce66"
|
||||||
inactive-color="#ff4949"
|
inactive-color="#ff4949"
|
||||||
active-value="1"
|
active-value="1"
|
||||||
inactive-value="0"
|
inactive-value="0"
|
||||||
>
|
>
|
||||||
</el-switch>
|
</el-switch>-->
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
@ -153,6 +156,9 @@ import {
|
||||||
addProjectApi,
|
addProjectApi,
|
||||||
editProjectApi
|
editProjectApi
|
||||||
} from '@/api/base/project.js'
|
} from '@/api/base/project.js'
|
||||||
|
import {
|
||||||
|
fetchSelOptApi
|
||||||
|
} from '@/api/system/common'
|
||||||
export default {
|
export default {
|
||||||
name: 'FormProject',
|
name: 'FormProject',
|
||||||
props: {
|
props: {
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ export const columnsList = [
|
||||||
{ t_props: 'isMatch', t_label: '是否匹配i8工程', t_slot: 'isMatch' },
|
{ t_props: 'isMatch', t_label: '是否匹配i8工程', t_slot: 'isMatch' },
|
||||||
{ t_props: 'htzt', t_label: '合同主体', },
|
{ t_props: 'htzt', t_label: '合同主体', },
|
||||||
{ t_props: 'manager', t_label: '项目经理', },
|
{ t_props: 'manager', t_label: '项目经理', },
|
||||||
{ t_props: 'phone', t_label: '联系电话', },
|
{ t_props: 'phone', t_label: '联系电话', t_slot: 'phone' },
|
||||||
{ t_props: 'stats', t_label: '工程状态', },
|
{ t_props: 'stats', t_label: '工程状态', },
|
||||||
{ t_props: 'remark', t_label: '备注', },
|
{ t_props: 'remark', t_label: '备注', },
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -34,6 +34,9 @@
|
||||||
<template slot="isMatch" slot-scope="{ data }">
|
<template slot="isMatch" slot-scope="{ data }">
|
||||||
{{ data.proId == null ? '不匹配' : '匹配' }}
|
{{ data.proId == null ? '不匹配' : '匹配' }}
|
||||||
</template>
|
</template>
|
||||||
|
<template slot="phone" slot-scope="{ data }">
|
||||||
|
{{ phoneCrypto(data.phone) }}
|
||||||
|
</template>
|
||||||
</TableModel>
|
</TableModel>
|
||||||
|
|
||||||
<!-- 新增以及修改时的弹框 -->
|
<!-- 新增以及修改时的弹框 -->
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,72 @@
|
||||||
|
export const commonMixin = {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 修改时的数据源
|
||||||
|
editParams: null,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 新建 */
|
||||||
|
handleAddData(level) {
|
||||||
|
if(level == null) {
|
||||||
|
this.$modal.msgError('请在左侧菜单选择设备类型!')
|
||||||
|
} else if(level >= 3) {
|
||||||
|
this.$modal.msgError('该类型无法添加子类型!')
|
||||||
|
} else {
|
||||||
|
this.editParams = null
|
||||||
|
this.dialogConfig.outerTitle = this.addDialogTitle
|
||||||
|
this.dialogConfig.outerVisible = true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/** 删除 */
|
||||||
|
handleDeleteData(id, method) {
|
||||||
|
this.$modal.confirm('是否确定删除').then(() => {
|
||||||
|
console.log('确定删除--', id)
|
||||||
|
method(id).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
if(res.code === 200) {
|
||||||
|
// this.$message.msgSuccess('操作成功!')
|
||||||
|
this.$refs.tableRef.getTableList()
|
||||||
|
}
|
||||||
|
}).catch(err => {})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/** 编辑 */
|
||||||
|
handleEditData(data) {
|
||||||
|
console.log(data)
|
||||||
|
this.editParams = data
|
||||||
|
this.dialogConfig.outerTitle = this.editDialogTitle
|
||||||
|
this.dialogConfig.outerVisible = true
|
||||||
|
},
|
||||||
|
/** 导入数据 */
|
||||||
|
handleImportData() {
|
||||||
|
console.log('导入--')
|
||||||
|
},
|
||||||
|
/** 导出数据 */
|
||||||
|
handleExportData(data, url, fileName) {
|
||||||
|
this.download(
|
||||||
|
url,
|
||||||
|
{
|
||||||
|
...data
|
||||||
|
},
|
||||||
|
`${fileName}_${new Date().getTime()}.xlsx`,
|
||||||
|
)
|
||||||
|
},
|
||||||
|
/** 关闭外侧弹框 */
|
||||||
|
closeDialogOuter() {
|
||||||
|
this.dialogConfig.outerVisible = false
|
||||||
|
},
|
||||||
|
/** 关闭内侧弹框 */
|
||||||
|
closeDialogInner() {
|
||||||
|
this.dialogConfig.innerVisible = false
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 关闭弹框 由表单组件通知父组件关闭弹框的自定义事件 */
|
||||||
|
closeDialog(type) {
|
||||||
|
this.dialogConfig.outerVisible = false
|
||||||
|
if(type) {
|
||||||
|
this.$refs.tableRef.getTableList()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,330 @@
|
||||||
|
<template>
|
||||||
|
<!-- 协议管理 新增、编辑 表单组件 -->
|
||||||
|
<div>
|
||||||
|
<!-- form-新增 level0 -->
|
||||||
|
<el-form
|
||||||
|
label-width="100px"
|
||||||
|
size="medium"
|
||||||
|
ref="typeParamsRefLv0"
|
||||||
|
:model="typeParamsLv0"
|
||||||
|
v-if="subSort === 1 && sendData.level === 0"
|
||||||
|
>
|
||||||
|
<el-form-item label="新增类型编码" prop="code">
|
||||||
|
<el-input v-model="typeParamsLv0.code" disabled />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="新增类型名称" prop="name">
|
||||||
|
<el-input v-model="typeParamsLv0.name" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<!-- form-新增 level1 -->
|
||||||
|
<el-form
|
||||||
|
label-width="100px"
|
||||||
|
size="medium"
|
||||||
|
ref="typeParamsRefLv1"
|
||||||
|
:model="typeParamsLv1"
|
||||||
|
v-if="subSort === 1 && sendData.level === 1"
|
||||||
|
>
|
||||||
|
<el-form-item label="新增类型编码" prop="code">
|
||||||
|
<el-input v-model="typeParamsLv1.code" disabled />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<!-- form-新增 level2 -->
|
||||||
|
<el-form
|
||||||
|
label-width="100px"
|
||||||
|
size="medium"
|
||||||
|
ref="typeParamsRefLv2"
|
||||||
|
:model="typeParamsLv2"
|
||||||
|
v-if="subSort === 1 && sendData.level === 2"
|
||||||
|
>
|
||||||
|
<el-form-item label="新增类型编码" prop="code">
|
||||||
|
<el-input v-model="typeParamsLv2.code" disabled />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<!-- form-修改 -->
|
||||||
|
<el-form
|
||||||
|
label-width="100px"
|
||||||
|
size="medium"
|
||||||
|
ref="typeEditParamsRef"
|
||||||
|
:model="typeEditParams"
|
||||||
|
:rules="typeEditParamsRules"
|
||||||
|
v-if="subSort === 2"
|
||||||
|
>
|
||||||
|
<el-form-item label="仓库信息" prop="store">
|
||||||
|
<el-select
|
||||||
|
v-model="typeEditParams.store"
|
||||||
|
>
|
||||||
|
<!-- <el-option
|
||||||
|
v-for="item in unitSelRange"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
>
|
||||||
|
</el-option>-->
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="施工类型" prop="constructionType">
|
||||||
|
<el-input v-model="typeEditParams.constructionType" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="物资名称" prop="materialName">
|
||||||
|
<el-input v-model="typeEditParams.materialName" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="物资类型" prop="materialType">
|
||||||
|
<el-input v-model="typeEditParams.materialType" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<!-- 新增-按钮群 -->
|
||||||
|
<div
|
||||||
|
v-if="subSort === 1"
|
||||||
|
style="display: flex; justify-content: right"
|
||||||
|
>
|
||||||
|
<el-button type="success" @click="onSubmitAdd(sendData.level)">确认</el-button>
|
||||||
|
<el-button
|
||||||
|
@click="
|
||||||
|
() => {
|
||||||
|
this.$emit('closeDialog')
|
||||||
|
}
|
||||||
|
"
|
||||||
|
>取消</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<!-- 编辑-按钮群 -->
|
||||||
|
<div
|
||||||
|
v-if="subSort === 2"
|
||||||
|
style="display: flex; justify-content: right"
|
||||||
|
>
|
||||||
|
<el-button type="success" @click="onSubmitEdit()">确认</el-button>
|
||||||
|
<el-button
|
||||||
|
@click="
|
||||||
|
() => {
|
||||||
|
this.$emit('closeDialog')
|
||||||
|
}
|
||||||
|
"
|
||||||
|
>取消</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
queryContactUnitsSelApi
|
||||||
|
} from '@/api/base/customer'
|
||||||
|
import {
|
||||||
|
queryProjectSelApi
|
||||||
|
} from '@/api/base/project'
|
||||||
|
import {
|
||||||
|
queryIdWhenAddMa
|
||||||
|
} from '@/api/material/type'
|
||||||
|
export default {
|
||||||
|
name: 'FormType',
|
||||||
|
props: {
|
||||||
|
editParams: {
|
||||||
|
type: Object,
|
||||||
|
default: () => null,
|
||||||
|
},
|
||||||
|
sendData: {
|
||||||
|
type: Object,
|
||||||
|
default: () => null
|
||||||
|
},
|
||||||
|
sendInfo: {
|
||||||
|
type: Object | Array,
|
||||||
|
default: () => null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
console.log(this.sendData)
|
||||||
|
// if(this.extraData == null) this.$modal.msgError("请在左侧菜单选择设备类型!");
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
if (this.editParams) {
|
||||||
|
Object.assign(this.typeEditParams, this.editParams)
|
||||||
|
this.subSort = 2
|
||||||
|
} else {
|
||||||
|
this.subSort = 1
|
||||||
|
// 新增时调用查取id的接口
|
||||||
|
queryIdWhenAddMa({
|
||||||
|
id: this.sendData.id
|
||||||
|
}).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
// 根据不同level置入表单中
|
||||||
|
switch(this.sendData.level) {
|
||||||
|
case 0:
|
||||||
|
this.typeParamsLv0.code = res.data.code
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
this.typeParamsLv1.code = res.data.code
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
this.typeParamsLv2.code = res.data.code
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}).catch(err => {})
|
||||||
|
}
|
||||||
|
console.log(this.subSort)
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
subSort: null, // 提交类型:新增 1 / 修改 2
|
||||||
|
// 物资新增表单 Lv0
|
||||||
|
typeParamsLv0: {
|
||||||
|
code: undefined,
|
||||||
|
name: undefined,
|
||||||
|
},
|
||||||
|
// 物资新增表单 Lv1
|
||||||
|
typeParamsLv1: {
|
||||||
|
code: undefined
|
||||||
|
},
|
||||||
|
// 物资新增表单 Lv2
|
||||||
|
typeParamsLv2: {
|
||||||
|
code: undefined
|
||||||
|
},
|
||||||
|
// 物资修改表单
|
||||||
|
typeEditParams: {
|
||||||
|
store: '', // 仓库信息
|
||||||
|
constructionType: '', // 施工类型
|
||||||
|
materialName: '', // 物资名称
|
||||||
|
materialType: '', // 物资类型
|
||||||
|
},
|
||||||
|
fileList: [],
|
||||||
|
// 租赁单位下拉框
|
||||||
|
unitSelRange: [],
|
||||||
|
// 租赁工程下拉框
|
||||||
|
projSelRange: [],
|
||||||
|
// 校验规则
|
||||||
|
typeEditParamsRules: {
|
||||||
|
/* scrapNum: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '请选择租赁单位',
|
||||||
|
trigger: 'blur',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
pro_unit: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '请输入授权人',
|
||||||
|
trigger: 'blur',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
pro_type_of: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '请选择租赁工程',
|
||||||
|
trigger: 'blur',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
pro_type: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '请输入联系电话',
|
||||||
|
trigger: 'blur',
|
||||||
|
},
|
||||||
|
], */
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询往来单位下拉框 */
|
||||||
|
queryUnitSel() {
|
||||||
|
queryContactUnitsSelApi().then(res => {
|
||||||
|
console.log(res)
|
||||||
|
this.unitSelRange = res.data.map(item => {
|
||||||
|
return {
|
||||||
|
label: item.name,
|
||||||
|
value: item.id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}).catch(err => {})
|
||||||
|
},
|
||||||
|
/** 查询租赁工程下拉框 */
|
||||||
|
queryProjSel() {
|
||||||
|
queryProjectSelApi().then(res => {
|
||||||
|
console.log(res)
|
||||||
|
this.projSelRange = res.data.map(item => {
|
||||||
|
return {
|
||||||
|
label: item.name,
|
||||||
|
value: item.id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}).catch(err => {})
|
||||||
|
},
|
||||||
|
/** 上传图片 */
|
||||||
|
imgUpLoad(param) {
|
||||||
|
console.log(param)
|
||||||
|
imgUpLoad(param).then(res => {
|
||||||
|
console.log(res, process.env.VUE_APP_BASE_API)
|
||||||
|
this.protocolParams.url = res.data.url
|
||||||
|
}).catch(err => {})
|
||||||
|
},
|
||||||
|
/** 确认按钮-新增 */
|
||||||
|
onSubmitAdd(level) {
|
||||||
|
switch(level) {
|
||||||
|
case 0:
|
||||||
|
console.log(this.typeParamsLv0)
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
console.log(this.typeParamsLv1)
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
console.log(this.typeParamsLv2)
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
/* this.$refs.typeEditParamsRef.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
console.log('校验通过', this.typeEditParams)
|
||||||
|
// 1. 表单校验通过后调后台 Api
|
||||||
|
if(this.subSort === 1) {
|
||||||
|
addProtocolApi(this.protocolParams).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
}).catch(err => {
|
||||||
|
console.log(err)
|
||||||
|
})
|
||||||
|
} else if(this.subSort === 2) {
|
||||||
|
editProtocolApi(this.protocolParams).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
}).catch(err => {
|
||||||
|
console.log(err)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 2. 成功之后通知父组件关闭弹框
|
||||||
|
this.$emit('closeDialog', true)
|
||||||
|
}
|
||||||
|
}) */
|
||||||
|
},
|
||||||
|
/** 确认按钮-编辑 */
|
||||||
|
onSubmitEdit() {
|
||||||
|
console.log(this.typeEditParams)
|
||||||
|
/* this.$refs.typeEditParamsRef.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
console.log('校验通过', this.typeEditParams)
|
||||||
|
// 1. 表单校验通过后调后台 Api
|
||||||
|
if(this.subSort === 1) {
|
||||||
|
addProtocolApi(this.protocolParams).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
}).catch(err => {
|
||||||
|
console.log(err)
|
||||||
|
})
|
||||||
|
} else if(this.subSort === 2) {
|
||||||
|
editProtocolApi(this.protocolParams).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
}).catch(err => {
|
||||||
|
console.log(err)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 2. 成功之后通知父组件关闭弹框
|
||||||
|
this.$emit('closeDialog', true)
|
||||||
|
}
|
||||||
|
}) */
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
::v-deep .el-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
::v-deep .el-form-item__label{
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
export const formLabel = [
|
||||||
|
{ f_label: '类型名称', f_model: 'typeName', f_type: 'ipt' },
|
||||||
|
]
|
||||||
|
export const columnsList = [
|
||||||
|
{ t_props: 'code', t_label: '类型编码', },
|
||||||
|
{ t_props: 'typeId', t_label: '仓库信息' },
|
||||||
|
{ t_props: 'constructionType', t_label: '施工类型' },
|
||||||
|
{ t_props: 'materialType', t_label: '物资类型', },
|
||||||
|
{ t_props: 'materialName', t_label: '物资名称', },
|
||||||
|
{ t_props: 'specificationCode', t_label: '规格型号' },
|
||||||
|
]
|
||||||
|
export const dialogConfig = {
|
||||||
|
outerWidth: '40%',
|
||||||
|
outerTitle: '',
|
||||||
|
outerVisible: false,
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,196 @@
|
||||||
|
<template>
|
||||||
|
<!-- 协议管理页面 -->
|
||||||
|
<div class="app-container">
|
||||||
|
<el-col :span="4" :xs="24" style="margin-right: 15px">
|
||||||
|
<div class="head-container">
|
||||||
|
<el-input
|
||||||
|
v-model="typeName"
|
||||||
|
placeholder="请输入类型名称"
|
||||||
|
clearable
|
||||||
|
maxlength="50"
|
||||||
|
size="small"
|
||||||
|
prefix-icon="el-icon-search"
|
||||||
|
style="margin-bottom: 20px"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="head-container">
|
||||||
|
<el-tree
|
||||||
|
style="height: 700px; overflow: scroll"
|
||||||
|
:data="treeOptions"
|
||||||
|
:props="defaultProps"
|
||||||
|
:expand-on-click-node="false"
|
||||||
|
:filter-node-method="filterNode"
|
||||||
|
ref="tree"
|
||||||
|
node-key="id"
|
||||||
|
default-expand-all
|
||||||
|
highlight-current
|
||||||
|
@node-click="handleNodeClick"
|
||||||
|
>
|
||||||
|
<span class="custom-tree-node" slot-scope="{ node, data }" style="font-size: 14px">
|
||||||
|
<i v-if="node.level <= 2" class="el-icon-folder" style="color: #fabd16" />
|
||||||
|
<i v-else-if="node.level > 2" class="el-icon-document" style="color: #C0C0C0" />
|
||||||
|
{{ data.label }}
|
||||||
|
</span>
|
||||||
|
</el-tree>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<TableModel
|
||||||
|
:formLabel="formLabel"
|
||||||
|
:columnsList="columnsList"
|
||||||
|
:request-api="queryMaListApi"
|
||||||
|
|
||||||
|
:show-sel="false"
|
||||||
|
ref="tableRef"
|
||||||
|
|
||||||
|
style="display: flex; flex-direction: column"
|
||||||
|
>
|
||||||
|
<template slot="btn" slot-scope="{ queryParams }">
|
||||||
|
<el-button type="primary" @click="handleAddData(transLevel)"
|
||||||
|
>新增</el-button>
|
||||||
|
<el-button @click="handleExportData(queryParams, 'base/agreement/export', '物资清单')"
|
||||||
|
>导出</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.id)"
|
||||||
|
>删除</el-button
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
<!-- <template slot="url" slot-scope="{ data }">
|
||||||
|
<img :src="data.url" style="width: 50px; height: 50px">
|
||||||
|
</template>-->
|
||||||
|
</TableModel>
|
||||||
|
|
||||||
|
<!-- 新增以及修改时的弹框 -->
|
||||||
|
<DialogModel
|
||||||
|
:dialogConfig="dialogConfig"
|
||||||
|
@closeDialogOuter="closeDialogOuter"
|
||||||
|
>
|
||||||
|
<template slot="outerContent">
|
||||||
|
<!-- 新增以及修改数据的表单组件 -->
|
||||||
|
<FormType
|
||||||
|
@closeDialog="closeDialog"
|
||||||
|
:edit-params="editParams"
|
||||||
|
:send-data="transData"
|
||||||
|
:send-info="transInfo"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</DialogModel>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { formLabel, columnsList, dialogConfig } from './config'
|
||||||
|
import { commonMixin } from '../mixins/common'
|
||||||
|
import FormType from './components/form-type.vue'
|
||||||
|
import {
|
||||||
|
queryMaTypeTreeListApi,
|
||||||
|
queryMaListApi
|
||||||
|
} from '@/api/material/type'
|
||||||
|
export default {
|
||||||
|
name: 'typeManage',
|
||||||
|
mixins: [commonMixin], // 混入公共方法和数据
|
||||||
|
components: {
|
||||||
|
FormType,
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getTreeData()
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
// 根据名称筛选部门树
|
||||||
|
typeName(val) {
|
||||||
|
this.$refs.tree.filter(val)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取树形数据
|
||||||
|
getTreeData() {
|
||||||
|
queryMaTypeTreeListApi().then(res => {
|
||||||
|
res.data.forEach(item => {
|
||||||
|
this.rootOpt[0].children.push(item)
|
||||||
|
})
|
||||||
|
this.treeOptions = this.rootOpt
|
||||||
|
// this.treeOptions = res.data
|
||||||
|
}).catch(err => {})
|
||||||
|
},
|
||||||
|
// 筛选节点 - 左侧树
|
||||||
|
filterNode(value, data) {
|
||||||
|
if (!value) return true
|
||||||
|
return data.label.indexOf(value) !== -1
|
||||||
|
},
|
||||||
|
// 节点单击事件 - 左侧树
|
||||||
|
handleNodeClick(data) {
|
||||||
|
console.log(data)
|
||||||
|
/* queryMaListApi({
|
||||||
|
typeId: data.id
|
||||||
|
}).then(res => {
|
||||||
|
this.transInfo = res.data.rows
|
||||||
|
console.log(this.transInfo)
|
||||||
|
}) */
|
||||||
|
this.transLevel = data.level
|
||||||
|
this.transData = data
|
||||||
|
this.$refs.tableRef.queryTableList({
|
||||||
|
typeId: data.id
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
formLabel,
|
||||||
|
columnsList,
|
||||||
|
dialogConfig,
|
||||||
|
// 新建时弹框标题
|
||||||
|
addDialogTitle: '新增物资类型',
|
||||||
|
// 修改时弹框标题
|
||||||
|
editDialogTitle: '修改物资类型',
|
||||||
|
|
||||||
|
/** 树形组件数据 */
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
typeName: undefined,
|
||||||
|
},
|
||||||
|
// 类型名称
|
||||||
|
typeName: undefined,
|
||||||
|
// // 类型id
|
||||||
|
// sendData: {
|
||||||
|
// typeId: undefined,
|
||||||
|
// },
|
||||||
|
// 树选项
|
||||||
|
treeOptions: undefined,
|
||||||
|
// 根级
|
||||||
|
rootOpt: [
|
||||||
|
{
|
||||||
|
companyId: null,
|
||||||
|
id: 0,
|
||||||
|
label: '宏源工业园仓库',
|
||||||
|
level: 0,
|
||||||
|
parentId: null,
|
||||||
|
children: []
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 默认属性
|
||||||
|
defaultProps: {
|
||||||
|
children: 'children',
|
||||||
|
label: 'label',
|
||||||
|
},
|
||||||
|
// 查询右侧数据
|
||||||
|
queryMaListApi,
|
||||||
|
// 传递给表单的数据, level, 数据
|
||||||
|
transData: null,
|
||||||
|
transLevel: null,
|
||||||
|
transInfo: null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
Loading…
Reference in New Issue