完成contact、tools部分修改。
This commit is contained in:
yyhouc
parent
22fefc3e35
commit
c5ca09b961
|
|
@ -12,6 +12,7 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@element-plus/icons-vue": "^2.1.0",
|
"@element-plus/icons-vue": "^2.1.0",
|
||||||
"@mapbox/leaflet-omnivore": "^0.3.4",
|
"@mapbox/leaflet-omnivore": "^0.3.4",
|
||||||
|
"@vueup/vue-quill": "^1.0.0-alpha.40",
|
||||||
"axios": "^1.3.4",
|
"axios": "^1.3.4",
|
||||||
"echarts": "^5.4.2",
|
"echarts": "^5.4.2",
|
||||||
"element-plus": "^2.3.1",
|
"element-plus": "^2.3.1",
|
||||||
|
|
|
||||||
|
|
@ -1,14 +1,17 @@
|
||||||
import request from '/@/utils/request';
|
import request from '/@/utils/request';
|
||||||
import {moduleName} from '/@/utils/request';
|
import {moduleName} from '/@/utils/request';
|
||||||
export const getList = (current, size, param) => {
|
export const getList = (current, size, param) => {
|
||||||
|
let params = {
|
||||||
|
current,
|
||||||
|
size,
|
||||||
|
};
|
||||||
|
if(param){
|
||||||
|
params = Object.assign(params, param);
|
||||||
|
}
|
||||||
return request({
|
return request({
|
||||||
url: '/api/'+moduleName+'/ui/contact/list',
|
url: '/api/'+moduleName+'/ui/contact/list',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: {
|
params: params,
|
||||||
current,
|
|
||||||
size,
|
|
||||||
param,
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
export const submit = (row) => {
|
export const submit = (row) => {
|
||||||
|
|
@ -22,8 +25,8 @@ export const remove = (ids) => {
|
||||||
return request({
|
return request({
|
||||||
url: '/api/'+moduleName+'/ui/contact/remove',
|
url: '/api/'+moduleName+'/ui/contact/remove',
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: {
|
params: {
|
||||||
ids,
|
ids:ids,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
@ -37,3 +40,20 @@ export const detail = (id) => {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const emailSend = (email) => {
|
||||||
|
return request({
|
||||||
|
url: '/api/'+moduleName+'/ui/contact/sendEmail',
|
||||||
|
method: 'post',
|
||||||
|
data: email
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export const Observed = (id) => {
|
||||||
|
return request({
|
||||||
|
url: '/api/'+moduleName+'/ui/contact/observed',
|
||||||
|
method: 'get',
|
||||||
|
params: {
|
||||||
|
id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -25,8 +25,8 @@ export const remove = (ids) => {
|
||||||
return request({
|
return request({
|
||||||
url: '/api/'+moduleName+'/ui/tool/remove',
|
url: '/api/'+moduleName+'/ui/tool/remove',
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: {
|
params: {
|
||||||
ids,
|
ids:ids,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@ import qs from 'qs';
|
||||||
import { Session } from '/@/utils/storage';
|
import { Session } from '/@/utils/storage';
|
||||||
|
|
||||||
// export const moduleName = 'zqq-biz-vordm';
|
// export const moduleName = 'zqq-biz-vordm';
|
||||||
export const moduleName = 'biz-vordm';
|
export const moduleName = 'yyhouc-biz-vordm';
|
||||||
|
|
||||||
// 配置新建一个 axios 实例
|
// 配置新建一个 axios 实例
|
||||||
const service = axios.create({
|
const service = axios.create({
|
||||||
|
|
|
||||||
|
|
@ -1,140 +1,217 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="system-user-container" style="width:calc(100% - 10px) !important ;">
|
<div class="system-user-container" style="width:calc(100% - 10px) !important ;">
|
||||||
<el-row :gutter="10" >
|
<el-row :gutter="10">
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<el-card shadow="hover">
|
<el-card shadow="hover">
|
||||||
<div class="system-user-search mb15">
|
<div class="system-user-search mb15">
|
||||||
<el-row>
|
<el-form>
|
||||||
<span class="label-span">名称:</span><el-input size="default" placeholder="请输入名称" style="max-width: 180px" v-model="state.query.name" clearable> </el-input>
|
<el-row>
|
||||||
<el-button size="default" type="primary" class="ml10" @click="initTableData" >
|
<el-col :span="4">
|
||||||
<el-icon>
|
<el-form-item label="UserName"><el-input size="default" style="max-width: 180px"
|
||||||
<ele-Search />
|
v-model="state.query.userName" clearable placeholder="Please enter the UserName">
|
||||||
</el-icon>
|
</el-input>
|
||||||
查询
|
</el-form-item>
|
||||||
</el-button>
|
</el-col>
|
||||||
</el-row>
|
<el-col :span="4">
|
||||||
<el-row style="margin-top: 20px; margin-left: -10px;">
|
<el-form-item label="checked">
|
||||||
<el-button size="default" type="success" class="ml10" @click="onOpenAdd" >
|
<el-select size="default" v-model="state.query.status" clearable
|
||||||
<el-icon>
|
placeholder="Replied">
|
||||||
<ele-FolderAdd />
|
<el-option label="UnReplied" :value="0"></el-option>
|
||||||
</el-icon>
|
<el-option label="Replied" :value="1"></el-option>
|
||||||
新增
|
<el-option label="Observed" :value="2"></el-option>
|
||||||
</el-button>
|
</el-select>
|
||||||
</el-row>
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-button size="default" type="primary" class="ml15" style="margin-top: 4px ;"
|
||||||
|
@click="initTableData">
|
||||||
|
<el-icon>
|
||||||
|
<ele-Search />
|
||||||
|
</el-icon>
|
||||||
|
search
|
||||||
|
</el-button>
|
||||||
|
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<el-table :data="state.tableData.data" style="width: 100%" v-loading="state.tableData.loading" @selection-change="handleSelectionChange">
|
<el-table :data="state.tableData.data" style="width: 100%" v-loading="state.tableData.loading"
|
||||||
<el-table-column type="selection" width="55"/>
|
@selection-change="handleSelectionChange">
|
||||||
<el-table-column prop="userName" label="用户姓名" > </el-table-column>
|
<el-table-column prop="userName" label="userName"> </el-table-column>
|
||||||
<el-table-column prop="email" label="电子邮件" > </el-table-column>
|
<el-table-column prop="email" label="email"> </el-table-column>
|
||||||
<el-table-column prop="organization" label="组织" > </el-table-column>
|
<el-table-column prop="organization" label="organization"> </el-table-column>
|
||||||
<el-table-column prop="message" label="意见建议" > </el-table-column>
|
<el-table-column prop="message" label="message"> </el-table-column>
|
||||||
<el-table-column prop="id" label="数据自增列" > </el-table-column>
|
<el-table-column label="Operate" width="180">
|
||||||
<el-table-column label="操作" width="100">
|
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onOpenEdit(scope.row)">修改</el-button>
|
<el-button :disabled="scope.row.userName === 'admin'" size="small" v-if="scope.row.status != 2 " text type="primary"
|
||||||
<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button>
|
@click="onObserved(scope.row)">Observed</el-button>
|
||||||
|
<el-button :disabled="scope.row.userName === 'admin'" size="small" v-if="scope.row.status != 1 " text type="primary"
|
||||||
|
@click="onOpenEdit(scope.row)">Reply e-mail</el-button>
|
||||||
|
<el-button :disabled="scope.row.userName === 'admin'" size="small" v-if="scope.row.status == 1 " text type="primary"
|
||||||
|
@click="onOpenEdit(scope.row)">Reply Info</el-button>
|
||||||
|
<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary"
|
||||||
|
@click="onRowDel(scope.row)">Delete</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
<el-pagination
|
<el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
|
||||||
@size-change="onHandleSizeChange"
|
:pager-count="5" :page-sizes="[10, 20, 30]" v-model:current-page="state.tableData.param.pageNum"
|
||||||
@current-change="onHandleCurrentChange"
|
background v-model:page-size="state.tableData.param.pageSize"
|
||||||
class="mt15"
|
layout="total, sizes, prev, pager, next, jumper" :total="state.tableData.total">
|
||||||
:pager-count="5"
|
|
||||||
:page-sizes="[10, 20, 30]"
|
|
||||||
v-model:current-page="state.tableData.param.pageNum"
|
|
||||||
background
|
|
||||||
v-model:page-size="state.tableData.param.pageSize"
|
|
||||||
layout="total, sizes, prev, pager, next, jumper"
|
|
||||||
:total="state.tableData.total"
|
|
||||||
>
|
|
||||||
</el-pagination>
|
</el-pagination>
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
<Add ref = 'AddRef' @callback="initTableData"></Add>
|
<el-dialog v-model="state.dialogVisible" title="Send Email" width="60%" :before-close="handleClose">
|
||||||
|
<el-form-item label="Subject:" >
|
||||||
|
<el-input v-model="state.email.subject" placeholder="Please enter the Subject"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<!-- <el-form-item label="Content:" > -->
|
||||||
|
|
||||||
|
<QuillEditor ref="myQuillEditor"
|
||||||
|
theme="snow"
|
||||||
|
v-model:content="state.email.text"
|
||||||
|
:options="state.options"
|
||||||
|
contentType="html"
|
||||||
|
@update:content="setValue()"
|
||||||
|
style="height:500px ;"
|
||||||
|
/>
|
||||||
|
<!-- </el-form-item> -->
|
||||||
|
<template #footer>
|
||||||
|
<span class="dialog-footer">
|
||||||
|
<el-button @click="state.dialogVisible = false">Cancel</el-button>
|
||||||
|
<el-button type="primary" @click="send()" v-if="state.email.status != 1">
|
||||||
|
Send
|
||||||
|
</el-button>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="contact">
|
<script setup name="contact">
|
||||||
import { getList ,remove} from '/@/api/contact/index'
|
import { getList, remove,emailSend } from '/@/api/contact/index'
|
||||||
import { ElMessageBox, ElMessage } from 'element-plus';
|
import { ElMessageBox, ElMessage } from 'element-plus';
|
||||||
import { ref,reactive,onMounted,nextTick } from 'vue';
|
import { ref, reactive, onMounted, nextTick,toRaw } from 'vue';
|
||||||
import Add from '/@/views/responseManagement/contact/component/add.vue';
|
import en from 'element-plus/dist/locale/en.mjs'
|
||||||
const AddRef = ref();
|
import { QuillEditor } from '@vueup/vue-quill'
|
||||||
const state = reactive({
|
import '@vueup/vue-quill/dist/vue-quill.snow.css'
|
||||||
tableData: {
|
const myQuillEditor = ref(null);
|
||||||
data: [],
|
const state = reactive({
|
||||||
total: 0,
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
total: 0,
|
||||||
|
loading: false,
|
||||||
|
param: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
//请求条件
|
||||||
|
query: {
|
||||||
|
status: 0,
|
||||||
|
},
|
||||||
|
selected: [],
|
||||||
|
dialogVisible: false,
|
||||||
|
options:{
|
||||||
|
modules: {
|
||||||
|
toolbar: [
|
||||||
|
['bold', 'italic', 'underline', 'strike'],
|
||||||
|
[{ 'size': ['small', false, 'large', 'huge'] }],
|
||||||
|
[{ 'font': [] }],
|
||||||
|
[{ 'align': [] }],
|
||||||
|
[{ 'list': 'ordered' }, { 'list': 'bullet' }],
|
||||||
|
[{ 'indent': '-1' }, { 'indent': '+1' }],
|
||||||
|
[{ 'header': 1 }, { 'header': 2 }],
|
||||||
|
['image'],
|
||||||
|
[{ 'direction': 'rtl' }],
|
||||||
|
[{ 'color': [] }, { 'background': [] }]
|
||||||
|
]
|
||||||
|
},
|
||||||
|
placeholder: '请输入内容...'
|
||||||
|
},
|
||||||
|
email:{
|
||||||
|
subject:'Thank You for Your Support',
|
||||||
|
text:'Dear Rising Sun,'+
|
||||||
|
'I would like to express my heartfelt gratitude to you for your kind support and assistance during my recent project. I appreciate the time and effort you have dedicated to helping me with technical and news-related issues.'+
|
||||||
|
'It has been a pleasure working with such a knowledgeable and professional individual like you. Your expertise and guidance have proven to be invaluable to me, and I am truly grateful for your assistance throughout the process.'+
|
||||||
|
'Once again, thank you so much for your help and cooperation. I look forward to collaborating with you again in the future.'+
|
||||||
|
' Best regards,'+
|
||||||
|
' yyhouc'
|
||||||
|
} ,
|
||||||
|
//字典数据
|
||||||
|
});
|
||||||
|
const setValue = () => {
|
||||||
|
const text = toRaw(myQuillEditor.value).getHTML()
|
||||||
|
console.log(text)
|
||||||
|
}
|
||||||
|
// 初始化表格数据
|
||||||
|
const initTableData = () => {
|
||||||
|
state.tableData.loading = true;
|
||||||
|
getList(state.tableData.param.pageNum, state.tableData.param.pageSize, state.query).then(res => {
|
||||||
|
state.tableData = {
|
||||||
|
data: res.records,
|
||||||
|
total: res.total,
|
||||||
loading: false,
|
loading: false,
|
||||||
param:{
|
param: {
|
||||||
pageNum: 1,
|
pageNum: res.current,
|
||||||
pageSize: 10,
|
pageSize: res.size,
|
||||||
},
|
|
||||||
},
|
|
||||||
//请求条件
|
|
||||||
query: {
|
|
||||||
},
|
|
||||||
selected: [],
|
|
||||||
//字典数据
|
|
||||||
});
|
|
||||||
// 初始化表格数据
|
|
||||||
const initTableData = () => {
|
|
||||||
state.tableData.loading = true;
|
|
||||||
getList(state.tableData.param.pageNum,state.tableData.param.pageSize,state.query).then(res=>{
|
|
||||||
state.tableData = {
|
|
||||||
data: res.records,
|
|
||||||
total: res.total,
|
|
||||||
loading :false,
|
|
||||||
param: {
|
|
||||||
pageNum: res.current,
|
|
||||||
pageSize: res.size,
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
})
|
||||||
|
|
||||||
};
|
};
|
||||||
// 打开新增
|
// 打开新增
|
||||||
const onOpenAdd = () => {
|
const onObserved = (row) => {
|
||||||
AddRef.value.openDialog();
|
};
|
||||||
};
|
// 打开修改用户弹窗
|
||||||
// 打开修改用户弹窗
|
const onOpenEdit = (row) => {
|
||||||
const onOpenEdit = (row) => {
|
state.email = row;
|
||||||
AddRef.value.openDialog(row);
|
state.dialogVisible = true;
|
||||||
};
|
|
||||||
// 删除用户
|
};
|
||||||
const onRowDel = (row) => {
|
const send = () => {
|
||||||
ElMessageBox.confirm(`此操作将永久此参数：“${row.name}”，是否继续?`, '提示', {
|
state.email.email="792163605@qq.com"
|
||||||
confirmButtonText: '确认',
|
emailSend(state.email).then(res => {
|
||||||
cancelButtonText: '取消',
|
ElMessage.success('发送成功');
|
||||||
type: 'warning',
|
state.dialogVisible = false;
|
||||||
})
|
})
|
||||||
.then(() => {
|
|
||||||
remove(row.id).then(res=>{
|
};
|
||||||
ElMessage.success('删除成功');
|
// 删除用户
|
||||||
initTableData();
|
const onRowDel = (row) => {
|
||||||
})
|
ElMessageBox.confirm(`此操作将永久此参数：“${row.name}”，是否继续?`, '提示', {
|
||||||
|
confirmButtonText: '确认',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
remove(row.id).then(res => {
|
||||||
|
ElMessage.success('删除成功');
|
||||||
|
initTableData();
|
||||||
})
|
})
|
||||||
.catch(() => {});
|
})
|
||||||
};
|
.catch(() => { });
|
||||||
// 分页改变
|
};
|
||||||
const onHandleSizeChange = (val) => {
|
// 分页改变
|
||||||
state.tableData.param.pageSize = val;
|
const onHandleSizeChange = (val) => {
|
||||||
|
state.tableData.param.pageSize = val;
|
||||||
|
initTableData();
|
||||||
|
};
|
||||||
|
// 多选
|
||||||
|
const handleSelectionChange = (val) => {
|
||||||
|
state.selected = val;
|
||||||
|
};
|
||||||
|
// 分页改变
|
||||||
|
const onHandleCurrentChange = (val) => {
|
||||||
|
state.tableData.param.pageNum = val;
|
||||||
|
initTableData();
|
||||||
|
};
|
||||||
|
onMounted(() => {
|
||||||
|
nextTick(() => {
|
||||||
initTableData();
|
initTableData();
|
||||||
};
|
|
||||||
// 多选
|
|
||||||
const handleSelectionChange = (val) => {
|
|
||||||
state.selected = val;
|
|
||||||
};
|
|
||||||
// 分页改变
|
|
||||||
const onHandleCurrentChange = (val) => {
|
|
||||||
state.tableData.param.pageNum = val;
|
|
||||||
initTableData();
|
|
||||||
};
|
|
||||||
onMounted(() => {
|
|
||||||
nextTick(() => {
|
|
||||||
initTableData();
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -54,7 +54,7 @@
|
||||||
<el-table-column prop="reviewTime" label="Review Time"></el-table-column>
|
<el-table-column prop="reviewTime" label="Review Time"></el-table-column>
|
||||||
<el-table-column label="Operate" width="140">
|
<el-table-column label="Operate" width="140">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary"
|
<el-button :style='scope.row.reviewTime?"display:none;":"" ' size="small" text type="primary"
|
||||||
@click="onOpenEdit(scope.row)">Review</el-button>
|
@click="onOpenEdit(scope.row)">Review</el-button>
|
||||||
<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary"
|
<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary"
|
||||||
@click="onRowDel(scope.row)">Delete</el-button>
|
@click="onRowDel(scope.row)">Delete</el-button>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue