odjbin/SmartOpsWeb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:完成了工作台，修复了工单详情v-for不渲染的bug，增添了信息滚动条

Browse Source
This commit is contained in:
KindSeven
2024-09-15 04:44:45 +08:00
parent 91e6422384 6f51c7ed9a
commit 7fbc782993
27 changed files with 6540 additions and 652 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SmartOpsWeb</title> <title>智能语音服务系统</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

5521
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

4
package.json
View File

@@ -10,13 +10,15 @@
"dependencies": { "dependencies": {
"axios": "^1.4.0", "axios": "^1.4.0",
"echarts": "^5.4.2", "echarts": "^5.4.2",
"element-plus": "^2.3.5", "element-plus": "^2.6.0",
"highlight.js": "9.18.5", "highlight.js": "9.18.5",
"js-cookie": "^3.0.5", "js-cookie": "^3.0.5",
"nprogress": "^0.2.0", "nprogress": "^0.2.0",
"pinia": "^2.0.35", "pinia": "^2.0.35",
"sass": "^1.62.1", "sass": "^1.62.1",
"scss": "^0.2.4", "scss": "^0.2.4",
"sockjs-client": "^1.6.1",
"stompjs": "^2.3.3",
"unplugin-icons": "^0.16.1", "unplugin-icons": "^0.16.1",
"vite-plugin-inspect": "^0.7.26", "vite-plugin-inspect": "^0.7.26",
"vue": "^3.2.47", "vue": "^3.2.47",

1
src/components/Tag.vue
View File

@@ -31,7 +31,6 @@ const props = defineProps({
const tagConfig = ref({}) const tagConfig = ref({})
const filterDict = (data, value) => { const filterDict = (data, value) => {
console.log(value + "aaa",!data || !value)
if (!data || value == null) return if (!data || value == null) return
if (data instanceof Array) { if (data instanceof Array) {
if (value == true || value == false) { if (value == true || value == false) {

26
src/components/Voice/index.vue Normal file
View File

@@ -0,0 +1,26 @@
<script setup>
const dialogVisible = ref(false);
const open = (row) => {
dialogVisible.value = true;
};
defineExpose({
open,
});
</script>
<template>
<el-dialog v-model="dialogVisible" title="语音详情" width="500" :before-close="handleClose">
<audio src="" controls style="width: 100%;"></audio>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="dialogVisible = false">
关闭
</el-button>
</div>
</template>
</el-dialog>
</template>
<style></style>

31
src/components/infoLiveCall/index.vue Normal file
View File

@@ -0,0 +1,31 @@
<script setup>
import LiveCall from '@/components/liveCall/index.vue'
const dialogVisible = ref(false);
const open = (row) => {
dialogVisible.value = true;
};
defineExpose({
open,
});
</script>
<template>
<el-dialog v-model="dialogVisible" title="语音详情" width="1500" :before-close="handleClose" class="box">
<LiveCall />
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="dialogVisible = false">
关闭
</el-button>
</div>
</template>
</el-dialog>
</template>
<style>
.box{
height: 65vh;
}
</style>

285
src/components/liveCall/LiveCallItem.vue Normal file
View File

@@ -0,0 +1,285 @@
<template>
<div class="live-call">
<div class="header">
<div>
<span style="margin-right: 20px">张三</span>
<span>14785295642</span>
</div>
<div><span>工单名称：xxxxxx工单</span></div>
</div>
<el-scrollbar ref="scrollbarRef" class="scrollbar">
<div class="chat-content" ref="innerRef">
<div class="time-grap"><span>6月5日 12:05</span></div>
<div v-for="(item,index) in recordList" :key="index">
<!-- 我的 -->
<div v-if="item.id==userId" class="word-my">
<div class="info">
<p class="name">{{ item.nickName }} </p>
<div class="info-content">{{ item.contactText }}</div>
</div>
<el-avatar text="我"/>
</div>
<!-- 对方 -->
<div v-else class="word">
<el-avatar text="对方"/>
<div class="info">
<p class="name">{{ item.nickName }} </p>
<div class="info-content">{{ item.contactText }}</div>
</div>
</div>
</div>
</div>
</el-scrollbar>
</div>
</template>
<script setup>
import Stomp from 'stompjs'
import SockJS from 'sockjs-client/dist/sockjs.min.js'
import {getToken} from '@/utils/auth'
const userId = ref(1)
const recordList = ref([{
id: 2,
nickName: 'AI助手',
contactText: '你好'
},
{
id: 1,
nickName: '我',
contactText: '你好!'
},
{
id: 2,
nickName: 'AI助手',
contactText: '你好'
},
{
id: 1,
nickName: '我',
contactText: '你好!'
},
{
id: 2,
nickName: 'AI助手',
contactText: '你好'
},
{
id: 1,
nickName: '我',
contactText: '你好!'
},
])
// setInterval(() => {
// recordList.value.push( {
// id: 1,
// nickName: '我',
// contactText: '45535'
// },
// {
// id: 2,
// nickName: 'AI助手',
// contactText: '555'
// })
// scrollToBottom();
// }, 1000)
//聊天消息滚动面板dom
const scrollbarRef = ref(null);
//滚动面板自动滑动到底部
const scrollToBottom = () => {
if (scrollbarRef.value) {
const container = scrollbarRef.value.$el.querySelector('.el-scrollbar__wrap');
container.style.scrollBehavior = 'smooth'; // 添加平滑滚动效果
container.scrollTop = container.scrollHeight;
}
};
nextTick(() => {
scrollToBottom();
})
// onMounted(() => {
// scrollToBottom();
// })
const initWebSocket = () => {
try {
const wsUrl = "http://frp.feashow.cn:31800/ws"
const socket = new SockJS(wsUrl)
const stompClient = Stomp.over(socket);
stompClient.connect(
{"Authorization": getToken()},//传递token
(frame) => {
//测试topic
stompClient.subscribe("/topic/messages", (message) => {
const messagesList = document.getElementById('messagesList');
let listItem = document.createElement('li');
listItem.textContent = message.body;
messagesList.appendChild(listItem);
});
//测试发送
stompClient.send("/app/receive", {}, JSON.stringify({"user": "2222222"}))
},
(err) => {
console.log("错误：");
console.log(err);
//10s后重新连接一次
setTimeout(() => {
initWebSocket();
}, 10000)
}
);
} catch (e) {
console.log(e)
console.log("ws连接失败");
}
}
// initWebSocket()
</script>
<style lang="scss" scoped>
.live-call {
width: 48%;
height: 47.5vh;
margin-bottom: 20px;
overflow: hidden;
border: 1px solid #d5d4d4;
border-radius: 10px;
.header {
display: flex;
justify-content: space-around;
align-items: center;
height: 40px;
border-bottom: 1px solid #d5d4d4;
}
.scrollbar {
padding: 10px 10px 0 10px;
height: 380px;
.el-scrollbar__wrap {
height: 100%;
overflow: scroll;
overflow-x: auto;
}
// 聊天内容样式
.chat-content {
width: 100%;
.time-grap {
display: flex;
align-items: center;
justify-content: center;
> span {
font-size: 13px;
padding: 5px 10px;
border: 1px solid #d7d9da;
border-radius: 25px;
}
margin-bottom: 10px;
}
.word {
display: flex;
margin-bottom: 20px;
img {
width: 40px;
height: 40px;
border-radius: 50%;
}
.info {
margin-left: 10px;
.name {
font-size: 12px;
color: rgba(51, 51, 51, 0.8);
margin: 0;
height: 20px;
line-height: 20px;
margin-top: -5px;
}
.info-content {
padding: 10px;
font-size: 14px;
background: #f5f5f5;
position: relative;
margin-top: 8px;
border: 1px solid #f5f5f5;
}
//小三角形
.info-content::before {
position: absolute;
left: -8px;
top: 8px;
content: '';
border-right: 10px solid #f5f5f5;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
}
}
}
.word-my {
display: flex;
justify-content: flex-end;
margin-bottom: 20px;
img {
width: 40px;
height: 40px;
border-radius: 50%;
}
.info {
width: 90%;
margin-left: 10px;
text-align: right;
.name {
font-size: 12px;
color: rgba(51, 51, 51, 0.8);
height: 20px;
line-height: 20px;
margin-top: -5px;
margin-right: 10px;
}
.info-content {
max-width: 70%;
padding: 10px;
font-size: 14px;
float: right;
margin-right: 10px;
position: relative;
margin-top: 8px;
background: #A3C3F6;
text-align: left;
}
//小三角形
.info-content::after {
position: absolute;
right: -8px;
top: 8px;
content: '';
border-left: 10px solid #A3C3F6;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
}
}
}
}
}
}
</style>

36
src/components/liveCall/index.vue Normal file
View File

@@ -0,0 +1,36 @@
<template>
<div class="live-call-block">
<live-call-item v-for="item in 2"/>
</div>
</template>
<script setup>
</script>
<style lang="scss" scoped>
.live-call-block {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-around;
height: 470px;
overflow-y: auto;
&::-webkit-scrollbar {
width: 6px;
}
// 滚动条轨道
&::-webkit-scrollbar-track {
background: rgb(239, 239, 239);
border-radius: 2px;
}
// 小滑块
&::-webkit-scrollbar-thumb {
background: rgba(80, 81, 82, 0.29);
border-radius: 10px;
}
}
</style>

1
src/directives/permission.js
View File

@@ -10,7 +10,6 @@ export const hasPerm = (el, binding, vnode) => {
const hasPermission = permisstions.some(permission => { const hasPermission = permisstions.some(permission => {
return allPermission === permission || permissiosFlag.includes(permission) return allPermission === permission || permissiosFlag.includes(permission)
}) })
console.log(hasPermission);
if (!hasPermission) { if (!hasPermission) {
el.parentNode && el.parentNode.removeChild(el) el.parentNode && el.parentNode.removeChild(el)
} }

1
src/fvcomponents/fvForm/index.vue
View File

@@ -62,7 +62,6 @@ const filterSchma = computed(()=>{
}) })
}) })
console.log(filterSchma.value, 'filterSchma');
const validate = async () => { const validate = async () => {
let validObj = {} let validObj = {}

62
src/fvcomponents/fvFormDialog/index.vue Normal file
View File

@@ -0,0 +1,62 @@
<template>
<el-dialog v-model="localDialogParams.localVisited" :title="localDialogParams.localTitle" :width="localDialogParams.localWidth+'px'">
<fvForm :schema="localDialogParams.localFormSchema" @getInstance="(e)=>baseForm = e" label-position="right" :rules="localDialogParams.localFormRules"></fvForm>
<template #footer>
<span>
<el-button @click="handleCancel">取消</el-button>
<el-button type="primary" @click="handleSubmit">确定</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
const emits = defineEmits(['getInstance'])
const props = defineProps({
isVisited: {
type: Boolean,
default: true
},
title: {
type: Boolean,
default: true
},
width: {
type: String,
default: '700'
},
formSchema: {
type: Function,
default: ()=>{}
},
formRules: {
type: Object,
default: {}
}
})
const baseForm = ref()
const localDialogParams = ref({})
watchEffect(()=>{
localDialogParams.value.localVisited = props.isVisited
localDialogParams.value.localTitle = props.title
localDialogParams.value.localWidth = props.width
localDialogParams.value.localFormSchema = props.formSchema
localDialogParams.value.localFormRules = props.formRules
})
const getFormInstance=()=>{
return baseForm.value
}
const handleCancel=()=>{
emits('dialogCancel')
}
const handleSubmit=()=>{
emits('dialogSubmit',baseForm.value)
}
defineExpose({
getFormInstance
})
</script>
<style scoped>
</style>

2
src/fvcomponents/fvRadio/index.vue
View File

@@ -15,7 +15,7 @@ const props = defineProps({
default: [] default: []
}, },
modelValue: { modelValue: {
type: [Number, String], type: [Number, String, Boolean],
default: '' default: ''
}, },
cacheKey: { cacheKey: {

29
src/fvcomponents/fvSearchForm/index.vue
View File

@@ -28,7 +28,8 @@
</template> </template>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="filterConfig.length % 4 == 0 ? 4 : 6" class="btn-col"> <!-- class="btn-col"-->
<el-col :span="filterConfig.length % 4 == 0 ? 4 : 6" :offset="1">
<el-form-item> <el-form-item>
<el-button v-if="searchConfig.length>=4" link type="primary" @click="showMore = !showMore"> <el-button v-if="searchConfig.length>=4" link type="primary" @click="showMore = !showMore">
{{ showMore ? '收起' : '展开' }} {{ showMore ? '收起' : '展开' }}
@@ -65,21 +66,25 @@ const filterConfig = computed(()=>{
return arr.length >= 4 && showMore.value ? arr : arr.slice(0, 3) return arr.length >= 4 && showMore.value ? arr : arr.slice(0, 3)
}) })
console.log(filterConfig.value, 'filterConfig');
// 搜索功能表单元素默认值 // 搜索功能表单元素默认值
const setDefaultFormValues = () => { // const setDefaultFormValues = () => {
filterConfig.value.forEach(item=>{ // filterConfig.value.forEach(item => {
form.value[item.prop] = item.props.defaultValue || null // form.value[item.prop] = item.props?.defaultValue || null
}) // })
} // }
watchEffect(()=>{ watchEffect(() => {
if(filterConfig.value.length) { if (filterConfig.value.length) {
setDefaultFormValues() // setDefaultFormValues()
} }
}) })
const elChange = () => {
setTimeout(() => {
getValues()
}, 500)
}
const getValues = () => { const getValues = () => {
emits('search', form.value) emits('search', form.value)
return form.value return form.value
@@ -88,7 +93,7 @@ const getValues = () => {
//重置 //重置
const handleReset = () => { const handleReset = () => {
form.value = {} form.value = {}
setDefaultFormValues() // setDefaultFormValues()
emits('search', form.value) emits('search', form.value)
} }

248
src/fvcomponents/fvTable/index.vue
View File

@@ -2,35 +2,74 @@
<div class="fv-table-container"> <div class="fv-table-container">
<!-- 表格头部按钮 --> <!-- 表格头部按钮 -->
<div class="fv-table-btn" v-if="tableConfig.btns"> <div class="fv-table-btn" v-if="tableConfig.btns">
<el-button <div class="table-head-btn">
v-for="btn in tableConfig.btns" <el-button
:key="btn.key" v-for="btn in tableConfig.btns"
:type="btn.type || ''" :key="btn.key"
v-perm="btn.auth || ['*:*:*']" :type="btn.type || ''"
@click="handleClickBtns(btn.key)" :color="btn.color || ''"
> v-perm="btn.auth || ['*:*:*']"
{{ btn.name }} @click="handleClickBtns(btn.key)"
</el-button> >
{{ btn.name }}
</el-button>
</div>
</div>
<!-- 列显示配置 -->
<div v-if="isSettingCol" style="float: right">
<!-- <el-button v-if="tableConfig.export && tableConfig.export.open" @click="exportTable" color="#DED0B2"-->
<!-- style="margin-bottom: 10px">导出-->
<!-- </el-button>-->
<el-tooltip effect="dark" content="列配置" placement="bottom">
<el-button ref="buttonRef" link>
<el-icon size="18">
<Setting/>
</el-icon>
</el-button>
</el-tooltip>
<el-popover
placement="bottom"
:width="200"
ref="popoverRef"
:virtual-ref="buttonRef"
virtual-triggering
trigger="click">
<div class="col-setting-checkall">
<el-checkbox label="列展示" v-model="localData.allColShow" :indeterminate="localData.indeterminate"
@change="changeIsShowAll"></el-checkbox>
</div>
<div class="col-setting-list">
<el-checkbox-group v-model="localData.checkGroup" @change="changeColShow">
<el-space direction="vertical" alignment="flex-start" :size="0">
<el-checkbox
v-for="item in tableConfig.columns"
:key="item.prop"
:label="item.label"
:value="item.prop"
/>
</el-space>
</el-checkbox-group>
</div>
</el-popover>
</div> </div>
<!-- 表格部分 --> <!-- 表格部分 -->
<div class="fv-table"> <div class="fv-table">
<el-table <el-table
:data="localData.list" :data="localData.list"
v-loading="localData.loading" v-loading="localData.loading"
:row-key="tableConfig?.rowKey || 'id'" :row-key="tableConfig?.rowKey || 'id'"
v-bind="$attrs" v-bind="$attrs"
table-layout="fixed" :show-overflow-tooltip="true"
:show-overflow-tooltip="true" highlight-current-row
highlight-current-row @selection-change="selectionChange"
@selection-change="selectionChange" @row-click="rowClick"
@row-click="rowClick" @row-dblclick="rowDblclick"
@row-dblclick="rowDblclick" @cell-click="cellClick"
@cell-click="cellClick" v-tabh
v-tabh ref="tableInstance"
ref="tableInstance"
> >
<template #default> <template #default>
<fvTableColumn v-for="column in tableConfig.columns" :key="column.prop" :columns="column"> <fvTableColumn v-for="column in localData.columns" :key="column.prop" :columns="column">
<template v-if="column?.slots?.header" #[column?.slots?.header]="params"> <template v-if="column?.slots?.header" #[column?.slots?.header]="params">
<slot :name="column?.slots?.header" v-bind="params || {}"></slot> <slot :name="column?.slots?.header" v-bind="params || {}"></slot>
</template> </template>
@@ -48,22 +87,23 @@
</el-table> </el-table>
<!-- 分页 --> <!-- 分页 -->
<fvPagination <fvPagination
v-if="pagination" v-if="pagination"
:current-page="localData.query.pageNum" :current-page="localData.query.pageNum"
:page-size="localData.query.pageSize" :page-size="localData.query.pageSize"
:page-sizes="[10, 20, 30, 40,50]" :page-sizes="[10, 20, 30, 40,50]"
:total="localData.total" :total="localData.total"
@changeSize="handleSizeChange" @changeSize="handleSizeChange"
@goPage="handleCurrentChange" @goPage="handleCurrentChange"
> >
</fvPagination> </fvPagination>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { ElMessage } from 'element-plus'; import { ElMessage,ElNotification } from 'element-plus';
import { requestList } from '../../api/common'; import { requestList } from '../../api/common';
// import {exportExcel} from "@/utils/export-excel";
const props = defineProps({ const props = defineProps({
//表格配置 //表格配置
@@ -80,10 +120,31 @@ const props = defineProps({
pagination: { pagination: {
type: Boolean, type: Boolean,
default: true default: true
},
// 是否显示列配置
isSettingCol: {
type: Boolean,
default: true
} }
}) })
const tableInstance = ref() const tableInstance = ref()
const buttonRef = ref()
const popoverRef = ref()
const exportTable = () => {
const $e = tableInstance.value.$el
let $table = $e.querySelector('.el-table__fixed')
if (!$table) {
$table = $e
}
let fileName = ""
if (props.tableConfig.export && props.tableConfig.export) {
fileName = props.tableConfig.export.fileName
}
exportExcel($table, Object.keys(localData.list[0]), fileName)
}
const localData = reactive({ const localData = reactive({
list: [], // 表格数据 list: [], // 表格数据
@@ -92,32 +153,104 @@ const localData = reactive({
pageNum: 1 pageNum: 1
}, },
total: 0, total: 0,
loading: false loading: false,
// 列展示设置
columns: [],
allColShow: true, // 默认全部列都展示
indeterminate: false,
checkGroup: []
}) })
const emits = defineEmits(['headBtnClick', 'selectionChange', 'rowClick', 'rowDblclick', 'getBaseQuery', 'cellClick']) const emits = defineEmits(['headBtnClick', 'selectionChange', 'rowClick', 'rowDblclick', 'getBaseQuery', 'cellClick', 'getTotal'])
const handleClickBtns = (key) => { const handleClickBtns = (key) => {
emits('headBtnClick', key) emits('headBtnClick', key)
} }
const filterColumns = () => {
localData.columns = props.tableConfig.columns.map(item => {
if (item.prop) {
return {
...item
}
}
})
}
const changeIsShowAll = (val) => {
if (val) {
filterColumns()
localData.indeterminate = false
localData.checkGroup = props.tableConfig.columns.map(item => item.prop)
} else {
localData.columns.length = 0
localData.checkGroup.length = 0
localData.indeterminate = false
}
}
const changeColShow = (val) => {
if (val.length == props.tableConfig.columns.length) {
localData.indeterminate = false
localData.allColShow = true
} else if (val.length !== props.tableConfig.columns.length && val.length != 0) {
localData.allColShow = false
localData.indeterminate = true
} else {
localData.indeterminate = false
localData.allColShow = false
}
const template = []
props.tableConfig.columns.forEach(item => {
val.forEach(v => {
if (item.prop == v) {
template.push(item)
}
})
})
localData.columns = template
}
filterColumns()
const getList = async () => { const getList = async () => {
const { api, params } = props.tableConfig const { api, params } = props.tableConfig
const queryParmas = {...localData.query, ...params} const queryParmas = {...localData.query, ...params}
if(api) { if(api) {
localData.loading = true localData.loading = true
try { try {
const { code, data, msg } = await requestList(api, queryParmas) const {code, data, msg} = await requestList(api, queryParmas).then(res=>{
if ( code === 1000 ) { // console.log(res)
localData.list = data.rows return res
})
// console.log(code,data,msg)
if (code === 1000) {
if (data.rows) {
localData.list = data.rows
} else {
localData.list = data
}
localData.total = data.total localData.total = data.total
emits('getTotal', localData.total)
localData.loading = false localData.loading = false
} else { } else {
ElMessage.error(msg) ElNotification({
title: '提示',
message: msg,
type: 'error'
})
localData.loading = false localData.loading = false
} }
} catch (error) { } catch (error) {
ElMessage.error('请求数据失败') console.log("error",error)
if (!error){
return
}
ElNotification({
title: '提示',
message: '请求数据失败',
type: 'error'
})
localData.loading = false localData.loading = false
} }
} else { } else {
@@ -154,13 +287,11 @@ const handleCurrentChange = (val) => {
getList() getList()
} }
// watchEffect(()=>{ watchEffect(() => {
// if(!props.tableConfig.api) { if (localData.allColShow) {
// localData.list = props.data localData.checkGroup = props.tableConfig.columns.map(item => item.prop)
// }else { }
// getList() })
// }
// })
//刷新 //刷新
const refresh = ({resetPage=false}={}) => { const refresh = ({resetPage=false}={}) => {
resetPage ? localData.query.pageNum = 1 : null resetPage ? localData.query.pageNum = 1 : null
@@ -184,5 +315,30 @@ onMounted(() => {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.col-setting-checkall {
border-bottom: 1px solid rgb(210, 210, 213);
}
.col-setting-list {
max-height: 45vh;
overflow-y: auto;
}
.table-head-btn {
display: flex;
justify-content: flex-start;
align-items: center;
}
.fv-table-btn {
display: flex;
justify-content: space-between;
align-content: center;
}
.fv-table {
:deep(.el-tooltip) {
width: 100% !important;
}
}
</style> </style>

2
src/fvcomponents/fvTableColumn/index.vue
View File

@@ -49,7 +49,7 @@ import { isVNode } from 'vue'
if(column && column?.formatter) { if(column && column?.formatter) {
return column.formatter(row, column, value, $index) || '--' return column.formatter(row, column, value, $index) || '--'
} }
return value ? value.toString() : '--' return value !== null && value !== undefined ? value.toString() : '--'
} }
</script> </script>

20
src/layout/siderbar/MenuItem.vue
View File

@@ -1,7 +1,7 @@
<template> <template>
<!-- 有子菜单 --> <!-- 有子菜单 -->
<template v-for="item in menuItem" :key="item.path"> <template v-for="item in menuItem" :key="item.path">
<el-sub-menu v-if="item?.children?.length>0 && !item.hidden" :index="item.path"> <el-sub-menu v-if="checkMenuItem(item)" :index="item.path">
<template #title> <template #title>
<svg-icon :name="item.icon"/> <svg-icon :name="item.icon"/>
<span>{{ item.title }}</span> <span>{{ item.title }}</span>
@@ -17,7 +17,9 @@
</a> </a>
</div> </div>
<div v-else> <div v-else>
<svg-icon :name="item.icon"/> <el-icon>
<svg-icon :name="item.icon" class="menu-item-icon"/>
</el-icon>
<span>{{ item.title }}</span> <span>{{ item.title }}</span>
</div> </div>
</template> </template>
@@ -44,5 +46,19 @@ const handleGo = (path) => {
} }
} }
const checkMenuItem = (item) => {
let children = item.children
let childState = false;
if (children){
for (let child of children) {
if (!child.hidden) {
childState = true
break
}
}
}
return item?.children?.length>0 && !item.hidden && childState
}
</script> </script>

4
src/layout/tagsview/index.vue
View File

@@ -4,7 +4,7 @@
<div> <div>
<router-link <router-link
v-for="item in tagsViewStore.visitedViews" v-for="item in tagsViewStore.visitedViews"
:key="item.path" :to="{ path: item.path }" class="tag" :key="item.path" :to="{ path: item.path, query: item.query }" class="tag"
:class="isActive(item) ? 'active' : ''" :class="isActive(item) ? 'active' : ''"
@click.prevent @click.prevent
@contextmenu.prevent.native="openMenu(item, $event)"> @contextmenu.prevent.native="openMenu(item, $event)">
@@ -83,7 +83,7 @@ init()
border: 1px solid darkgray; border: 1px solid darkgray;
font-size: 13px; font-size: 13px;
margin-right: 8px; margin-right: 8px;
border-radius: 4px; border-radius: 6px;
background-color: #fff; background-color: #fff;
} }

7
src/stores/processStore.js
View File

@@ -35,13 +35,12 @@ export const useProcessStore = defineStore('process', () => {
} }
const addProcess = (val) => { const addProcess = (val) => {
console.log("添加节点成功")
processData.value.process.push(val) processData.value.process.push(val)
} }
const delProcess = (delNode) => { const delProcess = (delNode) => {
processData.value.process.splice(processData.value.process.indexOf(delNode), 1) processData.value.process.splice(processData.value.process.indexOf(delNode), 1)
console.log("删除数据") // console.log("删除数据")
console.log(processData.value.process) // console.log(processData.value.process)
} }
const getDesign = () => { const getDesign = () => {
@@ -60,7 +59,7 @@ export const useProcessStore = defineStore('process', () => {
const getFormMap = () => { const getFormMap = () => {
//表单映射对象 //表单映射对象
const map = new Map(); const map = new Map();
processData.value.formItems.forEach(item => itemToMap(map, item)) processData.value.formItems?.forEach(item => itemToMap(map, item))
return map return map
} }

31
src/stores/tagsview.js
View File

@@ -1,20 +1,21 @@
import { defineStore } from "pinia"; import { defineStore } from "pinia";
import { ref } from "vue"; import { ref } from "vue";
import { useRouter } from "vue-router"; import { useRouter, useRoute } from "vue-router";
export const useTagsView = defineStore('tagsView',()=>{ export const useTagsView = defineStore('tagsView',()=>{
const router = useRouter() const router = useRouter()
const route = useRoute()
//已显示的标签页list //已显示的标签页list
const visitedViews = ref([]) const visitedViews = ref([])
//添加标签页面 //添加标签页面
const addVisitedViews = ({path,meta}) => { const addVisitedViews = ({path,meta,query}) => {
if(visitedViews.value.length == 0) { if(visitedViews.value.length == 0) {
visitedViews.value.push({path,meta}) visitedViews.value.push({path,meta,query})
}else { }else {
const paths = visitedViews.value.map(item => item.path) const paths = visitedViews.value.map(item => item.path)
if(paths.includes(path) == false) { if(paths.includes(path) == false) {
visitedViews.value.push({path,meta}) visitedViews.value.push({path,meta,query})
} }
} }
} }
@@ -32,17 +33,31 @@ export const useTagsView = defineStore('tagsView',()=>{
toLastTagView(visitedViews) toLastTagView(visitedViews)
} }
//删除当前标签页并跳转到指定路由
const delViewAndGoView = (path) => {
visitedViews.value.forEach((item,index)=>{
if(item.path == route.path) {
visitedViews.value.splice(index,1)
}
})
router.push(path)
}
//删除其他标签页 //删除其他标签页
const delOtherVisitedViews = ({path,meta}) => { const delOtherVisitedViews = ({path,meta,query}) => {
visitedViews.value = [] visitedViews.value = []
visitedViews.value.push({path,meta}) visitedViews.value.push({path,meta,query})
toLastTagView(visitedViews) toLastTagView(visitedViews)
} }
//路由到末尾标签页 //路由到末尾标签页
const toLastTagView = (view) => { const toLastTagView = (view) => {
const lastTagView = view.value.slice(-1)[0] const lastTagView = view.value.slice(-1)[0]
router.push(lastTagView.path) router.push({path: lastTagView.path, query: lastTagView.query})
}
const removeAllTagView = () => {
visitedViews.value.length = 0
} }
return { return {
@@ -50,5 +65,7 @@ export const useTagsView = defineStore('tagsView',()=>{
addVisitedViews, addVisitedViews,
delVisitedViews, delVisitedViews,
delOtherVisitedViews, delOtherVisitedViews,
delViewAndGoView,
removeAllTagView
} }
}) })

8
src/utils/request.js
View File

@@ -33,8 +33,14 @@ serveice.interceptors.response.use(response=>{
return response.data return response.data
},error=>{ },error=>{
let response = error.response let response = error.response
if (!response) {
return Promise.reject()
}
const status = response.status; const status = response.status;
switch(status) { if (!status) {
return Promise.reject()
}
switch (status) {
case 401: case 401:
ElMessageBox.confirm('登录状态已过期,请重新登录','系统提示',{ ElMessageBox.confirm('登录状态已过期,请重新登录','系统提示',{
confirmButtonText: '重新登录', confirmButtonText: '重新登录',

49
src/views/home/index.vue
View File

@@ -1,14 +1,26 @@
<template> <template>
<div class="home"> <div class="home">
<div class="real-time-call">实时通话</div> <h3 style="margin-bottom: 10px;margin-top: 10px">实时通话</h3>
<div class="call-history">历史通话记录 <div class="real-time-call">
<LiveCall />
</div>
<hr><br>
<div class="call-history"><h3 >历史通话记录</h3>
<fvTable ref="tableIns" :tableConfig="tableConfig" :data="mockData" @headBtnClick="headBtnClick"></fvTable> <fvTable ref="tableIns" :tableConfig="tableConfig" :data="mockData" @headBtnClick="headBtnClick"></fvTable>
<Voice ref="voiceRef" />
<infoLiveCall ref="infoLiveCallRef"/>
</div> </div>
</div> </div>
</template> </template>
<script setup lang="jsx"> <script setup lang="jsx">
import LiveCall from '@/components/liveCall/index.vue'
import Voice from '@/components/voice/index.vue'
import infoLiveCall from '@/components/infoLiveCall/index.vue'
const infoLiveCallRef=ref()
const voiceRef=ref()
const tableIns = ref() const tableIns = ref()
const mockData = ref([ const mockData = ref([
{ {
@@ -84,7 +96,7 @@ const tableConfig = reactive({
label: '拨打时间', label: '拨打时间',
align: 'center', align: 'center',
width: 200 width: 200
},{ }, {
prop: 'oper', prop: 'oper',
label: '操作', label: '操作',
align: 'center', align: 'center',
@@ -94,23 +106,24 @@ const tableConfig = reactive({
currentRender: ({ row, index }) => { currentRender: ({ row, index }) => {
// console.log(row); // console.log(row);
let btn = [] let btn = []
btn.push({ label: '语音', prem: auths.detail, func: () => handleDetail(row), type: 'primary' }) btn.push({ label: '语音', prem: auths.detail, func: () => handleVoice(row), type: 'primary' })
btn.push({ label: '信息', prem: auths.detail, func: () => handleClose(row), type: 'primary' }) btn.push({ label: '信息', prem: auths.detail, func: () => handleInfo(row), type: 'primary' })
return ( return (
<div style={{ width: '100%' }}> <div style={{ width: '100%' }}>
{ {
btn.map(item => ( btn.map(item => (
<el-button <>
type={item.type} <el-button
// v-perm={item.prem} type={item.type}
onClick={() => item.func()} // v-perm={item.prem}
link onClick={() => item.func()}
> link>
{item.label} {item.label}
</el-button> </el-button>
</>
)) ))
} }
</div> </div >
) )
} }
} }
@@ -121,8 +134,12 @@ const tableConfig = reactive({
// {name: '新增', key: 'add',type:'primary',icon:'Plus'}, // {name: '新增', key: 'add',type:'primary',icon:'Plus'},
] ]
}) })
const handleVoice = (row) => {
voiceRef.value.open(true)
}
const handleInfo = (row) => {
infoLiveCallRef.value.open(true)
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

2
src/views/login/index.vue
View File

@@ -6,7 +6,7 @@
:rules="rules" :rules="rules"
label-width="70px" label-width="70px"
> >
<h3>工单管理系统</h3> <h3>智能语音服务系统</h3>
<el-form-item prop="username" label="账号"> <el-form-item prop="username" label="账号">
<el-input v-model="loginForm.username" :prefix-icon="User" ></el-input> <el-input v-model="loginForm.username" :prefix-icon="User" ></el-input>
</el-form-item> </el-form-item>

688
src/views/system/user/index.vue
View File

@@ -1,318 +1,76 @@
<template> <template>
<div class="layout"> <fvSearchForm :searchConfig="searchConfig" @search="search"></fvSearchForm>
<div class="layout-left" style="width: 20%;border:none;"> <fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick"></fvTable>
<el-form :model="queryDept" @submit.prevent> <fvFormDialog v-if="showAddOrEditUserDialog" ref="formDialogRef" :title="title" :form-schema="formSchema" :form-rules="formRules" @dialogCancel="handleCancel" @dialogSubmit="handleSubmit"></fvFormDialog>
<el-form-item prop="dictType">
<el-input v-model="queryDept.deptName" placeholder="请输入部门名称" :prefix-icon="Search"
clearable @clear="handleSearchDept" @input="handleSearchDept"></el-input>
</el-form-item>
</el-form>
<div class="scrollbar-user scrollbar-dict">
<el-tree :data="deptList" :props="deptProps" empty-text="" node-key="value" default-expand-all
highlight-current :expand-on-click-node="false"
@node-click="handle">
<template #default="{ node, data }">
{{ node.label }}
</template>
</el-tree>
</div>
</div>
<div class="layout-right">
<el-form :model="queryParams" class="query-form" inline ref="userForm">
<el-form-item label="用户名称" prop="userName">
<el-input
v-model="queryParams.userName"
placeholder="请输入用户名称"
clearable
></el-input>
</el-form-item>
<el-form-item label="手机号码" prop="phoneNumber">
<el-input
v-model="queryParams.phoneNumber"
placeholder="请输入手机号码"
clearable
></el-input>
</el-form-item>
<el-form-item label="状态" prop="state">
<el-select
v-model="queryParams.state"
placeholder="用户状态"
clearable
filterable
>
<el-option
v-for="item in cacheStore.getDict('normal_disable')"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="创建时间" prop="dateValue">
<el-config-provider>
<el-date-picker
v-model="dateValue"
type="datetimerange"
:shortcuts="shortcuts"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="YYYY-MM-DD HH:mm:ss"
/>
</el-config-provider>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getList" :icon="Search">搜索</el-button>
<el-button @click="handleReset" :icon="Refresh">重置</el-button>
</el-form-item>
</el-form>
<div class="table-header-btn">
<el-button type="primary" @click="handleAdd" :icon="Plus">新增</el-button>
</div>
<div class="table">
<el-table
:data="list"
row-key="userId"
:lazy="true"
v-loading="loading"
:header-cell-style="{'background':'#f5f5f8'}"
v-tabh
>
<el-table-column label="序号" type="index" align="center" width="60"/>
<!-- <el-table-column prop="userId" label="用户编号" align="center"/>-->
<el-table-column prop="userName" label="用户名称" align="center"/>
<el-table-column prop="nickName" label="用户昵称" align="center"/>
<el-table-column prop="deptName" label="部门" align="center"/>
<el-table-column prop="phoneNumber" label="手机号码" align="center"/>
<el-table-column prop="state" label="状态" align="center">
<template #default="scope">
<tag dict-type="normal_disable" :value="scope.row.state"/>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" align="center" width="180px"/>
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button type="primary" size="mini"
@click="handleEdit(scope.row.userId)" link>编辑
</el-button>
<popover-delete :name="scope.row.userName" :type="'用户'"
@delete="handleDelete(scope.row.userId)"/>
</template>
</el-table-column>
</el-table>
</div>
<paging :current-page="pageInfo.pageNum" :page-size="pageInfo.pageSize" :page-sizes="[10, 20, 30, 40,50]"
:total="total" @changeSize="handleSizeChange" @goPage="handleCurrentChange"/>
<el-dialog v-model="isVisited" :title="title" width="700px">
<el-form :model="form" ref="formInstance" label-width="80px" :rules="rules">
<el-row>
<el-col :span="12">
<el-form-item label="用户名称" prop="userName">
<el-input v-model="form.userName" placeholder="请输入用户名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="用户昵称" prop="nickName">
<el-input v-model="form.nickName" placeholder="请输入用户昵称"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="用户性别" prop="sex">
<el-select v-model="form.sex"
placeholder="请选择用户性别"
style="width: 250px" filterable>
<el-option
v-for="item in cacheStore.getDict('user_sex')"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="用户密码" prop="password">
<el-input
v-model="form.password"
type="password"
placeholder="请输入密码"
show-password
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="归属部门" prop="deptId">
<el-tree-select
ref="treeSelect"
v-model="form.deptId"
:data="deptList"
:props="deptProps"
value-key="value"
check-strictly
:render-after-expand="false"
@node-click=""
style="width: 250px"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="手机号码" prop="phoneNumber">
<el-input v-model="form.phoneNumber" placeholder="请输入手机号码"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="邮箱" prop="email">
<el-input v-model="form.email" placeholder="请输入邮箱"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="状态" prop="state">
<el-radio-group v-model="form.state" size="mini">
<el-radio v-for="user in cacheStore.getDict('normal_disable')" :key="user.value"
:label="user.value">
{{ user.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="岗位" prop="postIds">
<el-select
v-model="form.postIds"
multiple
placeholder="请选择岗位"
style="width: 250px" filterable
>
<div v-if="title=='新增用户'">
<el-option
v-for="item in postList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</div>
<div v-else>
<el-option
v-for="item in form.postList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</div>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="角色" prop="roleIds">
<el-select v-model="form.roleIds"
multiple
placeholder="请选择角色"
style="width: 250px" filterable>
<div v-if="title=='新增用户'">
<el-option
v-for="item in roleList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</div>
<div v-else>
<el-option
v-for="item in form.roleList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</div>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input
type="textarea"
:rows="3"
maxlength="255"
show-word-limit
placeholder="请输入内容"
v-model="form.remark">
</el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span>
<el-button @click="handleCancel">取消</el-button>
<el-button type="primary" @click="handleSubmit(formInstance)">确定</el-button>
</span>
</template>
</el-dialog>
</div>
</div>
</template> </template>
<script setup> <script setup>
import {Search, Refresh, Plus, Edit, Delete} from "@element-plus/icons-vue"; import {getUserDetail, addUser, editUser} from "@/api/user/user";
import {defineProps} from "vue"; import {ElMessage} from "element-plus";
import {getRoleOption} from "@/api/role/role";
import {getUserList, getUserDetail, addUser, editUser,deleteUser} from "@/api/user/user";
import {getDeptList} from "@/api/dept/dept";
import {getSelectOption} from "@/api/post/post";
import {ElMessage, ElMessageBox} from "element-plus";
import {useCacheStore} from "@/stores/cache.js"; import {useCacheStore} from "@/stores/cache.js";
import Tag from '@/components/Tag.vue'
import Paging from "@/components/pagination/index.vue";
const cacheStore = useCacheStore(); const tableIns = ref()
//查询参数 const formDialogRef = ref()
const queryDept = reactive({ const showAddOrEditUserDialog = ref(false)
deptName: "" const searchConfig = reactive([
}); {
const queryParams = reactive({ label: '用户名称',
deptId: "", prop: 'requirementName',
userName: "", props: {
phoneNumber: "", placeholder: '请输入用户名称查询',
state: "", clearable: true,
startTime: "", checkStrictly: true
endTime: "" },
}); component: 'el-input',
const userForm = ref(); },
const list = ref([]); {
const total = ref([]); label: '手机号码',
//页面信息 prop: 'requirementName',
const pageInfo = reactive({ props: {
pageNum: 1, placeholder: '请输入手机号码查询',
pageSize: 10 clearable: true,
}); checkStrictly: true
const loading = ref(true); },
const treeSelect = ref(); component: 'el-input',
const postList = ref([]); },
const roleList = ref([]); ])
const deptList = ref([]); const tableConfig = reactive({
const deptProps = reactive({ columns: [
value: "deptId", {
label: "deptName" prop: 'index',
}); type: 'index',
const props = defineProps({ label: '序号',
value: { align: 'center',
type: Array, width: 80,
default: () => { },
return []; {
} prop: 'userName',
} label: '登录账号',
}); align: 'center'
const form = ref({ },
// user: [], {
// postIds: "", prop: 'nickName',
// roleIds: "", label: '用户姓名',
roleList: [], align: 'center'
postList: [] },
}); {
const formInstance = ref(); prop: 'phoneNumber',
const isVisited = ref(false); label: '手机号码',
const title = ref(""); align: 'center'
const rules = reactive({ },
{
prop: 'workOrderTime',
label: '电子邮箱',
align: 'center',
},
],
api: '/user',
params: {},
btns: [
{name: '导入', key: 'add', type: 'primary'},
]
})
const formRules = reactive({
nickName: [ nickName: [
{required: true, message: "请输入用户昵称", trigger: "blur"} {required: true, message: "请输入用户昵称", trigger: "blur"}
], ],
@@ -323,199 +81,128 @@ const rules = reactive({
{required: true, message: "请输入用户密码", trigger: "blur"} {required: true, message: "请输入用户密码", trigger: "blur"}
] ]
}); });
const dateValue = ref(); const formSchema = computed(() => {
const shortcuts = [ return [
{ {
text: "上周", label: '登录账号',
value: () => { prop: 'userName',
const end = new Date(); component: 'el-input',
const start = new Date(); colProps: {
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); span: 24
return [start, end]; },
} props: {
}, placeholder: '请输入登录账号',
{ clearable: true,
text: "上月", // type: 'textarea',
value: () => { // rows: 3
const end = new Date(); }
const start = new Date(); },
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); {
return [start, end]; label: '用户姓名',
} prop: 'nickName',
}, component: 'el-input',
{ colProps: {
text: "三月前", span: 24
value: () => { },
const end = new Date(); props: {
const start = new Date(); placeholder: '请输入用户姓名',
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90); clearable: true,
return [start, end]; }
} },
{
label: '用户性别',
prop: 'sex',
component: 'el-input',
colProps: {
span: 24
},
props: {
placeholder: '请输入用户性别',
clearable: true,
}
},
{
label: '用户密码',
prop: 'password',
component: 'el-input',
colProps: {
span: 24
},
props: {
placeholder: '请输入用户密码',
clearable: true,
},
},
{
label: '手机号码',
prop: 'phoneNumber',
component: 'el-input',
colProps: {
span: 24
},
props: {
placeholder: '请输入手机号码',
clearable: true,
},
},
{
label: '电子邮箱',
prop: 'email',
component: 'el-input',
colProps: {
span: 24
},
props: {
placeholder: '请输入电子邮箱',
clearable: true,
},
},
]
})
const search = (val) => {
let obj = {...val}
if (obj.dateValue) {
obj.startTime = obj.dateValue[0]
obj.endTime = obj.dateValue[1]
delete obj.dateValue
}
tableConfig.params = obj
tableIns.value.refresh()
}
const headBtnClick = (key) => {
switch (key) {
case 'add':
handleAdd()
break;
} }
];
//获取部门数据
const getDepartmentList = async () => {
let params = {
...queryDept
};
//获取部门信息
getDeptList(params).then(res => {
if (res.code === 1000) {
deptList.value = res.data;
} else {
ElMessage.error(res.msg);
}
});
};
//获取用户数据
const getList = async () => {
let params = {
...queryParams,
...pageInfo
};
const date = dateValue.value
if (date !== undefined && date !== null) {
params.startTime = date[0]
params.endTime = date[1]
}
loading.value = true
getUserList(params).then(res => {
if (res.code === 1000) {
list.value = res.data.rows;
total.value = res.data.total;
loading.value = false;
} else {
ElMessage.error(res.msg);
}
});
};
const getRole = () => {
getRoleOption().then(res => {
if (res.code === 1000) {
roleList.value = res.data;
}
});
};
const getPost= async () => {
getSelectOption().then(res => {
if (res.code === 1000) {
postList.value = res.data;
}
})
} }
//搜索部门
const handleSearchDept = () => {
getDepartmentList();
};
//点击部门节点筛选数据
const handle = (node) => {
queryParams.deptId = node.deptId;
getList();
};
//用户搜索重置
const handleReset = () => {
dateValue.value = [];
userForm.value.resetFields();
getList();
};
const restForm = () => {
form.value = {
roleList: [],
postList: [],
userName: null,
nickName: null,
deptId: null,
phoneNumber: null,
email: null,
password: null,
sex: null,
state: "1",
postIds: [],
roleIds: [],
remark: null,
};
};
//新增用户 //新增用户
const handleAdd = () => { const handleAdd = () => {
rules.password[0].required = true // showAddOrEditUserDialog.value = true
restForm(); // formRules.value.password[0].required = true
getRole(); // restForm();
getPost() // title.value = "新增用户";
title.value = "新增用户"; // nextTick(()=>{
isVisited.value = true; // // 清空校验
nextTick(()=>{ // formDialogRef.value.getFormInstance().clearValidate()
// 清空校验 // formDialogRef.value.getFormInstance().resetFields()
formInstance.value.clearValidate() // })
})
}; };
//修改用户
const handleEdit = (userId) => {
restForm();
getRole();
getPost()
//查看详情
getUserDetail(userId).then(res => {
if (res.code === 1000) {
rules.password[0].required = false
form.value = res.data.user;
form.value.roleIds = res.data.roleIds;
form.value.postIds = res.data.postIds;
form.value.roleList = res.data.roleList;
form.value.postList = res.data.postList;
title.value = "修改用户";
isVisited.value = true;
nextTick(()=>{
// 清空校验
formInstance.value.clearValidate()
})
}
});
};
//删除功能
const handleDelete = (userId) => {
// ElMessageBox.confirm(`确认删除用户名称为${row.userName}的数据吗?`, "系统提示", {
// confirmButtonText: "确定",
// cancelButtonText: "取消",
// type: "warning"
// }).then(() => {
deleteUser(userId).then(res => {
if (res.code === 1000) {
ElMessage.success(res.msg);
getList();
} else {
ElMessage.error(res.msg);
}
});
// });
};
//取消 //取消
const handleCancel = () => { const handleCancel = () => {
restForm(); // restForm();
isVisited.value = false; showAddOrEditUserDialog.value = false;
}; };
//提交 //提交
const handleSubmit = async (formInstance) => { const handleSubmit = async (formInstance) => {
if (!formInstance) return; if (!formInstance) return;
formInstance.validate(async (valid) => { formInstance.validate(async (valid) => {
if (!valid) return; if (!valid) return;
if (title.value === "新增用户") { if (title.value === "新增用户") {
addUser(form.value).then(res => { addUser(userForm.value).then(res => {
if (res.code === 1000) { if (res.code === 1000) {
ElMessage.success(res.msg); ElMessage.success(res.msg);
getList();
isVisited.value = false;
} else {
ElMessage.error(res.msg);
}
});
} else {
editUser(form.value).then(res => {
if (res.code === 1000) {
ElMessage.success(res.msg);
getList();
isVisited.value = false; isVisited.value = false;
} else { } else {
ElMessage.error(res.msg); ElMessage.error(res.msg);
@@ -525,17 +212,22 @@ const handleSubmit = async (formInstance) => {
}) })
} }
//切换每页显示条数 const userForm = ref({});
const handleSizeChange = (val) => { const formInstance = ref();
pageInfo.pageSize = val; const isVisited = ref(false);
getList(); const title = ref("");
}; // const restForm = () => {
// userForm.value = {
// userName: null,
// nickName: null,
// phoneNumber: null,
// email: null,
// password: null,
// sex: null,
// state: "1",
// };
// };
//点击页码进行分页功能
const handleCurrentChange = (val) => {
pageInfo.pageNum = val;
getList();
};
getDepartmentList();
getList();
</script> </script>

19
src/views/task-management/all-work-order/index.vue
View File

@@ -6,13 +6,12 @@
</template> </template>
<script setup lang="jsx"> <script setup lang="jsx">
import { isShallow, reactive, shallowRef } from 'vue'; import { reactive, shallowRef } from 'vue';
import fvSelect from '@/fvcomponents/fvSelect/index.vue' import fvSelect from '@/fvcomponents/fvSelect/index.vue'
import WorkDialog from '../components/WorkDialog.vue'; import WorkDialog from '../components/WorkDialog.vue';
import { orderdDetele, orderdClose, orderAdd } from "@/api/order/order.js" import { orderdDetele, orderdClose, orderAdd } from "@/api/order/order.js"
const rowData = ref() const rowData = ref()
const isShow = ref(false)
const workDialogRef = ref() const workDialogRef = ref()
const router = useRouter() const router = useRouter()
const tableIns = ref() const tableIns = ref()
@@ -36,7 +35,7 @@ const auths = reactive({
const searchConfig = reactive([ const searchConfig = reactive([
{ {
label: '工单号', label: '工单号',
prop: 'requirementName', prop: 'orderNumber',
props: { props: {
placeholder: '请输入工单号查询', placeholder: '请输入工单号查询',
clearable: true, clearable: true,
@@ -45,7 +44,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '工单名称', label: '工单名称',
prop: 'requirementName', prop: 'orderName',
props: { props: {
placeholder: '请输入工单名查询', placeholder: '请输入工单名查询',
clearable: true, clearable: true,
@@ -54,7 +53,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '工单状态', label: '工单状态',
prop: 'requirementName', prop: 'orderState',
props: { props: {
placeholder: '请选择工单状态查询', placeholder: '请选择工单状态查询',
cacheKey: 'work_order_status', cacheKey: 'work_order_status',
@@ -64,7 +63,7 @@ const searchConfig = reactive([
component: shallowRef(fvSelect), component: shallowRef(fvSelect),
}, { }, {
label: '处理人', label: '处理人',
prop: 'requirementName', prop: 'operationUser',
props: { props: {
placeholder: '请输入处理人查询', placeholder: '请输入处理人查询',
clearable: true, clearable: true,
@@ -73,7 +72,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '关单人', label: '关单人',
prop: 'requirementName', prop: 'knotter',
props: { props: {
placeholder: '请输入关单人查询', placeholder: '请输入关单人查询',
clearable: true, clearable: true,
@@ -83,7 +82,7 @@ const searchConfig = reactive([
}, },
{ {
label: '创建日期', label: '创建日期',
prop: 'requirementDate', prop: 'createTime',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,
@@ -92,7 +91,7 @@ const searchConfig = reactive([
component: 'el-date-picker', component: 'el-date-picker',
}, { }, {
label: '处理时间', label: '处理时间',
prop: 'requirementDate', prop: 'te',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,
@@ -101,7 +100,7 @@ const searchConfig = reactive([
component: 'el-date-picker', component: 'el-date-picker',
}, { }, {
label: '完成时间', label: '完成时间',
prop: 'requirementDate', prop: 'completionTime',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,

67
src/views/task-management/components/WorkDialog.vue
View File

@@ -1,5 +1,5 @@
<script setup> <script setup>
import { onMounted, reactive, ref, watch } from "vue"; import { nextTick, onMounted, reactive, ref, watch } from "vue";
import { ElMessageBox } from "element-plus"; import { ElMessageBox } from "element-plus";
import { MoreFilled } from "@element-plus/icons-vue"; import { MoreFilled } from "@element-plus/icons-vue";
import { time } from "echarts"; import { time } from "echarts";
@@ -13,8 +13,8 @@ const dialogVisible = ref(false);
const props = defineProps({ const props = defineProps({
rowData: Object rowData: Object
}) })
let dataDetails = {}; let dataDetails = ref();
let opsCallList = {}; let opsCallList = ref([]);
const open = (row) => { const open = (row) => {
dialogVisible.value = true; dialogVisible.value = true;
}; };
@@ -31,18 +31,17 @@ const getData = async () => {
watch(() => props.rowData, (newRowData) => { watch(() => props.rowData, (newRowData) => {
if (newRowData) { if (newRowData) {
// console.log(getData(newRowData)); // console.log(getData(newRowData));
getData(newRowData).then((data) => { getData(newRowData).then((data) => {
// console.log(data.data); // console.log(data.data);
dataDetails = data.data dataDetails = data.data.opsCallList
console.log(dataDetails.value); // console.log(dataDetails);
opsCallList = dataDetails.opsCallList // opsCallList = dataDetails.opsCallList
console.log(opsCallList); dataDetails.forEach(item => {
// console.log(item);
opsCallList.value.push(item)
});
// console.log(opsCallList);
}) })
} }
}, { }, {
immediate: true // 立即执行一次，以便在rowData初始值非空时也能触发 immediate: true // 立即执行一次，以便在rowData初始值非空时也能触发
@@ -108,8 +107,7 @@ defineExpose({
</script> </script>
<template> <template>
<el-dialog v-model="dialogVisible" show-close="true" title="工单详情" width="80%" :before-close="handleClose" overflow: <el-dialog v-model="dialogVisible" :show-close=true title="工单详情" width="80%" overflow: auto>
auto>
<div class="common-layout"> <div class="common-layout">
<el-container> <el-container>
<el-header class="header"><span>工单号：</span> <el-header class="header"><span>工单号：</span>
@@ -122,7 +120,7 @@ defineExpose({
<el-timeline-item v-for="(activity, index) in test" :key="index" :icon="activity.icon" <el-timeline-item v-for="(activity, index) in test" :key="index" :icon="activity.icon"
:type="activity.type" :color="activity.color" :size="activity.size" :type="activity.type" :color="activity.color" :size="activity.size"
:hollow="activity.hollow" :timestamp="activity.timestamp"> :hollow="activity.hollow" :timestamp="activity.timestamp">
<p style="font-size: 17px;"> {{ activity.content }}</p> <p style="font-size: 17px;"> {{ activity.content }}</p>
</el-timeline-item> </el-timeline-item>
</el-timeline> </el-timeline>
</div> </div>
@@ -141,17 +139,28 @@ defineExpose({
<div class="body"> <div class="body">
<div> <div>
<div>工单内容：</div> <div>工单内容：</div>
<div class="text">{{ rowData.orderContent }}</div> <div class="textBox">
<el-scrollbar >
<div class="text">{{ rowData.orderContent }}</div>
</el-scrollbar>
</div>
</div> </div>
<div> <div>
<div>处理内容：</div> <div>处理内容：</div>
<div class="text">{{ rowData.processedContent }}</div> <div class="textBox">
<el-scrollbar >
<div class="text">{{ rowData.processedContent }}</div>
</el-scrollbar>
</div>
</div> </div>
<div> <div>
<div>录音信息：</div> <div>录音信息：</div>
<div class="text">{{ rowData.recordUrl }}</div> <div class="textBox">
<el-scrollbar >
<div class="text">{{ rowData.recordUrl }}</div>
</el-scrollbar>
</div>
</div> </div>
</div> </div>
@@ -228,13 +237,25 @@ defineExpose({
color: black color: black
} }
.main-content .body .text { .main-content .body .textBox {
width: 100%; width: 100%;
height: 10vh; min-height: 10vh;
max-height: 15vh;
border: 1.5px solid #e4e7ed; border: 1.5px solid #e4e7ed;
resize: none;
margin-bottom: 20px;
box-shadow: 0 4px 8px 0 rgba(242, 242, 242, 1); box-shadow: 0 4px 8px 0 rgba(242, 242, 242, 1);
margin-bottom: 20px;
padding: 15px;
}
.main-content .body .text {
resize: none;
// overflow-y: auto;
font-size: 16px;
line-height: 25px
} }
.main-content .footer { .main-content .footer {

16
src/views/task-management/historical-work-order/index.vue
View File

@@ -36,7 +36,7 @@ const auths = reactive({
const searchConfig = reactive([ const searchConfig = reactive([
{ {
label: '工单号', label: '工单号',
prop: 'requirementName', prop: 'orderNumber',
props: { props: {
placeholder: '请输入工单号查询', placeholder: '请输入工单号查询',
clearable: true, clearable: true,
@@ -45,7 +45,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '工单名称', label: '工单名称',
prop: 'requirementName', prop: 'orderName',
props: { props: {
placeholder: '请输入工单名查询', placeholder: '请输入工单名查询',
clearable: true, clearable: true,
@@ -54,7 +54,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '工单状态', label: '工单状态',
prop: 'requirementName', prop: 'orderState',
props: { props: {
placeholder: '请选择工单状态查询', placeholder: '请选择工单状态查询',
cacheKey: 'work_order_status', cacheKey: 'work_order_status',
@@ -64,7 +64,7 @@ const searchConfig = reactive([
component: shallowRef(fvSelect), component: shallowRef(fvSelect),
}, { }, {
label: '处理人', label: '处理人',
prop: 'requirementName', prop: 'operationUser',
props: { props: {
placeholder: '请输入处理人查询', placeholder: '请输入处理人查询',
clearable: true, clearable: true,
@@ -73,7 +73,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '关单人', label: '关单人',
prop: 'requirementName', prop: 'knotter',
props: { props: {
placeholder: '请输入关单人查询', placeholder: '请输入关单人查询',
clearable: true, clearable: true,
@@ -83,7 +83,7 @@ const searchConfig = reactive([
}, },
{ {
label: '创建日期', label: '创建日期',
prop: 'requirementDate', prop: 'createTime',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,
@@ -92,7 +92,7 @@ const searchConfig = reactive([
component: 'el-date-picker', component: 'el-date-picker',
}, { }, {
label: '处理时间', label: '处理时间',
prop: 'requirementDate', prop: 'te',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,
@@ -101,7 +101,7 @@ const searchConfig = reactive([
component: 'el-date-picker', component: 'el-date-picker',
}, { }, {
label: '完成时间', label: '完成时间',
prop: 'requirementDate', prop: 'completionTime',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,

16
src/views/task-management/pending-work-order/index.vue
View File

@@ -36,7 +36,7 @@ const auths = reactive({
const searchConfig = reactive([ const searchConfig = reactive([
{ {
label: '工单号', label: '工单号',
prop: 'requirementName', prop: 'orderNumber',
props: { props: {
placeholder: '请输入工单号查询', placeholder: '请输入工单号查询',
clearable: true, clearable: true,
@@ -45,7 +45,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '工单名称', label: '工单名称',
prop: 'requirementName', prop: 'orderName',
props: { props: {
placeholder: '请输入工单名查询', placeholder: '请输入工单名查询',
clearable: true, clearable: true,
@@ -54,7 +54,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '工单状态', label: '工单状态',
prop: 'requirementName', prop: 'orderState',
props: { props: {
placeholder: '请选择工单状态查询', placeholder: '请选择工单状态查询',
cacheKey: 'work_order_status', cacheKey: 'work_order_status',
@@ -64,7 +64,7 @@ const searchConfig = reactive([
component: shallowRef(fvSelect), component: shallowRef(fvSelect),
}, { }, {
label: '处理人', label: '处理人',
prop: 'requirementName', prop: 'operationUser',
props: { props: {
placeholder: '请输入处理人查询', placeholder: '请输入处理人查询',
clearable: true, clearable: true,
@@ -73,7 +73,7 @@ const searchConfig = reactive([
component: 'el-input', component: 'el-input',
}, { }, {
label: '关单人', label: '关单人',
prop: 'requirementName', prop: 'knotter',
props: { props: {
placeholder: '请输入关单人查询', placeholder: '请输入关单人查询',
clearable: true, clearable: true,
@@ -83,7 +83,7 @@ const searchConfig = reactive([
}, },
{ {
label: '创建日期', label: '创建日期',
prop: 'requirementDate', prop: 'createTime',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,
@@ -92,7 +92,7 @@ const searchConfig = reactive([
component: 'el-date-picker', component: 'el-date-picker',
}, { }, {
label: '处理时间', label: '处理时间',
prop: 'requirementDate', prop: 'te',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,
@@ -101,7 +101,7 @@ const searchConfig = reactive([
component: 'el-date-picker', component: 'el-date-picker',
}, { }, {
label: '完成时间', label: '完成时间',
prop: 'requirementDate', prop: 'completionTime',
props: { props: {
placeholder: '请选择', placeholder: '请选择',
clearable: true, clearable: true,