gitee/vben-web
1
0
Fork 1
mirror of https://gitee.com/vben/vben-web.git synced 2026-10-06 14:13:10 +08:00
Code Issues Packages Projects Releases Wiki Activity

~

Browse Source
This commit is contained in:
zsvg
2022-06-17 18:22:43 +08:00
parent ba9cb8817f
commit ff2d3623a8
10 changed files with 2355 additions and 1304 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/de/supp/main/edit.vue
+285 -227
View File
@@ -1,293 +1,351 @@
<template>
<el-card class='box-card' :body-style="{padding:'2px 8px'}" shadow='never'>
<template #header>
<el-row>
<el-col :span='10'>
<div style='line-height: 32px'>供应商编辑</div>
</el-col>
<el-col :span='14' style='text-align: right'>
<el-button type='success' @click='tabSave({formRef,state,proxy,route})' plain>保 存</el-button>
<el-button type='info' @click='tabClose({proxy,route})' plain>关 闭</el-button>
</el-col>
</el-row>
</template>
<div style='margin-top: 8px;margin-bottom: 8px'>
<el-form ref="formRef" :inline="true" class='yform' :model='form' label-width='140px'>
<el-tabs type='card' v-model='activeName'>
<el-tab-pane label='基本信息' name='tab1'>
<div class="yform-div">
<el-form-item label='供应商名称：' prop='name' style="width:50%" :rules="[{ required: true, message: '名称不能为空'}]">
<el-input v-model='form.name'/>
</el-form-item>
<el-form-item label='供应商分类：' prop='catid' style="width:25%" :rules="[{ required: true, message: '客户分类不能为空'}]">
<el-tree-select placeholder='请选择' default-expand-all :props="{value:'id',label:'name'}" v-model="form.catid" :data="state.cates"
check-strictly style="width: 100%;" clearable/>
</el-form-item>
<el-form-item label='供应商编号：' style='width: 25%'>
<span class="zinput" v-show='form.id' style='margin-left: 5px;color: green'>{{ form.senum }}</span>
<span class="zinput" v-show='!form.id' style='margin-left: 5px;color: #b9abab'>提交后自动生成</span>
</el-form-item>
<el-form-item label='供应商地址：' style='width: 100%'>
<el-input v-model='form.addre' readonly @click='chooseAddr'></el-input>
</el-form-item>
<el-form-item label='供应商资质：' style='width: 50%'>
<el-select v-model='form.level' placeholder='请选择' style='width: 100%'>
<el-option v-for='item in state.levels' :key='item.id' :value='item.id' :label='item.name'/>
</el-select>
</el-form-item>
<el-form-item label='经办人：' style='width: 50%'>
<el-input v-model='opmanName' @click='openOpmanModal' readonly></el-input>
</el-form-item>
<el-form-item label='联系人：' style='width: 100%'>
<el-table size="small" border :data='form.contacts' :row-style="{height: '36px'}" style='width: 100%'>
<el-table-column label='排序号' width='90'>
<template #default='scope'>
<el-input-number v-model='scope.row.ornum' controls-position='right' style='width: 100%'/>
</template>
</el-table-column>
<el-table-column label='姓名' width='100'>
<template #default='scope'>
<el-input v-model='scope.row.name' required></el-input>
</template>
</el-table-column>
<el-table-column label='手机号' width='150'>
<template #default='scope'>
<el-input v-model='scope.row.monum' required></el-input>
</template>
</el-table-column>
<el-table-column label='邮箱' width='150'>
<template #default='scope'>
<el-input v-model='scope.row.email' required></el-input>
</template>
</el-table-column>
<el-table-column label='性别' width='80'>
<template #default='scope'>
<el-select v-model='scope.row.gender' placeholder=' ' style='width: 100%'>
<el-option value="m" label="男"/>
<el-option value="f" label="女"/>
</el-select>
</template>
</el-table-column>
<el-table-column label='职务' width='180'>
<template #default='scope'>
<el-input v-model='scope.row.post'></el-input>
</template>
</el-table-column>
<el-table-column label='备注'>
<template #default='scope'>
<el-input v-model='scope.row.notes'></el-input>
</template>
</el-table-column>
<el-table-column fixed='right' label='操作' width='50' align='center'>
<template #header>
<el-icon :size='22' style='top: 5px;cursor: pointer' color='#666'>
<ele-CirclePlus @click='addItem'/>
</el-icon>
</template>
<template #default='scope'>
<el-icon :size='22' style='top: 3px;cursor: pointer'>
<ele-CircleClose @click='form.contacts.splice(scope.$index, 1)'/>
</el-icon>
</template>
</el-table-column>
</el-table>
</el-form-item>
</div>
</el-tab-pane>
<el-tab-pane label='权限信息' name='tab9'>
<div class="yform-div">
<el-form-item label='备注：' style="width: 100%">
<el-input type='textarea' :rows='4' v-model='form.notes'/>
</el-form-item>
<el-form-item label='可查看者：' style='width: 50%'>
<el-input type='textarea' :rows='4' v-model='viewersName' readonly @click='openViewersModal'>
</el-input>
</el-form-item>
<el-form-item label='可编辑者：' style='width: 50%'>
<el-input type='textarea' :rows='4' v-model='editorsName' readonly @click='openEditorsModal'>
</el-input>
</el-form-item>
<el-form-item label='创建人：' style="width: 25%">
{{ form.crman ? form.crman.name : '' }}
</el-form-item>
<el-form-item label='创建时间：' style="width: 25%">
<div class='zinput'> {{ form.crtim }}</div>
</el-form-item>
<el-form-item label='更新人：' style="width: 25%">
{{ form.upman ? form.upman.name : '' }}
</el-form-item>
<el-form-item label='更新时间：' style="width: 25%">
<div class='zinput'> {{ form.uptim }}</div>
</el-form-item>
</div>
</el-tab-pane>
</el-tabs>
</el-form>
</div>
<OrgModal ref='orgModal' @close='closeOrgModal'/>
<Amap ref='amapRef' @close='closeAmap'/>
</el-card>
<el-card class='box-card' :body-style="{padding:'2px 8px'}" shadow='never'>
<template #header>
<el-row>
<el-col :span='10'>
<div style='line-height: 32px'>供应商编辑</div>
</el-col>
<el-col :span='14' style='text-align: right'>
<el-button type='success' @click='tabSave({formRef,state,proxy,route})' plain>保 存</el-button>
<el-button type='info' @click='tabClose({proxy,route})' plain>关 闭</el-button>
</el-col>
</el-row>
</template>
<div style='margin-top: 8px;margin-bottom: 8px'>
<el-form ref='formRef' :inline='true' class='yform' :model='form' label-width='140px'>
<el-tabs type='card' v-model='activeName'>
<el-tab-pane label='基本信息' name='tab1'>
<div class='yform-div'>
<el-form-item label='供应商名称：' prop='name' style='width:50%' :rules="[{ required: true, message: '名称不能为空'}]">
<el-input v-model='form.name' />
</el-form-item>
<el-form-item label='供应商分类：' prop='catid' style='width:25%' :rules="[{ required: true, message: '客户分类不能为空'}]">
<el-tree-select placeholder='请选择' default-expand-all :props="{value:'id',label:'name'}" v-model='form.catid' :data='state.cates'
check-strictly style='width: 100%;' clearable />
</el-form-item>
<el-form-item label='供应商编号：' style='width: 25%'>
<span class='zinput' v-show='form.id' style='margin-left: 5px;color: green'>{{ form.senum }}</span>
<span class='zinput' v-show='!form.id' style='margin-left: 5px;color: #b9abab'>提交后自动生成</span>
</el-form-item>
<el-form-item label='供应商地址：' style='width: 100%'>
<el-input v-model='form.addre' readonly @click='chooseAddr'></el-input>
</el-form-item>
<el-form-item label='供应商资质：' style='width: 50%'>
<el-select v-model='form.level' placeholder='请选择' style='width: 100%'>
<el-option v-for='item in state.levels' :key='item.id' :value='item.id' :label='item.name' />
</el-select>
</el-form-item>
<el-form-item label='经办人：' style='width: 50%'>
<el-input v-model='opmanName' @click='openOpmanModal' readonly></el-input>
</el-form-item>
<el-form-item label='联系人：' style='width: 100%'>
<el-table size='small' border :data='form.contacts' :row-style="{height: '36px'}" style='width: 100%'>
<el-table-column label='排序号' width='90'>
<template #default='scope'>
<el-input-number v-model='scope.row.ornum' controls-position='right' style='width: 100%' />
</template>
</el-table-column>
<el-table-column label='姓名' width='100'>
<template #default='scope'>
<el-input v-model='scope.row.name' required></el-input>
</template>
</el-table-column>
<el-table-column label='手机号' width='150'>
<template #default='scope'>
<el-input v-model='scope.row.monum' required></el-input>
</template>
</el-table-column>
<el-table-column label='邮箱' width='150'>
<template #default='scope'>
<el-input v-model='scope.row.email' required></el-input>
</template>
</el-table-column>
<el-table-column label='性别' width='80'>
<template #default='scope'>
<el-select v-model='scope.row.gender' placeholder=' ' style='width: 100%'>
<el-option value='m' label='男' />
<el-option value='f' label='女' />
</el-select>
</template>
</el-table-column>
<el-table-column label='职务' width='180'>
<template #default='scope'>
<el-input v-model='scope.row.post'></el-input>
</template>
</el-table-column>
<el-table-column label='备注'>
<template #default='scope'>
<el-input v-model='scope.row.notes'></el-input>
</template>
</el-table-column>
<el-table-column fixed='right' label='操作' width='50' align='center'>
<template #header>
<el-icon :size='22' style='top: 5px;cursor: pointer' color='#666'>
<ele-CirclePlus @click='addItem' />
</el-icon>
</template>
<template #default='scope'>
<el-icon :size='22' style='top: 3px;cursor: pointer'>
<ele-CircleClose @click='form.contacts.splice(scope.$index, 1)' />
</el-icon>
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-form-item label='相关附件：' style='width: 100%'>
<el-upload
:action='state.uploadUrl' :headers='state.headers'
:on-preview='handlePreview' style='width:500px' :on-success='handleSuccess'
:on-remove='handleRemove'
multiple :limit='10' :on-exceed='handleExceed' :file-list='form.atts'>
<el-button type='primary'>上传附件</el-button>
</el-upload>
</el-form-item>
</div>
</el-tab-pane>
<el-tab-pane label='权限信息' name='tab9'>
<div class='yform-div'>
<el-form-item label='备注：' style='width: 100%'>
<el-input type='textarea' :rows='4' v-model='form.notes' />
</el-form-item>
<el-form-item label='可查看者：' style='width: 50%'>
<el-input type='textarea' :rows='4' v-model='viewersName' readonly @click='openViewersModal'>
</el-input>
</el-form-item>
<el-form-item label='可编辑者：' style='width: 50%'>
<el-input type='textarea' :rows='4' v-model='editorsName' readonly @click='openEditorsModal'>
</el-input>
</el-form-item>
<el-form-item label='创建人：' style='width: 25%'>
{{ form.crman ? form.crman.name : '' }}
</el-form-item>
<el-form-item label='创建时间：' style='width: 25%'>
<div class='zinput'> {{ form.crtim }}</div>
</el-form-item>
<el-form-item label='更新人：' style='width: 25%'>
{{ form.upman ? form.upman.name : '' }}
</el-form-item>
<el-form-item label='更新时间：' style='width: 25%'>
<div class='zinput'> {{ form.uptim }}</div>
</el-form-item>
</div>
</el-tab-pane>
</el-tabs>
</el-form>
</div>
<OrgModal ref='orgModal' @close='closeOrgModal' />
<Amap ref='amapRef' @close='closeAmap' />
</el-card>
</template>
<script lang='ts'>
export default {name: 'DeCustMainEdit}'};
export default { name: 'DeCustMainEdit}' };
</script>
<script lang='ts' setup>
import {computed, getCurrentInstance, onMounted, reactive, ref, toRaw, toRefs} from 'vue';
import {editInit, tabSave, tabClose} from '/@/comps/page/edit';
import {useRoute} from 'vue-router';
import {FormInstance} from "element-plus";
import request from "/@/utils/request";
import { computed, getCurrentInstance, onMounted, reactive, ref, toRaw, toRefs } from 'vue';
import { editInit, tabSave, tabClose } from '/@/comps/page/edit';
import { useRoute } from 'vue-router';
import { ElMessage, ElMessageBox, FormInstance } from 'element-plus';
import request from '/@/utils/request';
import OrgModal from '/@/comps/sys/OrgModal.vue';
import Amap from '/@/comps/ass/amap.vue';
import {uuid} from '/@/utils/xutil';
import { uuid } from '/@/utils/xutil';
import type { UploadProps } from 'element-plus';
import { Session } from '/@/utils/storage';
const route = useRoute();
const formRef = ref<FormInstance>();
const {proxy} = getCurrentInstance() as any;
const { proxy } = getCurrentInstance() as any;
const activeName = ref('tab1');
const state = reactive({
url: '/de/supp/main', cates: [] as any, levels: [] as any,
params: {path: '', query: ''},
form: {avtag: true, contacts: [] as any} as any,
url: '/de/supp/main', cates: [] as any, levels: [] as any,
params: { path: '', query: '' },
form: { avtag: true, contacts: [] as any, atts: [] as any } as any,
uploadUrl: '', headers: {} as any,
});
const {form} = toRefs(state);
const { form } = toRefs(state);
onMounted(async () => {
await editInit({state, route});
await catesInit();
await levelsInit();
await editInit({ state, route });
await catesInit();
await levelsInit();
state.uploadUrl = `${import.meta.env.VITE_API_URL}gen/att/up`;
state.headers = { 'Authorization': Session.get('token') };
});
//region -----组织架构逻辑-----
const orgModal = ref();
const openOpmanModal = () => {
orgModal.value.openModal({
opener: 'opman',
orgType: 8,
});
orgModal.value.openModal({
opener: 'opman',
orgType: 8,
});
};
const openViewersModal = () => {
orgModal.value.openModal({
opener: 'viewers',
orgType: 11,
selectMode: 2,
orgs: toRaw(form.value.viewers),
});
orgModal.value.openModal({
opener: 'viewers',
orgType: 11,
selectMode: 2,
orgs: toRaw(form.value.viewers),
});
};
const openEditorsModal = () => {
orgModal.value.openModal({
opener: 'editors',
orgType: 11,
selectMode: 2,
orgs: toRaw(form.value.editors),
});
orgModal.value.openModal({
opener: 'editors',
orgType: 11,
selectMode: 2,
orgs: toRaw(form.value.editors),
});
};
const closeOrgModal = (data: any) => {
if (data.opener == 'viewers') {
if (data.orgs && data.orgs.length > 0) {
form.value.viewers = data.orgs;
} else {
form.value.viewers = null;
}
} else if (data.opener == 'editors') {
if (data.orgs && data.orgs.length > 0) {
form.value.editors = data.orgs;
} else {
form.value.editors = null;
}
} else if (data.opener == 'opman') {
if (data.orgs && data.orgs.length > 0) {
form.value.opman = {};
form.value.opman = { id: data.orgs[0].id, name: data.orgs[0].name };
form.value.opmid = data.orgs[0].id;
} else {
form.value.opman = null;
form.value.opmid = null;
}
}
if (data.opener == 'viewers') {
if (data.orgs && data.orgs.length > 0) {
form.value.viewers = data.orgs;
} else {
form.value.viewers = null;
}
} else if (data.opener == 'editors') {
if (data.orgs && data.orgs.length > 0) {
form.value.editors = data.orgs;
} else {
form.value.editors = null;
}
} else if (data.opener == 'opman') {
if (data.orgs && data.orgs.length > 0) {
form.value.opman = {};
form.value.opman = { id: data.orgs[0].id, name: data.orgs[0].name };
form.value.opmid = data.orgs[0].id;
} else {
form.value.opman = null;
form.value.opmid = null;
}
}
};
const opmanName = computed(() => {
return form.value.opman ? form.value.opman.name : '';
return form.value.opman ? form.value.opman.name : '';
});
const viewersName = computed(() => {
let names = '';
if (form.value.viewers && form.value.viewers.length > 0) {
for (const user of form.value.viewers) {
names += user.name + '；';
}
}
return names;
let names = '';
if (form.value.viewers && form.value.viewers.length > 0) {
for (const user of form.value.viewers) {
names += user.name + '；';
}
}
return names;
});
const editorsName = computed(() => {
let names = '';
if (form.value.editors && form.value.editors.length > 0) {
for (const user of form.value.editors) {
names += user.name + '；';
}
}
return names;
let names = '';
if (form.value.editors && form.value.editors.length > 0) {
for (const user of form.value.editors) {
names += user.name + '；';
}
}
return names;
});
//endregion
//region -----地址选择逻辑-----
const amapRef = ref();
const chooseAddr = () => {
amapRef.value.openModal({adcoo: form.value.adcoo, adreg: form.value.adreg, addet: form.value.addet, adzoo: ''});
amapRef.value.openModal({ adcoo: form.value.adcoo, adreg: form.value.adreg, addet: form.value.addet, adzoo: '' });
};
const closeAmap = (data: any) => {
if (data) {
form.value.addre = data.adreg + data.addet;
form.value.adcoo = data.adcoo;
form.value.adreg = data.adreg;
form.value.addet = data.addet;
form.value.adpro = data.adpro;
form.value.adcit = data.adcit;
form.value.addis = data.addis;
}
if (data) {
form.value.addre = data.adreg + data.addet;
form.value.adcoo = data.adcoo;
form.value.adreg = data.adreg;
form.value.addet = data.addet;
form.value.adpro = data.adpro;
form.value.adcit = data.adcit;
form.value.addis = data.addis;
}
};
//endregion
//region -----联系人逻辑-----
const addItem = () => {
let newOrnum = 1;
if (form.value.contacts.length > 0) {
newOrnum = form.value.contacts[form.value.contacts.length - 1].ornum + 1;
}
if (form.value.id) {
form.value.contacts.push({
id: uuid(), maiid: form.value.id, ornum: newOrnum,
})
} else {
form.value.contacts.push({
id: uuid(), ornum: newOrnum,
})
}
let newOrnum = 1;
if (form.value.contacts.length > 0) {
newOrnum = form.value.contacts[form.value.contacts.length - 1].ornum + 1;
}
if (form.value.id) {
form.value.contacts.push({
id: uuid(), maiid: form.value.id, ornum: newOrnum,
});
} else {
form.value.contacts.push({
id: uuid(), ornum: newOrnum,
});
}
};
//endregiton
//region -----附件逻辑-----
const handleRemove: UploadProps['onRemove'] = (file, uploadFiles) => {
console.log(file, uploadFiles);
};
const handlePreview: UploadProps['onPreview'] = (uploadFile) => {
console.log(uploadFile);
ElMessageBox.confirm('请选择对应的附件操作', '附件操作',
{
confirmButtonText: '下载',
cancelButtonText: '预览',
type: 'info',
},
).then(async () => {
await request({
url: '/gen/att/path',
method: 'get',
params: { name: uploadFile.name, path: uploadFile.addre + '/' + uploadFile.id + '.' + uploadFile.sname },
responseType: 'blob',
});
}).catch(() => {
});
};
const handleSuccess = (a: any, b: any, c: any) => {
c[c.length - 1] = { ...a };
c[c.length - 1].name = a.pname + '.' + a.sname;
};
const handleExceed: UploadProps['onExceed'] = (files, uploadFiles) => {
ElMessage.warning(
`The limit is 3, you selected ${files.length} files this time, add up to ${
files.length + uploadFiles.length
} totally`,
);
};
//endregion
//region-----业务字典-----
const catesInit = async () => {
state.cates = await request({
url: '/de/supp/cate/treea',
method: 'get'
});
state.cates = await request({
url: '/de/supp/cate/treea',
method: 'get',
});
};
const levelsInit = async () => {
state.levels = await request({
url: '/ass/dict/data/list?maiid=SU_LEVEL',
method: 'get',
});
state.levels = await request({
url: '/ass/dict/data/list?maiid=SU_LEVEL',
method: 'get',
});
};
//endregion
</script>
src/pages/de/supp/main/index.vue
+3 -2
View File
@@ -31,13 +31,14 @@
border stripe @selection-change='listSelect($event,state)'>
<el-table-column type='selection' width='55' align='center'/>
<el-table-column label='序号' type='index' width='55' align='center'/>
<el-table-column label='供应商名称' width='180'>
<el-table-column label='供应商编号' width='160'>
<template #default='scope'>
<span style='cursor:pointer;color: #3e9ece' @click='tabEdit(state.url,scope.row.id)'>
{{ scope.row.name }}
{{ scope.row.senum }}
</span>
</template>
</el-table-column>
<el-table-column label='供应商名称' prop='name' width="180"/>
<el-table-column label='地址' prop='addre' width="350"/>
<el-table-column label='备注' prop='notes'/>
<el-table-column label='创建时间' prop='crtim' width='160'/>
src/pages/home/index2.vue → src/pages/home/sa.vue
View File
src/pages/sa/proj/main/edit.vue
+393 -10
View File
@@ -46,6 +46,178 @@
</el-form-item>
</div>
</el-tab-pane>
<el-tab-pane label='产品信息' name='tab2'>
<el-row style='background-color: white;margin-bottom: 10px;border: 0'>
<el-col :span='14'>
<el-input v-model='xname' placeholder='输入梯号回车查下' clearable style='height: 32px;width: 160px;margin-right: 10px' @keyup.enter='handleQuery' />
<el-button type='primary' @click='queryGroup' plain>查 询</el-button>
<el-button type='primary' @click='addGroup' plain>新 增</el-button>
<el-button type='primary' @click='upGroup' plain>上 移</el-button>
<el-button type='primary' @click='downGroup' plain>下 移</el-button>
<el-button type='primary' @click='handleQuery' plain>复 制</el-button>
<el-button type='primary' @click='delsGroup' plain>删 除</el-button>
<el-dropdown @command='handleCommand' style='margin-left: 10px;top:1px'>
<el-button type='primary' plain>更 多</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command='expandAll'>测试1</el-dropdown-item>
<el-dropdown-item command='collapseAll'>测试2</el-dropdown-item>
<el-dropdown-item command='refresh'>测试3</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-col>
<el-col :span='10' style='text-align: right'>
<el-button type='info' :icon='Upload' @click='handleImpQuote' plain>导入产品</el-button>
<el-button type='success' :icon='Upload' @click='handleDraw' plain>土建图申请</el-button>
<el-button type='danger' :icon='Upload' @click='handlePinshen' plain>土建图评审</el-button>
</el-col>
</el-row>
<el-table size='small' border :data='form.groups' :row-style="{height: '36px'}" row-key="id"
@selection-change='groupSelect' style='width: 100%'>
<el-table-column type='expand'>
<template #default='props'>
<el-row :gutter='10' style='background-color: white;border: 0;margin-left: 4px;margin-right: 4px'>
<el-col :span='12'>
<el-input size='small' style="font-family: 'Courier New', sans-serif; font-size:16px"
type='textarea' :rows='10' placeholder='更多信息1'
v-model='props.row.func1'>
</el-input>
</el-col>
<el-col :span='12'>
<el-input size='small' style="font-family: 'Courier New', sans-serif; font-size:16px"
type='textarea' :rows='10' placeholder='更多信息2'
v-model='props.row.func2'>
</el-input>
</el-col>
</el-row>
</template>
</el-table-column>
<el-table-column type='selection' width='30' align='center' />
<el-table-column label='排序' width='40'>
<template #default='scope'>
<span>{{ scope.row.ornum }}</span>
</template>
</el-table-column>
<el-table-column label='组名' width='40'>
<template #default='scope'>
{{ scope.row.grnam }}
</template>
</el-table-column>
<el-table-column label='版本号' width='90'>
<template #default='scope'>
<el-select size='small' v-model='scope.row.venum' placeholder=' ' style='width: 50px'>
<el-option size='small' :value="'V1'" :label="'V1'"></el-option>
<el-option size='small' :value="'V2'" :label="'V2'"></el-option>
<el-option size='small' :value="'V3'" :label="'V3'"></el-option>
</el-select>
<el-icon :size='18' style='top:4px;margin-left: 3px;cursor: pointer' @click='addVersion()'>
<ele-CirclePlus />
</el-icon>
</template>
</el-table-column>
<el-table-column label='产品分类' width='80'>
<template #default='scope'>
<el-select size='small' v-model='scope.row.cate' placeholder=' ' @change='cateChange(scope.row)'>
<el-option size='small' :value="'dt'" :label="'电梯'"></el-option>
<el-option size='small' :value="'ft'" :label="'扶梯'"></el-option>
</el-select>
</template>
</el-table-column>
<el-table-column label='布局方式' width='100'>
<template #default='scope'>
<el-select size='small' v-model='scope.row.layout' placeholder=' ' @change='layoutChange(scope.row)'>
<el-option size='small' :value="'dt1'" :label="'单梯'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt21'" :label="'并联相同'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt22'" :label="'并联不同'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt3'" :label="'3台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt4'" :label="'4台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt5'" :label="'5台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt6'" :label="'6台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt7'" :label="'7台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt8'" :label="'8台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'ft1'" :label="'单台'" v-show="scope.row.cate=='ft'"></el-option>
<el-option :value="'ft21'" :label="'并列'" v-show="scope.row.cate=='ft'"></el-option>
<el-option :value="'ft22'" :label="'交叉'" v-show="scope.row.cate=='ft'"></el-option>
</el-select>
</template>
</el-table-column>
<el-table-column label='组数' width='46'>
<template #default='scope'>
<el-input size='small' v-model.number='scope.row.gramo' required @change='gramoChange(scope.row)'></el-input>
</template>
</el-table-column>
<el-table-column label='台数' width='46'>
<template #default='scope'>
{{ scope.row.seamo }}
</template>
</el-table-column>
<el-table-column label='梯号' width='100'>
<template #default='scope'>
<el-input size='small' v-model='prod.itnum' :key='prod.id' v-for='prod of scope.row.prods' style='margin-top: 2px;margin-bottom: 2px'></el-input>
</template>
</el-table-column>
<el-table-column label='型号规格' width='260'>
<template #default='scope'>
<div style='margin-top: 2px;margin-bottom: 2px;' :key='prod.id' v-for='prod of scope.row.prods'>
<el-icon :size='18' style='top:4px;margin-right: 3px;cursor: pointer' @click='prodChoose'>
<ele-Edit />
</el-icon>
<el-icon :size='18' style='top:4px;margin-right: 3px;cursor: pointer' @click='prodCopy'>
<ele-CopyDocument />
</el-icon>
<el-icon :size='18' style='top:4px;margin-right: 3px;cursor: pointer' @click='prodCompare'>
<ele-ScaleToOriginal />
</el-icon>
<span style='color: green;cursor: pointer' @click='featEdit(scope.row)'>KLKS-1000kg-1.0m/s-10/10/10</span>
</div>
</template>
</el-table-column>
<el-table-column label='备注'>
<template #default='scope'>
<el-input size='small' v-model='prod.notes' :key='prod.id' v-for='prod of scope.row.prods' style='margin-top: 2px;margin-bottom: 2px'></el-input>
</template>
</el-table-column>
<el-table-column fixed='right' label='操作' width='50' align='center'>
<template #header>
<el-icon :size='22' style='top: 5px;cursor: pointer' color='#666'>
<ele-CirclePlus @click='addGroup' />
</el-icon>
</template>
<template #default='scope'>
<el-icon :size='22' style='top: 3px;cursor: pointer'>
<ele-CircleClose @click='delGroup(scope.$index)' />
</el-icon>
</template>
</el-table-column>
<!-- <el-table-column label="Name" width="180">-->
<!-- <template #default="scope">-->
<!-- <el-popover effect="light" trigger="hover" placement="top" width="auto">-->
<!-- <template #default>-->
<!-- <div>name: {{ scope.row.name }}</div>-->
<!-- <div>address: {{ scope.row.id }}</div>-->
<!-- </template>-->
<!-- <template #reference>-->
<!-- <el-tag>{{ scope.row.name }}</el-tag>-->
<!-- </template>-->
<!-- </el-popover>-->
<!-- </template>-->
<!-- </el-table-column>-->
</el-table>
<el-pagination
@size-change='handleQuery' @current-change='handleQuery'
class='mt8' :pager-count='5' :page-sizes='[10, 20, 30]' background
:total='25' :current-page='1' :page-size='10'
layout='total, sizes, prev, pager, next, jumper'
/>
</el-tab-pane>
<el-tab-pane label='权限信息' name='tab9'>
<Perm ref='permRef' :form='form' v-if='state.permShow' @update='update' :orgModal='orgModal' />
</el-tab-pane>
@@ -66,7 +238,7 @@ export default { name: 'SaProjMainEdit' };
import { computed, getCurrentInstance, onMounted, reactive, ref, toRaw, toRefs } from 'vue';
import { useRoute } from 'vue-router';
import Cookies from 'js-cookie';
import { FormInstance } from 'element-plus';
import { ElMessage, ElMessageBox, FormInstance } from 'element-plus';
import request from '/@/utils/request';
import { tabSave, tabClose } from '/@/comps/page/edit';
import Amap from '/@/comps/ass/amap.vue';
@@ -74,6 +246,7 @@ import OrgModal from '/@/comps/sys/OrgModal.vue';
import CustModal from '/@/comps/gen/GenModal.vue';
import AgentModal from '/@/comps/gen/GenModal.vue';
import Perm from './perm.vue';
import { uuid } from '/@/utils/xutil';
const route = useRoute();
const formRef = ref<FormInstance>();
@@ -83,7 +256,8 @@ const activeName = ref('tab1');
const state = reactive({
url: '/sa/proj/main', permShow: false,
params: { path: '', query: '' }, levels: [] as any,
form: { avtag: true, items: [] as any } as any,
form: { avtag: true, groups: [] as any } as any,
groupSelectedIds: [],
});
const { form } = toRefs(state);
@@ -108,14 +282,14 @@ const editInit = async () => {
state.permShow = true;
};
//region ------客户与代理商选择逻辑------
//region -----客户与代理商选择逻辑-----
const agentModal = ref();
const chooseAgent = () => {
agentModal.value.openModal();
};
const agentModalChoose = (data:any) => {
form.value.ageid=data?data.id:null;
form.value.agena=data?data.name:null;
const agentModalChoose = (data: any) => {
form.value.ageid = data ? data.id : null;
form.value.agena = data ? data.name : null;
};
@@ -124,14 +298,14 @@ const chooseCust = () => {
custModal.value.openModal();
};
const custModalChoose = (data: any) => {
form.value.cusid=data.id;
form.value.cusna=data.name;
form.value.cusid = data.id;
form.value.cusna = data.name;
};
//endregion
//region ------组织架构选择逻辑------
//region -----组织架构选择逻辑-----
const orgModal = ref();
const openOrgModal = () => {
orgModal.value.openModal({
@@ -167,7 +341,7 @@ const update = (props: any) => {
//endregion
//region 地址选择逻辑
//region -----地址选择逻辑------
const amapRef = ref();
const chooseAddr = () => {
amapRef.value.openModal({ adcoo: form.value.adcoo, adreg: form.value.adreg, addet: form.value.addet, adzoo: '' });
@@ -187,6 +361,215 @@ const closeAmap = (data: any) => {
//endregion
//region -----产品页签逻辑------
const groupSelect = (selection: any) => {
state.groupSelectedIds = selection.map((item: any) => item.id);
};
const addGroup = () => {
const uid = uuid();
form.value.groups.push({ id: uid, cate: 'dt', gramo: '1', ornum: form.value.groups.length + 1 });
};
const delGroup = ($index: any) => {
form.value.groups.splice($index, 1);
for (let i = $index; i < form.value.groups.length; i++) {
form.value.groups[i].ornum = i + 1;
}
};
const delsGroup = () => {
if (state.groupSelectedIds.length <= 0) {
ElMessage.warning('请选择后再进行删除');
return;
}
ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(async () => {
for (let index = form.value.groups.length - 1; index >= 0; index--) {
for (let i = 0; i < state.groupSelectedIds.length; i++) {
if (state.groupSelectedIds[i] == form.value.groups[index].id) {
console.log(index);
form.value.groups.splice(index, 1);
break;
}
}
}
for (let i = 0; i < form.value.groups.length; i++) {
form.value.groups[i].ornum = i + 1;
}
})
.catch(() => ElMessage.info('已取消删除'));
};
const upGroup = () => {
if (state.groupSelectedIds.length <= 0) {
ElMessage.warning('请选择后再进行操作');
return;
}
for (let i = 0; i <= form.value.groups.length - 1; i++) {
for (let j = 0; j < state.groupSelectedIds.length; j++) {
if (state.groupSelectedIds[j] == form.value.groups[i].id) {
if (i == 0) {
ElMessage.warning('已经是第一项');
return;
} else {
let swap = form.value.groups[i - 1];
form.value.groups[i - 1]=form.value.groups[i];
form.value.groups[i - 1].ornum--;
form.value.groups[i]=swap;
form.value.groups[i].ornum++;
}
break;
}
}
}
};
const downGroup = () => {
if (state.groupSelectedIds.length <= 0) {
ElMessage.warning('请选择后再进行操作');
return;
}
for (let i = form.value.groups.length - 1; i >=0 ; i--) {
for (let j = state.groupSelectedIds.length-1; j>=0; j--) {
if (state.groupSelectedIds[j] == form.value.groups[i].id) {
if (i == form.value.groups.length-1) {
ElMessage.warning('已经是最后一项');
return;
} else {
console.log(111);
let swap = form.value.groups[i + 1];
form.value.groups[i + 1]=form.value.groups[i];
form.value.groups[i + 1].ornum++;
form.value.groups[i]=swap;
form.value.groups[i].ornum--;
}
break;
}
}
}
};
const cateChange = (row: any) => {
row.layout = '';
row.gramo = '';
row.seamo = '';
row.prods = [];
};
const layoutChange = (row: any) => {
if (!row.gramo) {
row.gramo = 1;
}
switch (row.layout) {
case 'dt1':
row.seamo = row.gramo;
row.prods = [{}];
break;
case 'dt21':
row.seamo = row.gramo * 2;
row.prods = [{}];
break;
case 'dt22':
row.seamo = row.gramo * 2;
row.prods = [{}, {}];
break;
case 'dt3':
row.seamo = row.gramo * 3;
row.prods = [{}, {}, {}];
break;
case 'dt4':
row.seamo = row.gramo * 4;
row.prods = [{}, {}, {}, {}];
break;
case 'dt5':
row.seamo = row.gramo * 5;
row.prods = [{}, {}, {}, {}, {}];
break;
case 'dt6':
row.seamo = row.gramo * 6;
row.prods = [{}, {}, {}, {}, {}, {}];
break;
case 'dt7':
row.seamo = row.gramo * 7;
row.prods = [{}, {}, {}, {}, {}, {}, {}];
break;
case 'dt8':
row.seamo = row.gramo * 8;
row.prods = [{}, {}, {}, {}, {}, {}, {}, {}];
break;
case 'ft1':
row.seamo = row.gramo;
row.prods = [{}];
break;
case 'ft21':
row.seamo = row.gramo * 2;
row.prods = [{}, {}];
break;
case 'ft22':
row.seamo = row.gramo * 2;
row.prods = [{}, {}];
break;
default :
row.seamo = '';
}
};
const gramoChange = (row: any) => {
if (row.gramo) {
switch (row.layout) {
case 'dt1':
row.seamo = row.gramo;
break;
case 'dt21':
row.seamo = row.gramo * 2;
break;
case 'dt22':
row.seamo = row.gramo * 2;
break;
case 'dt3':
row.seamo = row.gramo * 3;
break;
case 'dt4':
row.seamo = row.gramo * 4;
break;
case 'dt5':
row.seamo = row.gramo * 5;
break;
case 'dt6':
row.seamo = row.gramo * 6;
break;
case 'dt7':
row.seamo = row.gramo * 7;
break;
case 'dt8':
row.seamo = row.gramo * 8;
break;
case 'ft1':
row.seamo = row.gramo;
break;
case 'ft2':
row.seamo = row.gramo * 2;
break;
case 'ft3':
row.seamo = row.gramo * 3;
break;
default :
row.seamo = '';
}
}
};
//endregion
</script>
<style scoped>
src/pages/sa/proj/main/view.vue
+549 -29
View File
@@ -3,11 +3,11 @@
<template #header>
<el-row>
<el-col :span='10'>
<div style='line-height: 32px'>项目查看</div>
<div style='line-height: 32px;color: green'>{{ form.name }}</div>
</el-col>
<el-col :span='14' style='text-align: right'>
<el-button type='success' @click='viewToEdit({proxy,route,state})' plain>编 辑</el-button>
<el-button type='success' @click='editProd' plain>产品维护</el-button>
<el-button type='success' @click='viewToEdit({proxy,route,state})' plain>编辑项目</el-button>
<!-- <el-button type='success' @click='editProd' plain>产品维护</el-button>-->
<el-button type='info' @click='tabClose({proxy,route})' plain>关 闭</el-button>
</el-col>
</el-row>
@@ -24,7 +24,7 @@
<span class='zinput'>{{ form.senum }}</span>
</el-form-item>
<el-form-item label='项目地址：' style='width: 100%'>
<span class='zinput'>{{ form.addre }}</span>
<span class='zinput' @click='chooseAddr' style='cursor: pointer;color: #1f86d5'>{{ form.addre }}</span>
</el-form-item>
<el-form-item label='代理商经办人：'>
<span class='zinput'>{{ form.opmna }}</span>
@@ -33,6 +33,181 @@
</div>
</el-tab-pane>
<el-tab-pane label='产品信息' name='tab2'>
<div style='padding-bottom: 300px;' @click='prodDivClick'>
<el-row style='background-color: white;margin-bottom: 10px;border: 0'>
<el-col :span='14'>
<el-input v-model='state.senam' placeholder='输入梯号回车查下' clearable style='height: 32px;width: 160px;margin-right: 10px' @keyup.enter='handleQuery' />
<el-button type='primary' @click='handleQuery' plain>查 询</el-button>
<el-button type='primary' @click.stop='addGroup' plain>新 增</el-button>
<el-button type='primary' @click='upGroup' plain>上 移</el-button>
<el-button type='primary' @click='downGroup' plain>下 移</el-button>
<el-button type='primary' @click='copyGroup' plain>复 制</el-button>
<el-button type='primary' @click='delsGroup' plain>删 除</el-button>
<el-dropdown @command='handleCommand' style='margin-left: 10px;top:1px'>
<el-button type='primary' plain>更 多</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command='expandAll'>测试1</el-dropdown-item>
<el-dropdown-item command='collapseAll'>测试2</el-dropdown-item>
<el-dropdown-item command='refresh'>测试3</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-col>
<el-col :span='10' style='text-align: right'>
<el-button type='info' :icon='Upload' @click='handleImpQuote' plain>导入产品</el-button>
<el-button type='success' :icon='Upload' @click='handleDraw' plain>土建图申请</el-button>
<el-button type='danger' :icon='Upload' @click='handlePinshen' plain>土建图评审</el-button>
</el-col>
</el-row>
<el-table @row-click='(row,column,event)=>rowClick(row,column,event)' row-key='id' size='small' border :data='form.groups'
:row-style="{height: '36px'}" style='width: 100%' @selection-change='groupSelect'>
<el-table-column type='selection' width='30' align='center' />
<el-table-column label='排序' width='40'>
<template #default='scope'>
<span>{{ scope.row.ornum }}</span>
</template>
</el-table-column>
<!-- <el-table-column label='组名' width='40'>-->
<!-- <template #default='scope'>-->
<!-- {{ scope.row.grnam }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label='版本号' width='90'>-->
<!-- <template #default='scope'>-->
<!-- <el-select size='small' v-model='scope.row.venum' placeholder=' ' style='width: 50px'>-->
<!-- <el-option size='small' :value="'V1'" :label="'V1'"></el-option>-->
<!-- <el-option size='small' :value="'V2'" :label="'V2'"></el-option>-->
<!-- <el-option size='small' :value="'V3'" :label="'V3'"></el-option>-->
<!-- </el-select>-->
<!-- <el-icon :size='18' style='top:4px;margin-left: 3px;cursor: pointer' @click='addVersion()'>-->
<!-- <ele-CirclePlus />-->
<!-- </el-icon>-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label='产品分类' width='80'>
<template #default='scope'>
<el-select v-show='scope.row.edtag' size='small' v-model='scope.row.cate' placeholder=' ' @change='cateChange(scope.row)'>
<el-option size='small' :value="'dt'" :label="'电梯'"></el-option>
<el-option size='small' :value="'ft'" :label="'扶梯'"></el-option>
</el-select>
<span v-show='!scope.row.edtag'>
{{ scope.row.cate == 'dt' ? '电梯' : '扶梯' }}
</span>
</template>
</el-table-column>
<el-table-column label='布局方式' width='100'>
<template #default='scope'>
<el-select v-show='scope.row.edtag' size='small' v-model='scope.row.layout' placeholder=' ' @change='layoutChange(scope.row)'>
<el-option :value="'dt1'" :label="'单梯'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt21'" :label="'并联相同'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt22'" :label="'并联不同'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt3'" :label="'3台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt4'" :label="'4台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt5'" :label="'5台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt6'" :label="'6台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt7'" :label="'7台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'dt8'" :label="'8台群控'" v-show="scope.row.cate=='dt'"></el-option>
<el-option :value="'ft1'" :label="'单台'" v-show="scope.row.cate=='ft'"></el-option>
<el-option :value="'ft21'" :label="'并列'" v-show="scope.row.cate=='ft'"></el-option>
<el-option :value="'ft22'" :label="'交叉'" v-show="scope.row.cate=='ft'"></el-option>
</el-select>
<span v-show='!scope.row.edtag'>
{{ layoutShow(scope.row.layout) }}
</span>
</template>
</el-table-column>
<el-table-column label='组数' width='46'>
<template #default='scope'>
<el-input v-show='scope.row.edtag' size='small' v-model.number='scope.row.gramo' required @change='gramoChange(scope.row)'></el-input>
<span v-show='!scope.row.edtag'>{{ scope.row.gramo }}</span>
</template>
</el-table-column>
<el-table-column label='台数' width='46'>
<template #default='scope'>
{{ scope.row.seamo }}
</template>
</el-table-column>
<el-table-column label='梯号' width='100'>
<template #default='scope'>
<el-input v-show='scope.row.edtag' size='small' v-model='prod.itnum' :key='prod.id' v-for='prod of scope.row.prods'
style='margin-top: 2px;margin-bottom: 2px' @change='itnumChange(scope.row)'></el-input>
<div v-show='!scope.row.edtag' :key='prod.id' v-for='prod of scope.row.prods' class='prod-row-view'>
{{ prod.itnum }}
</div>
</template>
</el-table-column>
<el-table-column label='型号规格' width='260'>
<template #default='scope'>
<div style='margin-top: 2px;margin-bottom: 2px;' :key='prod.id' v-for='prod of scope.row.prods'>
<el-icon :size='18' style='top:4px;margin-right: 3px;cursor: pointer' @click='prodChoose'>
<ele-Edit />
</el-icon>
<el-icon :size='18' style='top:4px;margin-right: 3px;cursor: pointer' @click='prodCopy'>
<ele-CopyDocument />
</el-icon>
<el-icon :size='18' style='top:4px;margin-right: 3px;cursor: pointer' @click='prodCompare'>
<ele-ScaleToOriginal />
</el-icon>
<span style='color: green;cursor: pointer' @click='featEdit(scope.row)'>KLKS-1000kg-1.0m/s-10/10/10</span>
</div>
<!-- <el-input :readonly='!scope.row.edtag' size='small' v-model='prod.model' :key='prod.id' v-for='prod of scope.row.prods' style='margin-top: 2px;margin-bottom: 2px'></el-input>-->
</template>
</el-table-column>
<el-table-column label='状态' width='40'>
待审
</el-table-column>
<el-table-column label='备注'>
<template #default='scope'>
<el-input v-show='scope.row.edtag' size='small' v-model='prod.notes' :key='prod.id' v-for='prod of scope.row.prods'
style='margin-top: 2px;margin-bottom: 2px' @change='notesChange(scope.row)'></el-input>
<div v-show='!scope.row.edtag' :key='prod.id' v-for='prod of scope.row.prods' class='prod-row-view'>
{{ prod.notes }}
</div>
</template>
</el-table-column>
<el-table-column fixed='right' label='操作' width='70' align='center'>
<template #header>
<el-icon :size='22' style='top: 5px;cursor: pointer' color='#666'>
<ele-CirclePlus @click='addGroup' />
</el-icon>
</template>
<template #default='scope'>
<!-- <el-button size='small' @click='handleEdit(scope.row)' plain v-show='!scope.row.edtag'>编 辑</el-button>-->
<!-- <el-button size='small' @click="form.groups.splice(scope.$index, 1)" plain v-show='!scope.row.edtag'>删 除</el-button>-->
<el-button size='small' @click.stop='updateGroup(scope.row)' plain v-show='scope.row.edtag'>保 存</el-button>
<!-- <el-button size='small' @click='handleCancel(scope.row)' plain v-show='scope.row.edtag'>取 消</el-button>-->
</template>
</el-table-column>
<!-- <el-table-column label="Name" width="180">-->
<!-- <template #default="scope">-->
<!-- <el-popover effect="light" trigger="hover" placement="top" width="auto">-->
<!-- <template #default>-->
<!-- <div>name: {{ scope.row.name }}</div>-->
<!-- <div>address: {{ scope.row.id }}</div>-->
<!-- </template>-->
<!-- <template #reference>-->
<!-- <el-tag>{{ scope.row.name }}</el-tag>-->
<!-- </template>-->
<!-- </el-popover>-->
<!-- </template>-->
<!-- </el-table-column>-->
</el-table>
<el-pagination
@size-change='handleQuery' @current-change='handleQuery'
class='mt8' :pager-count='5' :page-sizes='[10, 20, 30]' background
:total='25' :current-page='1' :page-size='10'
layout='total, sizes, prev, pager, next, jumper'
/>
</div>
</el-tab-pane>
<el-tab-pane label='权限信息' name='tab9'>
<div class='yform-div'>
@@ -64,18 +239,18 @@
</div>
<div id='simpleSquare'></div>
<OrgModal ref='orgModal' @close='closeOrgModal' />
<Amap ref='amapRef' @close='closeAmap' />
<Amap ref='amapRef' />
</el-card>
</template>
<script lang='ts' setup>
import { computed, getCurrentInstance, onMounted, reactive, ref, toRefs } from 'vue';
import { computed, getCurrentInstance, onMounted, reactive, ref, toRefs } from 'vue';
import { viewInit, tabClose, viewToEdit } from '/@/comps/page/view';
import { useRoute } from 'vue-router';
import OrgModal from '/@/comps/sys/OrgModal.vue';
import Amap from '/@/comps/ass/amap.vue';
import { FormInstance } from 'element-plus';
import { ElMessage, ElMessageBox, FormInstance } from 'element-plus';
import request from '/@/utils/request';
import router from '/@/router';
import { uuid } from '/@/utils/xutil';
const route = useRoute();
const formRef = ref<FormInstance>();
@@ -83,9 +258,10 @@ const { proxy } = getCurrentInstance() as any;
const activeName = ref('tab1');
const state = reactive({
url: '/sa/proj/main',
url: '/sa/proj/main', senam: '',
params: { path: '', query: '' }, levels: [] as any,
form: { avtag: true, items: [] as any } as any,
groupSelectedIds: [],
});
const { form } = toRefs(state);
@@ -97,13 +273,13 @@ onMounted(async () => {
});
const editProd = async () => {
proxy.mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
await router.push({
path: '/sa/prod/main',
query: { proj:state.form.id },
});
};
// const editProd = async () => {
// proxy.mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
// await router.push({
// path: '/sa/prod/main',
// query: { proj:state.form.id },
// });
// };
//region 经办人与可查看者选择逻辑
@@ -133,18 +309,6 @@ const amapRef = ref();
const chooseAddr = () => {
amapRef.value.openModal({ adcoo: form.value.adcoo, adreg: form.value.adreg, addet: form.value.addet, adzoo: '' });
};
const closeAmap = (data: any) => {
if (data) {
form.value.addre = data.adreg + data.addet;
form.value.adcoo = data.adcoo;
form.value.adreg = data.adreg;
form.value.addet = data.addet;
form.value.adpro = data.adpro;
form.value.adcit = data.adcit;
form.value.addis = data.addis;
}
};
//endregion
//region 业务字典逻辑
@@ -156,8 +320,364 @@ const levelsInit = async () => {
};
//endregion
//region-----产品逻辑-----
const addGroup = async () => {
const uid = uuid();
const newGroup = { chtag:false,prjid: form.value.id, id: uid, cate: 'dt', gramo: '1', edtag: true, ornum: form.value.groups.length + 1 };
form.value.groups.push(newGroup);
await insertGroup(newGroup);
if (lastId) {
for (const group of form.value.groups) {
if (group.id == lastId) {
group.edtag = false;
await updateGroup(group);
break;
}
}
}
lastId = uid;
};
const insertGroup = async (group: any) => {
await request({
url: '/sa/prod/group',
method: 'post',
data: group,
});
};
const updateGroup = async (group: any) => {
group.edtag = false;
console.log('是否保存到后台?');
if (group.chtag == true) {
console.log('保存到后台!');
await request({
url: '/sa/prod/group',
method: 'put',
data: group,
});
group.chtag = false;
}
};
const groupSelect = (selection: any) => {
state.groupSelectedIds = selection.map((item: any) => item.id);
};
// const delGroup = ($index: any) => {
// form.value.groups.splice($index, 1);
// for (let i = $index; i < form.value.groups.length; i++) {
// form.value.groups[i].ornum = i + 1;
// }
// };
const delsGroup = () => {
if (state.groupSelectedIds.length <= 0) {
ElMessage.warning('请选择后再进行删除');
return;
}
ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(async () => {
for (let index = form.value.groups.length - 1; index >= 0; index--) {
for (let i = 0; i < state.groupSelectedIds.length; i++) {
if (state.groupSelectedIds[i] == form.value.groups[index].id) {
console.log(index);
form.value.groups.splice(index, 1);
break;
}
}
}
for (let i = 0; i < form.value.groups.length; i++) {
form.value.groups[i].ornum = i + 1;
}
})
.catch(() => ElMessage.info('已取消删除'));
};
const upGroup = () => {
if (state.groupSelectedIds.length <= 0) {
ElMessage.warning('请选择后再进行操作');
return;
}
for (let i = 0; i <= form.value.groups.length - 1; i++) {
for (let j = 0; j < state.groupSelectedIds.length; j++) {
if (state.groupSelectedIds[j] == form.value.groups[i].id) {
if (i == 0) {
ElMessage.warning('已经是第一项');
return;
} else {
let swap = form.value.groups[i - 1];
form.value.groups[i - 1] = form.value.groups[i];
form.value.groups[i - 1].ornum--;
form.value.groups[i] = swap;
form.value.groups[i].ornum++;
}
break;
}
}
}
};
const downGroup = () => {
if (state.groupSelectedIds.length <= 0) {
ElMessage.warning('请选择后再进行操作');
return;
}
for (let i = form.value.groups.length - 1; i >= 0; i--) {
for (let j = state.groupSelectedIds.length - 1; j >= 0; j--) {
if (state.groupSelectedIds[j] == form.value.groups[i].id) {
if (i == form.value.groups.length - 1) {
ElMessage.warning('已经是最后一项');
return;
} else {
console.log(111);
let swap = form.value.groups[i + 1];
form.value.groups[i + 1] = form.value.groups[i];
form.value.groups[i + 1].ornum++;
form.value.groups[i] = swap;
form.value.groups[i].ornum--;
}
break;
}
}
}
};
const copyGroup = () => {
if (state.groupSelectedIds.length <= 0) {
ElMessage.warning('请选择后再进行操作');
return;
}
for (let i = 0; i <= form.value.groups.length - 1; i++) {
for (let j = 0; j < state.groupSelectedIds.length; j++) {
if (state.groupSelectedIds[j] == form.value.groups[i].id) {
const newGroup: any = deepClone(form.value.groups[i]);
newGroup.id = uuid();
newGroup.edtag = false;
newGroup.ornum = form.value.groups.length + 1;
form.value.groups.push(newGroup);
insertGroup(newGroup);
break;
}
}
}
};
function deepClone(obj: any) {
if (obj === null)
return;
const newObj: any = obj.push ? [] : {};
for (const attr in obj) {
if (typeof obj[attr] == 'object')
newObj[attr] = deepClone(obj[attr]);
else
newObj[attr] = obj[attr];
}
return newObj;
}
const itnumChange=(row:any)=>{
row.chtag = true;
}
const notesChange=(row:any)=>{
row.chtag = true;
}
const cateChange = (row: any) => {
row.layout = '';
row.gramo = '';
row.seamo = '';
row.prods = [];
row.chtag = true;
};
const layoutChange = (row: any) => {
if (!row.gramo) {
row.gramo = 1;
}
switch (row.layout) {
case 'dt1':
row.seamo = row.gramo;
row.prods = [{ id: uuid() }];
break;
case 'dt21':
row.seamo = row.gramo * 2;
row.prods = [{ id: uuid() }];
break;
case 'dt22':
row.seamo = row.gramo * 2;
row.prods = [{ id: uuid() }, { id: uuid() }];
break;
case 'dt3':
row.seamo = row.gramo * 3;
row.prods = [{ id: uuid() }, { id: uuid() }, { id: uuid() }];
break;
case 'dt4':
row.seamo = row.gramo * 4;
row.prods = [{ id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }];
break;
case 'dt5':
row.seamo = row.gramo * 5;
row.prods = [{ id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }];
break;
case 'dt6':
row.seamo = row.gramo * 6;
row.prods = [{ id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }];
break;
case 'dt7':
row.seamo = row.gramo * 7;
row.prods = [{ id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }];
break;
case 'dt8':
row.seamo = row.gramo * 8;
row.prods = [{ id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }, { id: uuid() }];
break;
case 'ft1':
row.seamo = row.gramo;
row.prods = [{ id: uuid() }];
break;
case 'ft21':
row.seamo = row.gramo * 2;
row.prods = [{ id: uuid() }, { id: uuid() }];
break;
case 'ft22':
row.seamo = row.gramo * 2;
row.prods = [{ id: uuid() }, { id: uuid() }];
break;
default :
row.seamo = '';
}
row.chtag = true;
};
const gramoChange = (row: any) => {
if (row.gramo) {
switch (row.layout) {
case 'dt1':
row.seamo = row.gramo;
break;
case 'dt21':
row.seamo = row.gramo * 2;
break;
case 'dt22':
row.seamo = row.gramo * 2;
break;
case 'dt3':
row.seamo = row.gramo * 3;
break;
case 'dt4':
row.seamo = row.gramo * 4;
break;
case 'dt5':
row.seamo = row.gramo * 5;
break;
case 'dt6':
row.seamo = row.gramo * 6;
break;
case 'dt7':
row.seamo = row.gramo * 7;
break;
case 'dt8':
row.seamo = row.gramo * 8;
break;
case 'ft1':
row.seamo = row.gramo;
break;
case 'ft2':
row.seamo = row.gramo * 2;
break;
case 'ft3':
row.seamo = row.gramo * 3;
break;
default :
row.seamo = '';
}
}
row.chtag = true;
};
const layoutShow = (layout: string) => {
switch (layout) {
case 'dt1':
return '单梯';
case 'dt21':
return '并联相同';
case 'dt22':
return '并联不同';
case 'dt3':
return '3台群控';
case 'dt4':
return '4台群控';
case 'dt5':
return '5台群控';
case 'dt6':
return '6台群控';
case 'dt7':
return '7台群控';
case 'dt8':
return '8台群控';
case 'ft1':
return '单台';
case 'ft21':
return '并列';
case 'ft22':
return '交叉';
default :
return '';
}
};
let lastId = '';
const rowClick = async (row: any, column: any, event: any) => {
if (lastId && lastId != row.id) {
for (const group of form.value.groups) {
if (group.id == lastId) {
// group.edtag = false;
await updateGroup(group);
break;
}
}
}
lastId = row.id;
row.edtag = true;
event.stopPropagation();
};
const prodDivClick = async () => {
// console.log("prodDivClick");
// console.log(lastId);
for (const group of form.value.groups) {
if (group.id == lastId) {
if (group.edtag) {
await updateGroup(group);
// group.edtag = false;
}
break;
}
}
};
//endregion
</script>
<style scoped>
.prod-row-view {
margin-top: 3px;
margin-bottom: 3px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
</style>
src/router/frontEnd.ts
+5
View File
@@ -9,11 +9,16 @@ import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
import { useRoutesList } from '/@/stores/routesList';
import { NextLoading } from '/@/utils/loading';
import {sysRoutes} from '/@/router/sysRoute';
import {saRoutes} from '/@/router/saRoute';
for (const sysRoute of sysRoutes) {
dynamicRoutes[0].children?.push(sysRoute);
}
for (const saRoute of saRoutes) {
dynamicRoutes[0].children?.push(saRoute);
}
// 前端控制路由
src/router/saRoute.ts
+227
View File
@@ -0,0 +1,227 @@
import { RouteRecordRaw } from 'vue-router';
export const saRoutes: Array<RouteRecordRaw> = [
{
path: '/sa',
name: 'Sa',
component: () => import('/@/layout/routerView/parent.vue'),
redirect: '/sa/cust/main',
meta: {
title: 'CRM',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Compass',
},
children: [
{
path: '/sa/proj',
name: 'SaProj',
component: () => import('/@/layout/routerView/parent.vue'),
redirect: '/sa/proj/main',
meta: {
title: '项目管理',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Postcard',
},
children: [
{
path: '/sa/proj/main',
name: 'SaProjMain',
component: () => import('/@/pages/sa/proj/main/index.vue'),
meta: {
title: '项目清单',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
{
path: '/sa/proj/main/edit',
name: 'SaProjMainEdit',
component: () => import('/@/pages/sa/proj/main/edit.vue'),
meta: {
title: '项目编辑',
isLink: '',
isHide: true,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
{
path: '/sa/proj/main/view',
name: 'SaProjMainView',
component: () => import('/@/pages/sa/proj/main/view.vue'),
meta: {
title: '项目查看',
isLink: '',
isHide: true,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
{
path: '/sa/prod/main',
name: 'SaProdMain',
component: () => import('/@/pages/sa/prod/main/index.vue'),
meta: {
title: '产品清单',
isLink: '',
isHide: true,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
],
},
{
path: '/sa/agent',
name: 'SaAgent',
component: () => import('/@/layout/routerView/parent.vue'),
redirect: '/sa/agent/main',
meta: {
title: '代理商管理',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Postcard',
},
children: [
{
path: '/sa/agent/cate',
name: 'SaAgentCate',
component: () => import('/@/pages/sa/agent/cate/index.vue'),
meta: {
title: '代理商分类',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
{
path: '/sa/agent/main',
name: 'SaAgentMain',
component: () => import('/@/pages/sa/agent/main/index.vue'),
meta: {
title: '代理商清单',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
{
path: '/sa/agent/main/edit',
name: 'SaAgentMainEdit',
component: () => import('/@/pages/sa/agent/main/edit.vue'),
meta: {
title: '代理商编辑',
isLink: '',
isHide: true,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
],
},
{
path: '/sa/cust',
name: 'SaCust',
component: () => import('/@/layout/routerView/parent.vue'),
redirect: '/sa/cust/main',
meta: {
title: '客户管理',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Postcard',
},
children: [
{
path: '/sa/cust/cate',
name: 'SaCustCate',
component: () => import('/@/pages/sa/cust/cate/index.vue'),
meta: {
title: '客户分类',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
{
path: '/sa/cust/main',
name: 'SaCustMain',
component: () => import('/@/pages/sa/cust/main/index.vue'),
meta: {
title: '客户清单',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
{
path: '/sa/cust/main/edit',
name: 'SaCustMainEdit',
component: () => import('/@/pages/sa/cust/main/edit.vue'),
meta: {
title: '客户编辑',
isLink: '',
isHide: true,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Tickets',
},
},
],
},
],
},
];
src/router/sysRoute.ts
+885 -1035
View File
File diff suppressed because it is too large Load Diff
src/theme/vboot.scss
+7
View File
@@ -225,3 +225,10 @@
.el-card.is-always-shadow, .el-card.is-hover-shadow:focus, .el-card.is-hover-shadow:hover{
box-shadow: none;
}
.el-upload-list{
margin: 0 !important;
}
.el-upload-list__item{
margin: 3px 0 0 0 !important;
}
src/utils/xutil.ts
+1 -1
View File
@@ -1,7 +1,7 @@
export const uuid=()=> {
let s:any = [];
let hexDigits = "0123456789abcdef";
for (let i = 0; i < 36; i++) {
for (let i = 0; i < 32; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] = "4";