|
@@ -4,7 +4,7 @@
|
|
|
<el-tabs v-model="state.activeName" @tab-change="handleClick">
|
|
|
<el-tab-pane label="呼入列表" name="incoming"></el-tab-pane>
|
|
|
<el-tab-pane label="呼出列表" name="exhale"></el-tab-pane>
|
|
|
- <el-tab-pane label="未接列表" name="missed" v-auth="'200101'"></el-tab-pane>
|
|
|
+ <el-tab-pane label="未接列表" name="missed" v-auth="'tels:callRecord:missed'"></el-tab-pane>
|
|
|
<el-form :model="state.queryParams" ref="ruleFormRef" :inline="true" @submit.native.prevent class="mt15">
|
|
|
<el-form-item label="呼叫方向" prop="Direction" v-if="state.activeName === 'missed'">
|
|
|
<el-select v-model="state.queryParams.Direction" placeholder="请选择呼叫方向" class="w100">
|
|
@@ -17,16 +17,16 @@
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="被叫号码" prop="PhoneNum">
|
|
|
- <el-input v-model="state.queryParams.PhoneNum" placeholder="请输入被叫号码" clearable @keyup.enter="getList" />
|
|
|
+ <el-input v-model="state.queryParams.PhoneNum" placeholder="请输入被叫号码" clearable @keyup.enter="queryList" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="主叫号码" prop="ToNum">
|
|
|
- <el-input v-model="state.queryParams.ToNum" placeholder="请输入主叫号码" clearable @keyup.enter="getList" />
|
|
|
+ <el-input v-model="state.queryParams.ToNum" placeholder="请输入主叫号码" clearable @keyup.enter="queryList" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="坐席" prop="UserName">
|
|
|
- <el-input v-model="state.queryParams.UserName" placeholder="请输入坐席姓名或工号" clearable @keyup.enter="getList" />
|
|
|
+ <el-input v-model="state.queryParams.UserName" placeholder="请输入坐席姓名或工号" clearable @keyup.enter="queryList" />
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button type="primary" @click="getList" :loading="state.loading" v-waves> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
|
|
|
+ <el-button type="primary" @click="queryList" :loading="state.loading" v-waves> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
|
|
|
<el-button @click="resetQuery(ruleFormRef)" v-waves class="default-button"> <SvgIcon name="ele-Refresh" class="mr5" />重置 </el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
@@ -125,7 +125,7 @@
|
|
|
</template>
|
|
|
</el-table>
|
|
|
<!-- 分页 -->
|
|
|
- <pagination :total="state.total" v-model:page="state.queryParams.PageIndex" v-model:limit="state.queryParams.PageSize" @pagination="getList" />
|
|
|
+ <pagination :total="state.total" v-model:page="state.queryParams.PageIndex" v-model:limit="state.queryParams.PageSize" @pagination="queryList" />
|
|
|
</el-card>
|
|
|
<PlayRecording ref="playRecordingRef" />
|
|
|
</div>
|
|
@@ -134,6 +134,8 @@
|
|
|
<script lang="ts" setup name="callRecord">
|
|
|
import { ref, reactive, onMounted, defineAsyncComponent } from 'vue';
|
|
|
import type { FormInstance } from 'element-plus';
|
|
|
+import { ElMessage } from 'element-plus';
|
|
|
+import { auth } from '/@/utils/authFunction';
|
|
|
// 引入节流
|
|
|
import { throttle } from '/@/utils/tools';
|
|
|
import { callPaged, callPagedMissed } from '/@/api/tels/callRecord';
|
|
@@ -206,57 +208,60 @@ const state = reactive(<QueryState>{
|
|
|
});
|
|
|
const ruleFormRef = ref<FormInstance>();
|
|
|
const playRecordingRef = ref();
|
|
|
-/** 获取用户列表 */
|
|
|
-const getList = throttle(() => {
|
|
|
- state.loading = true;
|
|
|
- switch (state.activeName) {
|
|
|
- case 'incoming':
|
|
|
- callPaged(state.queryParams)
|
|
|
- .then((response: any) => {
|
|
|
- state.tableList = response?.result.items ?? [];
|
|
|
- state.total = response?.result.total;
|
|
|
- state.loading = false;
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- state.loading = false;
|
|
|
- });
|
|
|
- break;
|
|
|
- case 'exhale':
|
|
|
- callPaged(state.queryParams)
|
|
|
- .then((response: any) => {
|
|
|
- state.tableList = response?.result.items ?? [];
|
|
|
- state.total = response?.result.total;
|
|
|
- state.loading = false;
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- state.loading = false;
|
|
|
- });
|
|
|
- break;
|
|
|
- case 'missed':
|
|
|
- callPagedMissed(state.queryParams)
|
|
|
- .then((response: any) => {
|
|
|
- state.tableList = response?.result.items ?? [];
|
|
|
- state.total = response?.result.total;
|
|
|
- state.loading = false;
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- state.loading = false;
|
|
|
- });
|
|
|
- break;
|
|
|
+/** 通话记录列表 */
|
|
|
+const queryList = throttle(() => {
|
|
|
+ if (!auth('tels:blackList:query')) ElMessage.error('抱歉,您没有权限查询通话记录!');
|
|
|
+ else {
|
|
|
+ state.loading = true;
|
|
|
+ switch (state.activeName) {
|
|
|
+ case 'incoming':
|
|
|
+ callPaged(state.queryParams)
|
|
|
+ .then((response: any) => {
|
|
|
+ state.tableList = response?.result.items ?? [];
|
|
|
+ state.total = response?.result.total;
|
|
|
+ state.loading = false;
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ state.loading = false;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 'exhale':
|
|
|
+ callPaged(state.queryParams)
|
|
|
+ .then((response: any) => {
|
|
|
+ state.tableList = response?.result.items ?? [];
|
|
|
+ state.total = response?.result.total;
|
|
|
+ state.loading = false;
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ state.loading = false;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 'missed':
|
|
|
+ callPagedMissed(state.queryParams)
|
|
|
+ .then((response: any) => {
|
|
|
+ state.tableList = response?.result.items ?? [];
|
|
|
+ state.total = response?.result.total;
|
|
|
+ state.loading = false;
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ state.loading = false;
|
|
|
+ });
|
|
|
+ break;
|
|
|
|
|
|
- default:
|
|
|
- break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
}
|
|
|
}, 500);
|
|
|
/** 重置按钮操作 */
|
|
|
const resetQuery = throttle((formEl: FormInstance | undefined) => {
|
|
|
if (!formEl) return;
|
|
|
formEl.resetFields();
|
|
|
- getList();
|
|
|
+ queryList();
|
|
|
}, 500);
|
|
|
// 切换tab 查询列表
|
|
|
const handleClick = () => {
|
|
|
- getList();
|
|
|
+ queryList();
|
|
|
};
|
|
|
// 播放录音
|
|
|
const onPalySoundRecording = (val: any) => {
|
|
@@ -267,7 +272,7 @@ const onDownload = (val: any) => {};
|
|
|
// 关联工单
|
|
|
const onRelationWorkOrder = (val: any) => {};
|
|
|
onMounted(() => {
|
|
|
- getList();
|
|
|
+ queryList();
|
|
|
});
|
|
|
</script>
|
|
|
<style lang="scss" scoped></style>
|