新增数据展示页面

This commit is contained in:
雷校云
2026-02-28 21:53:16 +08:00
parent 2646383c10
commit ecba4194a3
9 changed files with 550 additions and 52 deletions

View File

@@ -0,0 +1,13 @@
import request from '@/utils/request'
/*
* 联系方式
* */
// 查询所有联系记录(含电话、微信号)
export const ApiContacts = (page: number, page_size: number) => {
return request({
url: `/api/contacts?page=${page}&page_size=${page_size}`,
method: 'get'
})
}

View File

@@ -26,7 +26,7 @@ export const ApiTasksAdd = (data: any) => {
formData.append('task_type', data.task_type)
// formData.append('worker_id', data.worker_id)
// formData.append('account_name', data.account_name)
formData.append('boss_id', data.boss_id)
formData.append('id', data.boss_id)
formData.append('params', data.params)
return request({
url: `/api/tasks`,

View File

@@ -16,11 +16,11 @@
<div class="navbar-actions__item">
<Notification />
</div>
<el-tooltip class="box-item" :content="'律所文书'" placement="bottom">
<div class="navbar-actions__item" @click="onLawFirmDocuments">
<el-icon size="18px"><Collection /></el-icon>
</div>
</el-tooltip>
<!-- <el-tooltip class="box-item" :content="'律所文书'" placement="bottom">-->
<!-- <div class="navbar-actions__item" @click="onLawFirmDocuments">-->
<!-- <el-icon size="18px"><Collection /></el-icon>-->
<!-- </div>-->
<!-- </el-tooltip>-->
</template>
<!-- 用户菜单 -->
@@ -57,7 +57,6 @@
<script setup lang="ts">
import { useI18n } from 'vue-i18n'
import { useRoute, useRouter } from 'vue-router'
import { Collection } from '@element-plus/icons-vue'
import { defaultSettings } from '@/settings'
import { DeviceEnum } from '@/enums/settings/device-enum'
import { useAppStore, useSettingsStore, useUserStore } from '@/store'
@@ -136,9 +135,9 @@ function handleSettingsClick() {
settingStore.settingsVisible = true
}
const onLawFirmDocuments = () => {
router.push({ name: 'LawFirmStandardDocuments' })
}
// const onLawFirmDocuments = () => {
// router.push({ name: 'LawFirmStandardDocuments' })
// }
</script>
<style lang="scss" scoped>

View File

@@ -268,7 +268,6 @@ export const constantRoutes: RouteRecordRaw[] = [
// }
// ]
// },
// 申请用印
{
path: '/boos',
name: 'Boos',
@@ -288,23 +287,40 @@ export const constantRoutes: RouteRecordRaw[] = [
}
]
},
// 入库登记
// {
// path: '/task',
// name: 'Task',
// component: Layout,
// meta: {
// title: '任务管理',
// icon: 'setting'
// },
// children: [
// {
// path: 'taskManagement',
// name: 'TaskManagement',
// component: () => import('@/views/TaskManagement/index.vue'),
// meta: {
// title: '任务管理'
// }
// }
// ]
// },
{
path: '/task',
name: 'Task',
path: '/contact',
name: 'Contact',
component: Layout,
meta: {
title: '任务管理',
title: '联系方式',
icon: 'setting'
},
children: [
{
path: 'taskManagement',
name: 'TaskManagement',
component: () => import('@/views/TaskManagement/index.vue'),
path: 'contactInformation',
name: 'ContactInformation',
component: () => import('@/views/ContactInformation/index.vue'),
meta: {
title: '任务管理'
title: '联系方式'
}
}
]

View File

@@ -186,6 +186,37 @@ export function deepCloneByJSON(obj: any) {
}
}
/**
* 将 ISO 8601 时间格式转换为年月日时分秒格式
* @param isoString ISO 8601 格式的时间字符串,如 "2026-02-28T14:10:51.966269"
* @returns 格式化后的时间字符串,如 "2026-02-28 14:10:51"
*/
export function formatISOToDateTime(isoString: string): string {
if (!isoString) return ''
try {
const date = new Date(isoString)
// 检查日期是否有效
if (isNaN(date.getTime())) {
console.warn('无效的日期格式:', isoString)
return isoString
}
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, '0')
const day = String(date.getDate()).padStart(2, '0')
const hours = String(date.getHours()).padStart(2, '0')
const minutes = String(date.getMinutes()).padStart(2, '0')
const seconds = String(date.getSeconds()).padStart(2, '0')
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
} catch (error) {
console.error('日期格式化错误:', error)
return isoString
}
}
export function isString(value: any): boolean {
return typeof value === 'string'
}

View File

@@ -53,19 +53,72 @@
>
<el-table-column label="环境名称" prop="browser_name" />
<el-table-column label="电脑标识" prop="worker_id" />
<el-table-column label="状态" prop="state" />
<el-table-column label="时间" prop="times" />
<el-table-column label="浏览器环境名称" prop="browser_name" />
<el-table-column label="登录昵称" prop="boss_username" />
<el-table-column label="电脑名称" prop="worker_name">
<template #default="scope">
<span v-if="scope.row.worker_name">
{{ scope.row.worker_name }}
</span>
<span v-else>--</span>
</template>
</el-table-column>
<el-table-column label="否已登录 BOSS" prop="is_logged_in">
<template #default="scope">
<el-tag v-if="scope.row.worker_online" type="success">
{{ '在线' }}
</el-tag>
<el-tag v-else type="danger">
{{ '离线' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="任务状态" prop="current_task_status">
<template #default="scope">
<el-tag v-if="scope.row.current_task_status === 'dispatched'" type="primary">
{{ '已派发' }}
</el-tag>
<el-tag v-else-if="scope.row.current_task_status === 'running'" type="info">
{{ '执行中' }}
</el-tag>
<el-tag
v-else-if="
scope.row.current_task_status === 'success' ||
scope.row.current_task_status === 'failed'
"
type="success"
>
{{ '结束' }}
</el-tag>
<span v-else>--</span>
</template>
</el-table-column>
<el-table-column label="Worker 是否在线" prop="worker_online">
<template #default="scope">
<el-tag v-if="scope.row.worker_online" type="success">
{{ '在线' }}
</el-tag>
<el-tag v-else type="danger">
{{ '离线' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="更新时间" prop="updated_at">
<template #default="scope">
{{ formatISOToDateTime(scope.row?.updated_at || '') }}
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="250">
<template #default="scope">
<el-button
type="primary"
size="small"
link
icon="edit"
@click="onDetails(scope.row.id)"
>
详情
</el-button>
<!-- <el-button-->
<!-- type="primary"-->
<!-- size="small"-->
<!-- link-->
<!-- icon="edit"-->
<!-- @click="onDetails(scope.row.id)"-->
<!-- >-->
<!-- 详情-->
<!-- </el-button>-->
<el-button
type="primary"
size="small"
@@ -104,15 +157,11 @@ import { RolePageVO } from '@/api/system/role-api'
import { functionDialogBox } from '@/utils/functionDialogBox'
import BoosAccountForm from './components/BoosAccountForm.vue'
import { BusinessEditApplication } from '@/api/calibration/applicationForSealApproval'
import {
ApiAccounts,
ApiAccountsAdd,
ApiAccountsDelete,
ApiAccountsId
} from '@/api/BoosAccountManagement'
import BoosAccountDetails from './components/BoosAccountDetails.vue'
import { ApiAccounts, ApiAccountsAdd, ApiAccountsDelete } from '@/api/BoosAccountManagement'
// import BoosAccountDetails from './components/BoosAccountDetails.vue'
import { ApiTasksAdd } from '@/api/TaskManagement'
import TaskForm from '@/views/TaskManagement/components/TaskForm.vue'
import { formatISOToDateTime } from '@/utils/auxiliaryFunction'
defineOptions({
name: 'Role',
@@ -247,20 +296,20 @@ const onUserDeleteDepartment = (id: string) => {
)
}
const onDetails = (id: string) => {
ApiAccountsId(id).then((res: any) => {
functionDialogBox(
BoosAccountDetails,
{
newData: res.data
},
{
title: '详情',
width: '900'
}
)
})
}
// const onDetails = (id: string) => {
// ApiAccountsId(id).then((res: any) => {
// functionDialogBox(
// BoosAccountDetails,
// {
// newData: res.data
// },
// {
// title: '详情',
// width: '900'
// }
// )
// })
// }
const onApiTasksAdd = (id: string) => {
functionDialogBox(

View File

@@ -0,0 +1,7 @@
<template>
<div>TaskDetails</div>
</template>
<script setup lang="ts"></script>
<style scoped lang="scss"></style>

View File

@@ -0,0 +1,110 @@
<template>
<div class="pre-registration-form">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="auto"
label-position="top"
>
<el-form-item label="任务类型" prop="task_type">
<!-- <el-input v-model="formData.task_type" placeholder="请输入" />-->
<el-select v-model="formData.task_type" placeholder="请选择">
<el-option label="检查登录" value="check_login" />
<el-option label="招聘" value="boss_recruit" />
</el-select>
</el-form-item>
<el-form-item label="任务参数" prop="params">
<el-input v-model="formData.params" placeholder="请输入" />
</el-form-item>
</el-form>
</div>
</template>
<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import { deepCloneByJSON } from '@/utils/auxiliaryFunction'
const props = defineProps({
newData: {
type: Object,
default: () => ({})
}
})
const formRef = ref()
// 表单数据
const formData = reactive<any>({
task_type: '',
worker_id: '',
account_name: '',
params: ''
})
const formRules = reactive<any>({
task_type: [{ required: true, message: '请输入', trigger: 'blur' }],
params: [{ required: true, message: '请输入', trigger: 'blur' }]
})
onMounted(() => {
setFormData(props.newData)
})
const getForm = () => {
return formData
}
const setFormData = (data: any) => {
if (data && Object.keys(data).length > 0) {
const data1 = deepCloneByJSON(data)
Object.assign(formData, data1)
}
}
const submit = (): Promise<boolean> => {
return new Promise((resolve, reject) => {
formRef.value?.validate((valid: boolean) => {
if (valid) {
resolve(true)
} else {
ElMessage.error('请完善必填信息')
reject(false)
}
})
})
}
defineExpose({
submit,
getForm
})
</script>
<style scoped lang="scss">
.pre-registration-form {
width: 100%;
padding-right: 20px;
overflow: hidden;
overflow-y: auto;
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
&::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.3);
border-radius: 3px;
}
&::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.5);
}
}
.section {
display: flex;
flex-direction: column;
gap: 20px;
}
</style>

View File

@@ -0,0 +1,273 @@
<template>
<div class="app-container">
<!-- 搜索区域 -->
<!-- <div class="search-container">-->
<!-- <el-form ref="queryFormRef" :model="queryParams" :inline="true">-->
<!-- <el-form-item prop="seal_type" label="用印用途">-->
<!-- <el-input-->
<!-- v-model="queryParams.seal_type"-->
<!-- placeholder="请输入"-->
<!-- clearable-->
<!-- @keyup.enter="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item prop="CaseNumber" label="合同编号">-->
<!-- <el-input-->
<!-- v-model="queryParams.CaseNumber"-->
<!-- placeholder="请输入"-->
<!-- clearable-->
<!-- @keyup.enter="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="创建时间" prop="times">-->
<!-- <el-date-picker-->
<!-- v-model="queryParams.times"-->
<!-- type="daterange"-->
<!-- value-format="YYYY-MM-DD"-->
<!-- placeholder="请选择创建时间"-->
<!-- range-separator="至"-->
<!-- start-placeholder="开始时间"-->
<!-- end-placeholder="结束时间"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item class="search-buttons">-->
<!-- <el-button type="primary" icon="search" @click="handleQuery">搜索</el-button>-->
<!-- <el-button icon="refresh" @click="handleResetQuery">重置</el-button>-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- </div>-->
<el-card shadow="hover" class="data-table">
<!-- <div class="data-table__toolbar">-->
<!-- <div class="data-table__toolbar&#45;&#45;actions">-->
<!-- <el-button type="success" icon="plus" @click="handleOpenDialog()">新增</el-button>-->
<!-- </div>-->
<!-- </div>-->
<el-table
ref="dataTableRef"
v-loading="loading"
:data="roleList"
highlight-current-row
border
class="data-table__content"
@selection-change="handleSelectionChange"
>
<el-table-column label="候选人姓名" prop="name" />
<el-table-column label="应聘岗位" prop="position" />
<el-table-column label="联系方式(电话号或微信号)" prop="contact" />
<el-table-column label="回复状态" prop="reply_status">
<template #default="scope">
<el-tag v-if="scope.row.reply_status === '已回复'" type="success">
{{ scope.row.reply_status }}
</el-tag>
<el-tag v-else type="danger">
{{ scope.row.reply_status }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="微信交换" prop="wechat_exchanged">
<template #default="scope">
<el-tag v-if="scope.row.wechat_exchanged" type="success">
{{ '已交换' }}
</el-tag>
<el-tag v-else type="danger">
{{ '未交换' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="备注信息" prop="notes" />
<el-table-column label="联系时间" prop="contacted_at">
<template #default="scope">
{{ formatISOToDateTime(scope.row?.contacted_at || '') }}
</template>
</el-table-column>
<!-- <el-table-column fixed="right" label="操作" width="140">-->
<!-- <template #default="scope">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- size="small"-->
<!-- link-->
<!-- icon="edit"-->
<!-- @click="onDetails(scope.row.task_id)"-->
<!-- >-->
<!-- 详情-->
<!-- </el-button>-->
<!-- &lt;!&ndash; <el-button&ndash;&gt;-->
<!-- &lt;!&ndash; type="danger"&ndash;&gt;-->
<!-- &lt;!&ndash; size="small"&ndash;&gt;-->
<!-- &lt;!&ndash; link&ndash;&gt;-->
<!-- &lt;!&ndash; icon="delete"&ndash;&gt;-->
<!-- &lt;!&ndash; @click="onUserDeleteDepartment(scope.row.id)"&ndash;&gt;-->
<!-- &lt;!&ndash; >&ndash;&gt;-->
<!-- &lt;!&ndash; 删除&ndash;&gt;-->
<!-- &lt;!&ndash; </el-button>&ndash;&gt;-->
<!-- </template>-->
<!-- </el-table-column>-->
</el-table>
<pagination
v-if="total > 0"
v-model:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="fetchData"
/>
</el-card>
</div>
</template>
<script setup lang="ts">
import { ApiContacts } from '@/api/ContactInformation'
import { formatISOToDateTime } from '@/utils/auxiliaryFunction'
defineOptions({
name: 'Role',
inheritAttrs: false
})
// const queryFormRef = ref()
const loading = ref(false)
const ids = ref<number[]>([])
const total = ref(0)
const queryParams = reactive<any>({
pageNum: 1,
pageSize: 10,
times: [],
seal_type: '',
CaseNumber: ''
})
// 表格数据
const roleList = ref<any[]>()
// // 弹窗
// const dialog = reactive({
// title: '',
// visible: false
// })
// 获取数据
function fetchData() {
loading.value = true
ApiContacts(queryParams.pageNum, queryParams.pageSize)
.then((res: any) => {
roleList.value = res.data.results
total.value = res.data.total
})
.finally(() => {
loading.value = false
})
}
// 查询(重置页码后获取数据)
function handleQuery() {
queryParams.pageNum = 1
fetchData()
}
// // 重置查询
// function handleResetQuery() {
// if (queryFormRef.value) queryFormRef.value?.resetFields()
// queryParams.pageNum = 1
// fetchData()
// }
// 行复选框选中
function handleSelectionChange(selection: any) {
ids.value = selection.map((item: any) => item.id)
}
// // 打开角色弹窗
// function handleOpenDialog(data: any = null) {
// dialog.visible = true
// if (data) {
// functionDialogBox(
// TaskForm,
// {
// newData: data
// },
// {
// title: '编辑申请用印',
// width: '900',
// ok(value: any) {
// handleSubmit({ id: data.id, ...value })
// }
// }
// )
// } else {
// functionDialogBox(
// TaskForm,
// {},
// {
// title: '提交新任务',
// width: '900',
// ok(value: any) {
// handleSubmit(value)
// }
// }
// )
// }
// }
// // 提交角色表单
// function handleSubmit(data: any) {
// loading.value = true
// const roleId = data.id
// if (roleId) {
// BusinessEditApplication(data)
// .then(() => {
// ElMessage.success('修改成功')
// handleResetQuery()
// })
// .finally(() => (loading.value = false))
// } else {
// ApiTasksAdd(data)
// .then(() => {
// ElMessage.success('新增成功')
// handleResetQuery()
// })
// .finally(() => (loading.value = false))
// }
// }
// const onUserDeleteDepartment = (id: string) => {
// ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning'
// }).then(
// () => {
// loading.value = true
// BusinessDeleteApplication(id)
// .then(() => {
// ElMessage.success('删除成功')
// handleResetQuery()
// })
// .finally(() => (loading.value = false))
// },
// () => {
// ElMessage.info('已取消删除')
// }
// )
// }
// const onDetails = (task_id: string) => {
// ApiTasksTaskId(task_id).then((res: any) => {
// functionDialogBox(
// TaskDetails,
// {
// newData: res.data
// },
// {
// title: '详情',
// width: '900'
// }
// )
// })
// }
onMounted(() => {
handleQuery()
})
</script>