Skip to content

Y
yishuju-ui
Commit 546766b0 authored by 沈翠玲's avatar 沈翠玲
Browse files
Options

标签临时提交

parent de2b5a50
Hide whitespace changes
Inline Side-by-side
Showing with 604 additions and 447 deletions
src/api/property.js
View file @ 546766b0
...@@ -156,3 +156,19 @@ export const applyDownloadById = (params) => { ...@@ -156,3 +156,19 @@ export const applyDownloadById = (params) => {
export const downLoadApplyStatusById = (params) => { export const downLoadApplyStatusById = (params) => {
return request.get('/RepairApply/downLoadApplyStatusById', params); return request.get('/RepairApply/downLoadApplyStatusById', params);
}; };
// 添加标签
export const addTag = (params) => {
return request.get('/Loan/addTag', params);
};
// 导入标签
export const importTag = (params) => {
return request.get('/Loan/importTag', params);
};
// 删除标签
export const deleteTag = (params) => {
return request.get('/Loan/deleteTag', params);
};
// 获取标签
export const listTags = (params) => {
return request.get('/Loan/listTags', params);
};
\ No newline at end of file
src/views/property/case-manage/components/caseModal.vue deleted 100644 → 0
View file @ de2b5a50
<template>
<vxe-modal
resize
v-model="showModal"
title="案件分派"
@hide="onHide"
height="582"
width="1003"
show-footer
esc-closable
>
<div class="allocation-wrap">
<div class="top">
<div class="number-box">
<div class="number-left">
<div class="icon-wrapper">
<el-icon><UserFilled size="850" /></el-icon>
</div>
</div>
<div class="number-right">
<p>待分派案人人数</p>
<p>{{ currentAccount.people }}</p>
</div>
</div>
<div class="number-box">
<div class="number-left">
<div class="icon-wrapper">
<el-icon><List /></el-icon>
</div>
</div>
<div class="number-right">
<p>待分派案件数量</p>
<p>{{ currentAccount.case }}</p>
</div>
</div>
<div class="number-box">
<div class="number-left">
<div class="icon-wrapper">
<el-icon><UserFilled size="850" /></el-icon>
</div>
</div>
<div class="number-right">
<p>待分派金额</p>
<p>{{ currentAccount.money }}</p>
</div>
</div>
</div>
<div class="Content">
<template v-if="!step">
<div style="margin-top: 10px; margin-bottom: 10px">
<el-radio-group v-model="radio">
<el-radio :value="0">分派到调解中心</el-radio>
<el-radio :value="1">分派到CPE</el-radio>
</el-radio-group>
</div>
<div class="mainContent">
<div class="tree-wrapper">
<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
</div>
<el-transfer
v-model="value1"
:data="data1"
:titles="['CPE', '已选CPE']"
ref="mytransfer"
@left-check-change="leftChange"
/>
</div>
</template>
<template v-else>
<p>分派方案</p>
<div class="idea-box">
<div class="left-idea">
<div class="idea-btn">
<el-button
type="primary"
:plain="currentAllBtn === 1 ? false : true"
@click="chooseIdea(1)"
>以案人数均分</el-button
>
<el-button
type="primary"
:plain="currentAllBtn === 2 ? false : true"
@click="chooseIdea(2)"
>以案件数均分</el-button
>
<el-button
type="primary"
:plain="currentAllBtn === 3 ? false : true"
@click="chooseIdea(3)"
>以委案金额均分</el-button
>
</div>
<div class="reset-btn">
<el-button type="primary" link :icon="RefreshRight" @click="resetAllocation"
>重新分派</el-button
>
</div>
</div>
<div class="right-idea">
<ProTable
:config="config"
:data="tabledata"
ref="caseLRef"
:showPagination="false"
:showToolBar="false"
/>
</div>
</div>
</template>
</div>
</div>
<template #footer>
<el-button @click="backform" v-if="step" style="float: left">上一步</el-button>
<el-button type="default" @click="showModal = false">取消</el-button>
<el-button type="primary" @click="submitForm" v-if="step || radio === 0">确认提交</el-button>
<el-button type="primary" @click="submitForm" v-else>下一步</el-button>
</template>
</vxe-modal>
</template>
<script setup lang="jsx" name="allocationModal">
import { UserFilled } from '@element-plus/icons-vue';
import { RefreshRight } from '@element-plus/icons-vue';
import { ElInputNumber } from 'element-plus';
import { computed } from 'vue';
import { reactive, ref } from 'vue';
const data = ref([]);
const mytransfer = ref();
const tabledata = ref([]);
const showModal = ref(false);
const currentAccount = ref({ people: 0, case: 0, money: 0 });
const currentAllBtn = ref(1);
const editRowIndex = ref(-1);
const radio = ref(0);
const step = ref(0);
const onHide = () => {
currentAccount.value = { people: 0, case: 0, money: 0 };
};
const openModal = (account) => {
showModal.value = true;
currentAccount.value = { people: 333, case: 44, money: 1111 };
step.value = 0;
radio.value = 0;
currentAllBtn.value = 1;
editRowIndex.value = -1;
};
const backform = () => {
step.value = 0;
};
const submitForm = () => {
if (step.value || radio.value === 0) {
} else {
step.value = 1;
}
};
const handleNodeClick = (data) => {
console.log(data);
};
const chooseIdea = (type) => {
editRowIndex.value = -1;
currentAllBtn.value = type;
};
const resetAllocation = () => {
editRowIndex.value = -1;
};
const changeNum = (type, row, index) => {
editRowIndex.value = index;
console.log('changeNum', type, row, index);
};
const leftChange = (value, direction) => {
console.log(value, direction); //这个就是它包含的所有的属性以及事件，如果需要别的操作直接执行，也可以查询到
};
data.value = [
{
label: 'Level one 1',
children: [
{
label: 'Level two 1-1',
children: [
{
label: 'Level three 1-1-1',
},
],
},
],
},
{
label: 'Level one 2',
children: [
{
label: 'Level two 2-1',
children: [
{
label: 'Level three 2-1-1',
},
],
},
{
label: 'Level two 2-2',
children: [
{
label: 'Level three 2-2-1',
},
],
},
],
},
{
label: 'Level one 3',
children: [
{
label: 'Level two 3-1',
children: [
{
label: 'Level three 3-1-1',
},
],
},
{
label: 'Level two 3-2',
children: [
{
label: 'Level three 3-2-1',
},
],
},
],
},
];
const config = computed(() => {
// 去除分页控件，toolbar控件
return {
toolbarConfig: { enabled: false },
columns: [
{ type: 'seq', width: 50, title: '序号' },
{
field: 'code',
title: 'CPE',
},
{
field: 'code',
title: '分派案人数',
slots: {
default: ({ row, rowIndex }) => {
if (currentAllBtn.value === 1) {
return (
<>
<ElInputNumber
v-model={row.num}
onChange={() => changeNum(1, row, rowIndex)}
disabled={editRowIndex.value > -1 && editRowIndex.value !== rowIndex}
/>
</>
);
} else {
return <>{row.num}</>;
}
},
},
},
{
field: 'code',
title: '分派案件数',
slots: {
default: ({ row, rowIndex }) => {
if (currentAllBtn.value === 2) {
return (
<>
<ElInputNumber
v-model={row.num}
onChange={() => changeNum(2, row, rowIndex)}
disabled={editRowIndex.value > -1 && editRowIndex.value !== rowIndex}
/>
</>
);
} else {
return <>{row.num}</>;
}
},
},
},
{
field: 'code',
title: '分派委案金额',
slots: {
default: ({ row, rowIndex }) => {
if (currentAllBtn.value === 3) {
return (
<>
<ElInputNumber
v-model={row.num}
onChange={() => changeNum(3, row, rowIndex)}
disabled={editRowIndex.value > -1 && editRowIndex.value !== rowIndex}
/>
</>
);
} else {
return <>{row.num}</>;
}
},
},
},
],
};
});
tabledata.value = [
{ name: 'admin', code: 'admin', role: 'superadmin', num: 1 },
{ name: 'account1', code: 'account1', role: 'user', num: 1 },
{ name: 'account2', code: 'account2', role: 'user', num: 1 },
{ name: 'account3', code: 'account3', role: 'user', num: 1 },
];
const generateData = () => {
const data = [];
for (let i = 1; i <= 15; i++) {
data.push({
key: i,
label: `Option ${i}`,
});
}
return data;
};
const data1 = ref(generateData());
const value1 = ref([]);
const defaultProps = {
children: 'children',
label: 'label',
};
defineExpose({
openModal,
});
</script>
<style lang="scss" scoped>
.allocation-wrap {
height: 100%;
.top {
display: flex;
.number-box {
font-size: 15px;
width: 235px;
padding: 5px 0 5px 15px;
border: 1px solid #f1f1f1;
height: 50px;
display: flex;
margin-left: 10px;
}
.icon-wrapper {
width: 40px;
height: 40px;
text-align: center;
line-height: 40px;
color: #bbc3ca;
border: 2px solid #bbc3ca;
border-radius: 100%;
margin-right: 10px;
font-size: 37px;
}
}
.number-right {
p:nth-child(1) {
color: #cacaca;
font-size: 13px;
}
}
}
.Content {
height: calc(100% - 50px);
.idea-box {
height: calc(100% - 24px);
display: flex;
}
.left-idea {
width: 250px;
border: 1px solid #ebeef5;
display: flex;
flex-direction: column;
}
.right-idea {
width: calc(100% - 250px);
:deep(.card) {
padding: 0;
}
}
.idea-btn {
display: flex;
flex-direction: column;
align-items: center;
border-bottom: 1px solid #ebeef5;
padding-bottom: 10px;
.el-button {
width: 150px;
margin-left: 0 !important;
margin-top: 15px;
}
}
.reset-btn {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
}
}
.mainContent {
display: flex;
.tree-wrapper {
border: 1px solid #ebeef5;
width: 290px;
height: 318px;
}
:deep(.el-transfer-panel .el-transfer-panel__header) {
border-top-left-radius: 0;
background: #fff;
border-top-right-radius: 0;
}
:deep(.el-transfer__buttons) {
padding: 0 5px;
}
:deep(.el-transfer-panel) {
width: 250px;
}
}
</style>
src/views/property/case-manage/components/tagModal.vue 0 → 100644
View file @ 546766b0
<template>
<vxe-modal
resize
v-model="showModal"
:title="title"
@hide="onHide"
height="300"
width="430"
show-footer
esc-closable
>
<div class="tag-wrapper">
<template v-if="title === '添加临时标签'">
<div class="flex items-center">
<div>临时标签：</div>
<el-input v-model="form.tag" placeholder="请输入临时标签" style="width: 200px"/>
</div>
</template>
<template v-if="title === '导入批量添加标签'">
<div class="flex justify-center" >
<div style="line-height: 28px;">上传文件：</div>
<el-upload
class="avatar-uploader"
:headers="{ timeout: 600000 }"
ref="uploadRef"
:action="upload.url"
:disabled="upload.isUploading"
accept=".xls, .xlsx"
:auto-upload="true"
:limit="1"
:on-success="handleFileSuccess"
:on-remove="handleRemove"
:on-progress="uploadVideoProcess"
>
<el-button type="primary" plain :loading="upload.isUploading"
>点击上传</el-button
>
</el-upload>
</div>
</template>
<template v-if="title === '删除临时标签'">
<div class="flex items-center">
<div>临时标签：</div>
<el-select
v-model="form.tag"
style="width: 200px"
placeholder="请选择临时标签"
>
<el-option
v-for="item in tagOpt"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</div>
<div class="w-full">
<el-checkbox v-model="form.check">从所有案件中删除此标签</el-checkbox>
</div>
</template>
</div>
<template #footer>
<el-button type="primary" link style="float: left;" v-if="title === '导入批量添加标签'" @click="downloadtemplate">点击下载模版</el-button>
<el-button type="default" @click="showModal = false">取消</el-button>
<el-button type="primary" @click="submitForm">确认</el-button>
</template>
</vxe-modal>
</template>
<script setup lang="jsx" name="allocationModal">
import { UserFilled } from '@element-plus/icons-vue';
import { RefreshRight } from '@element-plus/icons-vue';
import { ElInputNumber } from 'element-plus';
import { addTag, importTag, deleteTag, listTags } from '@/api/property';
import { inject } from 'vue';
import { computed } from 'vue';
import { getAppEnvConfig } from '@/utils/env';
import { reactive, ref } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
const data = ref([]);
const uploadRef = ref();
const tabledata = ref([]);
const showModal = ref(false);
const form = ref({ tag: '', fileUrl: '', check: false });
const currentAllBtn = ref(1);
const editRowIndex = ref(-1);
const envs = getAppEnvConfig();
const tagOpt = ref([]);
const title = ref();
const curParam = ref({})
const downloadfile = inject('download');
const emits = defineEmits(['success']);
const upload = reactive({
// 是否禁用上传
isUploading: false,
// 上传的地址
url: envs.VITE_GLOB_API_URL_PREFIX + '/sys/upload',
});
const onHide = () => {
form.value = { tag: '', fileUrl: '', check: false };
};
const handleFileSuccess = (response, file, fileList) => {
if (!response.success) {
ElMessage.error({
message: response.message || '检查失败',
plain: true,
});
upload.isUploading = false;
uploadRef.value.clearFiles();
}
if (response.success) {
ElMessage.success({
message: '上传成功',
plain: true,
});
form.value.fileUrl = response.message;
upload.isUploading = false;
}
};
const handleRemove = () => {
form.value.fileUrl = '';
};
const openModal = (type, paramsStatic, selectlist) => {
showModal.value = true;
if (type == 'add') title.value = '添加临时标签'
if (type == 'import') title.value = '导入批量添加标签'
if (type == 'del') title.value = '删除临时标签'
if (selectlist && selectlist.length) {
curParam.value['ids'] = selectlist.map((v) => v.id).join(',');
} else {
curParam.value = paramsStatic;
}
listTags().then(res=>{
if (res.success) {
tagOpt.value = res.result
}
})
};
const uploadVideoProcess = (event, file, fileList) => {
upload.isUploading = true;
};
const backform = () => {
step.value = 0;
};
const submitForm = () => {
if(title.value === '添加临时标签') {
addTag({
tag: form.value.tag,
...curParam.value
}).then(res => {
if (res.success) {
ElMessage.success({
message: '添加成功',
plain: true,
});
showModal.value = false;
emits('success');
}
})
} else if (title.value === '导入批量添加标签') {
if (!form.value.fileUrl) {
return ElMessage.warning({
message: '请上传标签文件',
plain: true,
});
}
importTag({
fileUrl: form.value.fileUrl
}).then(res => {
if (res.success) {
ElMessage.success({
message: '上传成功',
plain: true,
});
showModal.value = false;
emits('success');
}
})
} else{
if (!form.value.tag) {
return ElMessage.warning({
message: '请选择临时标签',
plain: true,
});
}
const param = {
tags: form.value.tag,
}
if (!form.check) {
param['ids'] = curParam.value['ids']
}
deleteTag(param).then(res => {
if (res.success) {
ElMessage.success({
message: '上传成功',
plain: true,
});
showModal.value = false;
emits('success');
}
})
}
};
const downloadtemplate = () => {
downloadfile('/Loan/downloadTag', {}, '标签模版.xls');
};
const handleNodeClick = (data) => {
console.log(data);
};
const resetAllocation = () => {
editRowIndex.value = -1;
};
const changeNum = (type, row, index) => {
editRowIndex.value = index;
console.log('changeNum', type, row, index);
};
const leftChange = (value, direction) => {
console.log(value, direction); //这个就是它包含的所有的属性以及事件，如果需要别的操作直接执行，也可以查询到
};
defineExpose({
openModal,
});
</script>
<style lang="scss" scoped>
.tag-wrapper {
display: flex;
flex-direction: column;
justify-content: center;
height: 100%;
padding-left: 20px;
}
</style>
src/views/property/case-manage/index.vue
View file @ 546766b0
<template> <template>
<div class="table-box"> <div class="table-box">
<div class="table-inner"> <div class="table-inner">
<ProTable :config="config" ref="caseLRef" :api="getCreditPage" :paramCallback="paramCallback"> <ProTable :config="config" key="caseManag" ref="caseManRef" :api="getCreditPage" :paramCallback="paramCallback">
<template #table_top> <template #table_top>
<div class="style-lable" style="width: 100%"> <div class="style-lable" style="width: 100%">
<div class="item_warp" style="width: 23%"> <div class="item_warp" style="width: 23%">
...@@ -43,31 +43,64 @@ ...@@ -43,31 +43,64 @@
</div> </div>
</template> </template>
<template #left_buttons> <template #left_buttons>
<el-button type="primary" @click="download" v-permission="'caseManageExport'">导出</el-button> <div class="flex rounded w-full h-11 items-center pl-2 btn-grp mb-1">
<el-dropdown @command="(command) => (dataValue = command)">
<span class="el-dropdown-link">
{{ dataValue }}
<el-icon class="el-icon--right">
<arrow-down />
</el-icon>
</span>
<template #dropdown>
<el-dropdown-item
v-for="item in dataOptions"
:key="item.value"
:command="item.value"
>{{ item.label }}</el-dropdown-item
>
</template>
</el-dropdown>
<el-dropdown>
<el-button type="primary" @click="addTag">
<el-icon class="el-icon--left"><arrow-down /></el-icon>添加临时标签
</el-button>
<template #dropdown>
<el-dropdown-menu @click="handleClick">
<el-dropdown-item>导入批量添加标签</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-button type="primary" @click="delTag" style="margin-left: 10px">删除临时标签</el-button>
<el-button type="primary" @click="download" v-permission="'caseManageExport'" style="margin-left: 10px" v-if="dataValue === '对查询结果操作'">导出</el-button>
</div>
<div style="font-size: 15px; margin-top: 10px;"
>选中项：{{ selectdList.length }}
<span class="text-blue-400 cursor-pointer ml-4" @click="cancel">取消</span></div
>
</template> </template>
</ProTable> </ProTable>
</div> </div>
<caseModal ref="caseModalRef" /> <tagModal ref="tagModalRef" @success="query"/>
</div> </div>
</template> </template>
<script setup name="case-manage" lang="jsx"> <script setup name="case-manage" lang="jsx">
import caseModal from './components/caseModal.vue'; import tagModal from './components/tagModal.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { reactive, ref } from 'vue'; import { reactive, ref } from 'vue';
import { getCreditPage, getCreditTotal } from '@/api/property'; import { getCreditPage, getCreditTotal } from '@/api/property';
import { ElButton, ElMessage, ElTag } from 'element-plus'; import { ElButton, ElMessage, ElTag } from 'element-plus';
import { getTenantPage } from '@/api/tenant'; import { getTenantPage } from '@/api/tenant';
import { useAuthStore } from '@/stores/modules/auth'; import { useAuthStore } from '@/stores/modules/auth';
const caseModalRef = ref(); const tagModalRef = ref();
const caseLRef = ref(); const caseManRef = ref();
const statisis = ref({}); const statisis = ref({});
const paramsStatic = ref({}); const paramsStatic = ref({});
const { authButtonListGet } = useAuthStore(); // 获取用户权限列表 const { authButtonListGet } = useAuthStore(); // 获取用户权限列表
import { inject } from 'vue'; import { inject } from 'vue';
const downloadfile = inject('download'); const downloadfile = inject('download');
import { onMounted } from 'vue'; import { onMounted, nextTick } from 'vue';
import { getPlatformPage } from '@/api/platform'; import { getPlatformPage } from '@/api/platform';
import { getManageOrgPage } from '@/api/manageOrg'; import { getManageOrgPage } from '@/api/manageOrg';
import { useDict } from '@/hooks/useDict'; import { useDict } from '@/hooks/useDict';
...@@ -90,7 +123,83 @@ ...@@ -90,7 +123,83 @@
'AuditStatus', 'AuditStatus',
'CaseStatus' 'CaseStatus'
); );
const selectdList = ref([]);
const dataValue = ref('对查询结果操作');
const onCheckboxChange = (row) => {
nextTick(() => {
selectdList.value = row.records;
dataValue.value = selectdList.value.length > 0 ? '对选中项操作' : '对查询结果操作';
})
};
const cancel = () =>{
caseManRef.value.element.setAllCheckboxRow(false);
onCheckboxAll({ checked: false, records: [] });
}
const onCheckboxAll = (flag) => {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
dataValue.value = selectdList.value.length > 0 ? '对选中项操作' : '对查询结果操作';
};
const dataOptions = [
{
label: '对查询结果操作',
value: '对查询结果操作',
},
{
label: '对选中项操作',
value: '对选中项操作',
},
];
const router = useRouter(); const router = useRouter();
const addTag = () => {
if (dataValue.value === '对选中项操作' && (!selectdList.value || !selectdList.value.length)) {
return ElMessage.warning({
message: '请先选择操作对象!',
plain: true,
});
}
if (dataValue.value === '对选中项操作') {
tagModalRef.value?.openModal('add', JSON.parse(JSON.stringify(paramsStatic.value)),
JSON.parse(JSON.stringify(selectdList.value)))
} else {
tagModalRef.value?.openModal('add', JSON.parse(JSON.stringify(paramsStatic.value)),
[])
}
}
const handleClick = () => {
if (dataValue.value === '对选中项操作' && (!selectdList.value || !selectdList.value.length)) {
return ElMessage.warning({
message: '请先选择操作对象!',
plain: true,
});
}
if (dataValue.value === '对选中项操作') {
tagModalRef.value?.openModal('import', JSON.parse(JSON.stringify(paramsStatic.value)),
JSON.parse(JSON.stringify(selectdList.value)))
} else {
tagModalRef.value?.openModal('import', JSON.parse(JSON.stringify(paramsStatic.value)),
[])
}
}
const delTag = () => {
if (dataValue.value === '对选中项操作' && (!selectdList.value || !selectdList.value.length)) {
return ElMessage.warning({
message: '请先选择操作对象!',
plain: true,
});
}
if (dataValue.value === '对选中项操作') {
tagModalRef.value?.openModal('del', JSON.parse(JSON.stringify(paramsStatic.value)),
JSON.parse(JSON.stringify(selectdList.value)))
} else {
tagModalRef.value?.openModal('del', JSON.parse(JSON.stringify(paramsStatic.value)),
[])
}
}
const onCellClick = (row) => { const onCellClick = (row) => {
router.push({ router.push({
path: '/property/case-detail', path: '/property/case-detail',
...@@ -129,7 +238,9 @@ ...@@ -129,7 +238,9 @@
downloadfile('/LoanExcel/download', paramsStatic.value, '资产列表.xls'); downloadfile('/LoanExcel/download', paramsStatic.value, '资产列表.xls');
}; };
const config = reactive({ const config = reactive({
id: 'caseManage',
columns: [ columns: [
{ type: 'checkbox', title: '', width: 60, fixed: 'left' },
{ {
field: 'caseId', field: 'caseId',
title: '案件ID', title: '案件ID',
...@@ -206,6 +317,18 @@ ...@@ -206,6 +317,18 @@
labelWidth: 90, labelWidth: 90,
}, },
}, },
{
field: 'tag',
title: '临时标签',
showOverflow: 'tooltip',
width: 140,
search: {
el: 'input',
props: { clearable: true },
key: 'queryTag',
labelWidth: 90,
},
},
{ {
field: 'discount', field: 'discount',
title: '折扣', title: '折扣',
...@@ -449,17 +572,6 @@ ...@@ -449,17 +572,6 @@
width: 80, width: 80,
search: { el: 'input', props: { clearable: true }, labelWidth: 90 }, search: { el: 'input', props: { clearable: true }, labelWidth: 90 },
}, },
{
field: 'repayStatus',
title: '还款状态',
showOverflow: 'tooltip',
width: 80,
slots: {
default: ({ row }) => {
return <div>{row.repayStatus == 'over' ? '已还款' : '待还款'}</div>;
},
},
},
{ {
field: 'commission', field: 'commission',
showOverflow: 'tooltip', showOverflow: 'tooltip',
...@@ -644,9 +756,11 @@ ...@@ -644,9 +756,11 @@
width: 80, width: 80,
}, },
], ],
onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
}); });
const query = () => caseLRef.value?.search(); const query = () => caseManRef.value?.search();
onMounted(() => { onMounted(() => {
query(); query();
......
src/views/workplace/case/components/tagModal.vue 0 → 100644
View file @ 546766b0
<template>
<vxe-modal
resize
v-model="showModal"
:title="title"
@hide="onHide"
height="300"
width="430"
show-footer
esc-closable
>
<div class="tag-wrapper">
<template v-if="title === '添加临时标签'">
<div class="flex items-center">
<div>临时标签：</div>
<el-input v-model="form.tag" placeholder="请输入临时标签" style="width: 200px"/>
</div>
</template>
<template v-if="title === '导入批量添加标签'">
<div class="flex items-center">
<div>上传文件：</div>
<el-upload
class="avatar-uploader"
:headers="{ timeout: 600000 }"
ref="uploadRef"
:action="upload.url"
:disabled="upload.isUploading"
accept=".xls, .xlsx"
:auto-upload="false"
:limit="1"
:on-success="handleFileSuccess"
:on-remove="handleRemove"
:on-progress="uploadVideoProcess"
>
<el-button type="primary" plain :loading="upload.isUploading"
>点击上传</el-button
>
</el-upload>
</div>
</template>
</div>
<template #footer>
<el-button type="default" link style="margin-right:auto" v-if="title === '导入批量添加标签'" @click="downloadtemplate">点击下载模版</el-button>
<el-button type="default" @click="showModal = false">取消</el-button>
<el-button type="primary" @click="submitForm">确认</el-button>
</template>
</vxe-modal>
</template>
<script setup lang="jsx" name="allocationModal">
import { UserFilled } from '@element-plus/icons-vue';
import { RefreshRight } from '@element-plus/icons-vue';
import { ElInputNumber } from 'element-plus';
import { addTag } from '@/api/property';
import { inject } from 'vue';
import { computed } from 'vue';
import { getAppEnvConfig } from '@/utils/env';
import { reactive, ref } from 'vue';
const data = ref([]);
const uploadRef = ref();
const tabledata = ref([]);
const showModal = ref(false);
const form = ref({ tag: '' });
const currentAllBtn = ref(1);
const editRowIndex = ref(-1);
const envs = getAppEnvConfig();
const radio = ref(0);
const title = ref();
const curParam = ref({})
const downloadfile = inject('download');
const emits = defineEmits(['success']);
const upload = reactive({
// 是否禁用上传
isUploading: false,
// 上传的地址
url: envs.VITE_GLOB_API_URL_PREFIX + '/Loan/importTag',
});
const onHide = () => {
form.value = { tag: '' };
};
const handleFileSuccess = (response, file, fileList) => {
if (!response.success) {
ElMessage.error({
message: response.message || '上传失败',
plain: true,
});
upload.isUploading = false;
uploadRef.value.clearFiles();
}
if (response.success) {
ElMessage.success({
message: '上传成功',
plain: true,
});
upload.isUploading = false;
showModal.value = false;
emits('success');
}
};
const handleRemove = () => {
};
const openModal = (type, paramsStatic, selectlist) => {
showModal.value = true;
if (type == 'add') title.value = '添加临时标签'
if (type == 'import') title.value = '导入批量添加标签'
if (type == 'del') title.value = '删除临时标签'
if (selectlist && selectlist.length) {
curParam.value['ids'] = selectlist.map((v) => v.id);
} else {
curParam.value = paramsStatic;
}
};
const uploadVideoProcess = (event, file, fileList) => {
upload.isUploading = true;
};
const backform = () => {
step.value = 0;
};
const submitForm = () => {
if(title.value === '添加临时标签') {
addTag({
...form.value,
...curParam.value
}).then(res => {
if (res.success) {
return ElMessage.success({
message: '添加成功',
plain: true,
});
showModal.value = false;
emits('success');
}
})
} else if (title.value === '导入批量添加标签') {
uploadRef.value?.submit()
} else{
}
};
const downloadtemplate = () => {
downloadfile('/Loan/downloadTag', {}, '标签模版.xls');
};
const handleNodeClick = (data) => {
console.log(data);
};
const resetAllocation = () => {
editRowIndex.value = -1;
};
const changeNum = (type, row, index) => {
editRowIndex.value = index;
console.log('changeNum', type, row, index);
};
const leftChange = (value, direction) => {
console.log(value, direction); //这个就是它包含的所有的属性以及事件，如果需要别的操作直接执行，也可以查询到
};
defineExpose({
openModal,
});
</script>
<style lang="scss" scoped>
.tag-wrapper {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100%;
}
</style>
src/views/workplace/case/index.vue
View file @ 546766b0
...@@ -78,15 +78,28 @@ ...@@ -78,15 +78,28 @@
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
</el-dropdown> </el-dropdown>
<el-dropdown>
<el-button type="primary" @click="addTag">
<el-icon class="el-icon--left"><arrow-down /></el-icon>添加临时标签
</el-button>
<template #dropdown>
<el-dropdown-menu @click="handleClick1">
<el-dropdown-item>导入批量添加标签</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-button type="primary" @click="delTag" style="margin-left: 10px">删除临时标签</el-button>
<el-button type="primary" @click="stayCase">留案 </el-button> <el-button type="primary" @click="stayCase">留案 </el-button>
</div> </div>
</template> </template>
</ProTable> </ProTable>
</div> </div>
<tagModal ref="tagModalRef" @success="query"/>
</div> </div>
</template> </template>
<script setup name="case-manage" lang="jsx"> <script setup name="case-manage" lang="jsx">
import tagModal from './components/tagModal.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { computed, reactive, ref, nextTick } from 'vue'; import { computed, reactive, ref, nextTick } from 'vue';
import { getCreditPage, getCreditTotal } from '@/api/property'; import { getCreditPage, getCreditTotal } from '@/api/property';
...@@ -118,11 +131,33 @@ ...@@ -118,11 +131,33 @@
'AuditStatus', 'AuditStatus',
'CaseStatus' 'CaseStatus'
); );
const tagModalRef = ref();
const { userInfo } = useUserStore(); const { userInfo } = useUserStore();
const router = useRouter(); const router = useRouter();
const tabs = ref(['全部', '今天待跟进', '明天待跟进', '后天待跟进']); const tabs = ref(['全部', '今天待跟进', '明天待跟进', '后天待跟进']);
const activeName = ref('全部'); const activeName = ref('全部');
const addTag = () => {
if (dataValue.value === '对选中项操作' && (!selectdList.value || !selectdList.value.length)) {
return ElMessage.warning({
message: '请先选择操作对象!',
plain: true,
});
}
if (dataValue.value === '对选中项操作') {
tagModalRef.value?.openModal('add', JSON.parse(JSON.stringify(curParam.value)),
JSON.parse(JSON.stringify(selectdList.value)))
} else {
tagModalRef.value?.openModal('add', JSON.parse(JSON.stringify(curParam.value)),
[])
}
}
const handleClick1 = () => {
tagModalRef.value?.openModal('import')
}
const delTag = () => {
tagModalRef.value?.openModal('del')
}
const selectdList = ref([]); const selectdList = ref([]);
const tableTrue = ref(true); const tableTrue = ref(true);
const curParam = ref({}); const curParam = ref({});
...@@ -301,6 +336,18 @@ ...@@ -301,6 +336,18 @@
labelWidth: 90, labelWidth: 90,
}, },
}, },
{
field: 'tag',
title: '临时标签',
showOverflow: 'tooltip',
width: 140,
search: {
el: 'input',
props: { clearable: true },
key: 'queryTag',
labelWidth: 90,
},
},
{ {
field: 'discount', field: 'discount',
title: '折扣', title: '折扣',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment