file:添加加盟申请模块

This commit is contained in:
ll 2023-04-22 14:40:36 +08:00
parent 04951d9fa8
commit 94cb22ee35
5 changed files with 1041 additions and 0 deletions

View File

@ -0,0 +1,240 @@
<template>
<el-dialog
v-model="dialogVisible"
title="添加加盟申请"
width="900px"
@closed="closeDialog"
@open="openDialog"
>
<el-form ref="formRef" :model="formData" :rules="rules">
<el-row>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户名字"
prop="join_apply_user_name"
>
<el-input
v-model="formData.join_apply_user_name"
type="text"
placeholder="请输入加盟申请用户名字"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户电话"
prop="join_apply_user_phone"
>
<el-input
v-model="formData.join_apply_user_phone"
type="text"
placeholder="请输入加盟申请用户电话"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户所在地区"
prop="join_apply_user_area"
>
<el-input
v-model="formData.join_apply_user_area"
type="text"
placeholder="请输入加盟申请用户所在地区"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户所属机构名称"
prop="join_apply_user_org"
>
<el-input
v-model="formData.join_apply_user_org"
type="text"
placeholder="请输入加盟申请用户所属机构名称"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="加盟申请用户职位"
prop="join_apply_user_position"
>
<el-select
v-model="formData.join_apply_user_position"
clearable
placeholder="请选择"
>
<el-option
v-for="item in join_apply_user_position"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="加盟申请受理状态" prop="join_apply_status">
<el-select
v-model="formData.join_apply_status"
clearable
placeholder="请选择"
>
<el-option
v-for="item in processing_state"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="handleAddClick(formRef)"
>添加</el-button
>
<el-button @click="handleResetClick(formRef)">重置</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import { reactive, ref, watch } from 'vue';
import { addJoinApply, getDictionary } from '~/service/join_apply';
import { useLoginStore } from '~/store';
// --
// --
//
const join_apply_user_position = ref([]);
async function get_join_apply_user_position() {
await getDictionary({ dictionary_value: 'join_apply_user_position' }).then(
res => {
join_apply_user_position.value = res;
}
);
}
//
const processing_state = ref([]);
async function get_processing_state() {
await getDictionary({ dictionary_value: 'processing_state' }).then(res => {
processing_state.value = res;
});
}
// --
const store = useLoginStore();
const headers = {
Accept: 'application/json',
...store.headers
};
const formRef = ref();
const labelWidth = 90;
const props = defineProps({
modelValue: Boolean,
done: Function
});
const emits = defineEmits(['update:modelValue']);
const dialogVisible = ref(props.modelValue);
const formData = reactive({});
const uoloadData = ref({
dirName: 'JoinApply'
});
watch(props, v => {
dialogVisible.value = v.modelValue;
});
const rules = reactive({
join_apply_user_name: [
{
required: true,
message: '加盟申请用户名字不能为空'
}
],
join_apply_user_phone: [
{
required: true,
message: '加盟申请用户电话不能为空'
}
],
join_apply_user_position: [
{
required: true,
message: '加盟申请用户职位不能为空'
}
],
join_apply_user_area: [
{
required: true,
message: '加盟申请用户所在地区不能为空'
}
],
join_apply_user_org: [
{
required: true,
message: '加盟申请用户所属机构名称不能为空'
}
],
join_apply_status: [
{
required: true,
message: '加盟申请受理状态不能为空'
}
]
});
// --
//
const openDialog = () => {
get_join_apply_user_position();
get_processing_state();
};
const closeDialog = () => {
handleResetClick(formRef.value);
dialogVisible.value = false;
emits('update:modelValue', false);
};
const handleAddClick = async formEl => {
console.log(formData);
if (!formEl) return;
formEl.validate(async valid => {
if (!valid) {
return;
}
const { code } = await addJoinApply(formData);
if (code == 0) {
closeDialog();
props.done();
}
});
};
const handleResetClick = async formEl => {
if (!formEl) return;
formEl.resetFields();
};
</script>
<style lang="less" scoped></style>

View File

@ -0,0 +1,161 @@
<template>
<el-dialog
v-model="props.modelValue"
title="加盟申请详情"
width="900px"
@closed="closeDialog"
@open="openDialog"
>
<el-form ref="formRef" :model="formData" :disabled="true">
<el-row>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户名字"
prop="join_apply_user_name"
>
<el-input
v-model="formData.join_apply_user_name"
type="text"
placeholder="请输入加盟申请用户名字"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户电话"
prop="join_apply_user_phone"
>
<el-input
v-model="formData.join_apply_user_phone"
type="text"
placeholder="请输入加盟申请用户电话"
></el-input>
</el-form-item>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户所在地区"
prop="join_apply_user_area"
>
<el-input
v-model="formData.join_apply_user_area"
type="text"
placeholder="请输入加盟申请用户所在地区"
></el-input>
</el-form-item>
</el-col>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户所属机构名称"
prop="join_apply_user_org"
>
<el-input
v-model="formData.join_apply_user_org"
type="text"
placeholder="请输入加盟申请用户所属机构名称"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="加盟申请用户职位"
prop="join_apply_user_position"
>
<el-select
v-model="formData.join_apply_user_position"
clearable
placeholder="请选择"
>
<el-option
v-for="item in join_apply_user_position"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="加盟申请受理状态" prop="join_apply_status">
<el-select
v-model="formData.join_apply_status"
clearable
placeholder="请选择"
>
<el-option
v-for="item in processing_state"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-dialog>
</template>
<script setup>
import { reactive, ref, watch } from 'vue';
import { isEmptyObject } from '~/utils/index';
import { getDictionary } from '~/service/join_apply';
// --
// --
//
const join_apply_user_position = ref([]);
async function get_join_apply_user_position() {
await getDictionary({ dictionary_value: 'join_apply_user_position' }).then(
res => {
join_apply_user_position.value = res;
}
);
}
//
const processing_state = ref([]);
async function get_processing_state() {
await getDictionary({ dictionary_value: 'processing_state' }).then(res => {
processing_state.value = res;
});
}
// --
const formRef = ref();
const labelWidth = 100;
const props = defineProps({
modelValue: Boolean,
data: Object,
done: Function
});
const emits = defineEmits(['update:modelValue']);
const formData = ref({
...props.data
});
// --
watch(props, v => {
formData.value = v.data;
});
//
const openDialog = () => {
get_join_apply_user_position();
get_processing_state();
};
const closeDialog = () => {
emits('update:modelValue', false);
};
</script>
<style lang="less" scoped></style>

View File

@ -0,0 +1,236 @@
<template>
<el-dialog
v-model="props.modelValue"
title="编辑加盟申请"
width="900px"
@closed="closeDialog"
@open="openDialog"
>
<el-form ref="formRef" :model="formData" :rules="rules">
<el-row>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户名字"
prop="join_apply_user_name"
>
<el-input
v-model="formData.join_apply_user_name"
type="text"
placeholder="请输入加盟申请用户名字"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户电话"
prop="join_apply_user_phone"
>
<el-input
v-model="formData.join_apply_user_phone"
type="text"
placeholder="请输入加盟申请用户电话"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户所在地区"
prop="join_apply_user_area"
>
<el-input
v-model="formData.join_apply_user_area"
type="text"
placeholder="请输入加盟申请用户所在地区"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
:label-width="labelWidth"
label="加盟申请用户所属机构名称"
prop="join_apply_user_org"
>
<el-input
v-model="formData.join_apply_user_org"
type="text"
placeholder="请输入加盟申请用户所属机构名称"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="加盟申请用户职位"
prop="join_apply_user_position"
>
<el-select
v-model="formData.join_apply_user_position"
clearable
placeholder="请选择"
>
<el-option
v-for="item in join_apply_user_position"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="加盟申请受理状态" prop="join_apply_status">
<el-select
v-model="formData.join_apply_status"
clearable
placeholder="请选择"
>
<el-option
v-for="item in processing_state"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="handleEditClick(formRef)"
>编辑</el-button
>
<el-button @click="handleResetClick(formRef)">重置</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import { reactive, ref, watch } from 'vue';
import { editJoinApply, getDictionary } from '~/service/join_apply';
import { useLoginStore } from '~/store';
// --
// --
//
const join_apply_user_position = ref([]);
async function get_join_apply_user_position() {
await getDictionary({ dictionary_value: 'join_apply_user_position' }).then(
res => {
join_apply_user_position.value = res;
}
);
}
//
const processing_state = ref([]);
async function get_processing_state() {
await getDictionary({ dictionary_value: 'processing_state' }).then(res => {
processing_state.value = res;
});
}
// --
const store = useLoginStore();
const headers = {
Accept: 'application/json',
...store.headers
};
const formRef = ref();
const labelWidth = 100;
const props = defineProps({
modelValue: Boolean,
data: Object,
done: Function
});
const emits = defineEmits(['update:modelValue']);
const formData = ref({
...props.data
});
const uoloadData = ref({
dirName: 'JoinApply'
});
// --
watch(props, v => {
formData.value = v.data;
});
//
const openDialog = () => {
get_join_apply_user_position();
get_processing_state();
};
const closeDialog = () => {
props.done();
emits('update:modelValue', false);
};
const rules = reactive({
join_apply_user_name: [
{
required: true,
message: '加盟申请用户名字不能为空'
}
],
join_apply_user_phone: [
{
required: true,
message: '加盟申请用户电话不能为空'
}
],
join_apply_user_position: [
{
required: true,
message: '加盟申请用户职位不能为空'
}
],
join_apply_user_area: [
{
required: true,
message: '加盟申请用户所在地区不能为空'
}
],
join_apply_user_org: [
{
required: true,
message: '加盟申请用户所属机构名称不能为空'
}
],
join_apply_status: [
{
required: true,
message: '加盟申请受理状态不能为空'
}
]
});
const handleEditClick = async formEl => {
console.log(formData.value);
if (!formEl) return;
formEl.validate(async valid => {
if (!valid) {
return;
}
const { code } = await editJoinApply(formData.value);
if (code == 0) {
closeDialog();
props.done();
}
});
};
const handleResetClick = async formEl => {
if (!formEl) return;
formEl.resetFields();
};
</script>
<style lang="less" scoped></style>

View File

@ -0,0 +1,320 @@
<template>
<!-- 面包屑 -->
<el-breadcrumb>
<el-breadcrumb-item>联系我们</el-breadcrumb-item>
<el-breadcrumb-item to="/join_apply/list">加盟申请列表</el-breadcrumb-item>
</el-breadcrumb>
<!-- 搜索 -->
<el-form inline :model="params">
<el-form-item label="加盟申请用户名字">
<el-input
v-model="params.join_apply_user_name"
placeholder="请输入加盟申请用户名字"
></el-input>
</el-form-item>
<el-form-item label="加盟申请用户电话">
<el-input
v-model="params.join_apply_user_phone"
placeholder="请输入加盟申请用户电话"
></el-input>
</el-form-item>
<el-form-item label="加盟申请用户职位">
<el-select
v-model="params.join_apply_user_position"
clearable
placeholder="请选择"
>
<el-option
v-for="item in join_apply_user_position"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="加盟申请受理状态">
<el-select
v-model="params.join_apply_status"
clearable
placeholder="请选择"
>
<el-option
v-for="item in processing_state"
:key="item.dictionary_guid"
:label="item.dictionary_name"
:value="item.dictionary_value"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="tableRef.reload()" icon="ElIconSearch">
搜索
</el-button>
</el-form-item>
</el-form>
<el-space style="margin-bottom: 10px">
<!-- 添加加盟申请 -->
<el-col :span="1">
<el-button type="primary" @click="addJoinApplyDialogVisible = true">
添加
</el-button>
</el-col>
<!-- 导出 -->
<el-button icon="ElIconDocument" @click="exportExcel(params)"
>导出</el-button
>
<!-- 下拉操作 -->
<el-dropdown v-if="selectionData.length">
<el-button type="primary">
批量操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="handleDelete(selectionData)">
批量删除
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-space>
<!-- 数据表格 -->
<DataTable
ref="tableRef"
style="width: 100%"
:onSelectionChange="data => (selectionData = data)"
:column="column"
:params="params"
:request="params => getJoinApplyList(params)"
>
<template #join_apply_user_position="scope">
<dict-tag
:options="join_apply_user_position"
:value="scope.row.join_apply_user_position"
/>
</template>
<template #join_apply_status="scope">
<dict-tag
:options="processing_state"
:value="scope.row.join_apply_status"
/>
</template>
<template #chaoz="scope">
<el-space>
<el-button size="small" @click="handleStatusUpdate([scope.row])">
受理
</el-button>
<el-button size="small" @click="handleUpdate(scope.row)">
编辑
</el-button>
<el-dropdown @command="handleCommand">
<el-button type="primary" size="small">
更多<el-icon class="el-icon--right"><arrow-down /></el-icon>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item :command="{ type: 'detail', row: scope.row }">
详情
</el-dropdown-item>
<el-dropdown-item :command="{ type: 'delete', row: scope.row }">
删除
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-space>
</template>
</DataTable>
<!-- 添加加盟申请 -->
<AddJoinApplyDialog
v-model="addJoinApplyDialogVisible"
:done="() => tableRef.reload()"
></AddJoinApplyDialog>
<!-- 编辑加盟申请 -->
<EditJoinApplyDialog
v-model="EditJoinApplyDialogVisible"
:data="EditJoinApplyDialogRow"
:done="() => tableRef.reload()"
></EditJoinApplyDialog>
<!-- 加盟申请详情 -->
<DetailJoinApplyDialog
v-model="DetailJoinApplyDialogVisible"
:data="DetailJoinApplyDialogRow"
></DetailJoinApplyDialog>
</template>
<script setup>
import { ArrowDown } from '@element-plus/icons-vue';
import { ref, reactive, watch } from 'vue';
import { useLoginStore } from '~/store';
import {
getJoinApplyList,
deleteJoinApply,
getDictionary,
exportExcel,
handlejoin_applyStatus,
} from '~/service/join_apply';
import AddJoinApplyDialog from './components/AddJoinApplyDialog.vue';
import EditJoinApplyDialog from './components/EditJoinApplyDialog.vue';
import DetailJoinApplyDialog from './components/DetailJoinApplyDialog.vue';
const tableRef = ref();
const selectionData = ref([]);
const store = useLoginStore();
const addJoinApplyDialogVisible = ref(false);
const EditJoinApplyDialogVisible = ref(false);
const EditJoinApplyDialogRow = ref({});
const DetailJoinApplyDialogVisible = ref(false);
const DetailJoinApplyDialogRow = ref({});
const headers = {
Accept: 'application/json',
...store.headers
};
//
const params = reactive({
join_apply_user_name: '',
join_apply_user_phone: '',
join_apply_user_position: '',
join_apply_status: ''
});
const column = [
{
fixed: true,
type: 'selection'
},
{
prop: 'join_apply_user_name',
label: '加盟申请用户名字',
width: '150'
},
{
prop: 'join_apply_user_phone',
label: '加盟申请用户电话',
width: '150'
},
{
prop: 'join_apply_user_position',
label: '加盟申请用户职位',
width: '150'
},
{
prop: 'join_apply_user_area',
label: '加盟申请用户所在地区',
width: '150'
},
{
prop: 'join_apply_user_org',
label: '加盟申请用户所属机构名称',
width: '150'
},
{
prop: 'join_apply_status',
label: '加盟申请受理状态',
width: '150'
},
{
label: '操作',
prop: 'chaoz',
width: '250',
fixed: 'right'
}
];
const handleCommand = ({ type, row }) => {
switch (type) {
case 'detail':
handleDetail(row);
break;
case 'delete':
handleDelete([row]);
break;
}
};
//
let loadingHandle = null;
const HandleLoading = () => {
loadingHandle = ElLoading.service({
lock: true,
text: "正在受理中...",
background: "rgba(255, 255, 255, 0.7)",
});
};
const closeUploadLoading = () => loadingHandle.close();
const handleStatusUpdate = (data) => {
ElMessageBox.confirm(`您确定已对所选的在线报名处理了吗?`).then(async () => {
HandleLoading()
const { code, msg } = await handlejoin_applyStatus({
join_apply_guid: data.map(v => v.join_apply_guid).join()
});
if (code == 0) {
ElMessageBox.alert(msg, "受理信息", {
dangerouslyUseHTMLString: true,
confirmButtonText: "确定",
callback: () => {
tableRef.value.reload();
},
});
} else {
ElMessage.error(msg);
}
closeUploadLoading();
});
};
//
const handleDelete = data => {
ElMessageBox.confirm(`您确定要删除该加盟申请吗?`).then(async () => {
const res = await deleteJoinApply({
join_apply_guid: data.map(v => v.join_apply_guid).join()
});
if (res) {
tableRef.value.reload();
}
});
};
//
function handleUpdate(row) {
EditJoinApplyDialogVisible.value = true;
EditJoinApplyDialogRow.value = row;
}
//
function handleDetail(row) {
DetailJoinApplyDialogVisible.value = true;
DetailJoinApplyDialogRow.value = row;
}
//
const join_apply_user_position = ref([]);
async function get_join_apply_user_position() {
await getDictionary({ dictionary_value: 'join_apply_user_position' }).then(
res => {
join_apply_user_position.value = res;
}
);
}
get_join_apply_user_position();
//
const processing_state = ref([]);
async function get_processing_state() {
await getDictionary({ dictionary_value: 'processing_state' }).then(res => {
processing_state.value = res;
});
}
get_processing_state();
</script>

84
src/service/join_apply.js Normal file
View File

@ -0,0 +1,84 @@
import { api, downloadFile, createApiUrl } from '~/utils/axios';
/**
* 导出加盟申请
* @param {Object} data
* @return {Promise} api
*/
export function exportExcel(data) {
downloadFile(createApiUrl('ContactUs.JoinApply/exportExcel'), data);
}
/**
* 获取字典值
* @param {Object} data
* @return {Promise} api
*/
export function getDictionary(data) {
return api.post('Dictionary.Dictionary/getDictionary', data, {
});
}
/**
* 受理合作加盟申请
* @param {Object} data
* @return {Promise} api
*/
export function handlejoin_applyStatus(data) {
return api.post('ContactUs.JoinApply/handlejoin_applyStatus', data, {
// isTransformResponse: true,
// isShowSuccessMessage: true,
errorMessageText: '受理失败'
});
}
/**
* 获取加盟申请列表
* @param {Object} data
* @return {Promise} api
*/
export function getJoinApplyList(data) {
return api.post('ContactUs.JoinApply/getJoinApplyList', data);
}
/**
* 删除加盟申请
* @param {Object} data
* @return {Promise} api
*/
export function deleteJoinApply(data) {
return api.post('ContactUs.JoinApply/deleteJoinApply', data, {
isTransformResponse: true,
isShowSuccessMessage: true,
errorMessageText: '删除失败'
});
}
/**
* 添加加盟申请
* @param {Object} data
* @return {Promise} api
*/
export function addJoinApply(data) {
return api.post('ContactUs.JoinApply/addJoinApply', data, {
isTransformResponse: true,
isShowSuccessMessage: true,
errorMessageText: '添加失败'
});
}
/**
* 编辑加盟申请
* @param {Object} data
* @return {Promise} api
*/
export function editJoinApply(data) {
return api.post('ContactUs.JoinApply/editJoinApply', data, {
isTransformResponse: true,
isShowSuccessMessage: true,
errorMessageText: '编辑失败'
});
}