Skip to content

D
data-collect
Commit 5d00424c by cwy
Options

0402

parent c349df84
Showing with 1170 additions and 3 deletions
src/layout/navBars/tagsView/tagsView.vue
...@@ -531,7 +531,7 @@ onBeforeMount(() => { ...@@ -531,7 +531,7 @@ onBeforeMount(() => {
// 监听布局配置开启 TagsView 共用，为了演示还原默认值 // 监听布局配置开启 TagsView 共用，为了演示还原默认值
mittBus.on('openShareTagsView', () => { mittBus.on('openShareTagsView', () => {
if (getThemeConfig.value.isShareTagsView) { if (getThemeConfig.value.isShareTagsView) {
router.push('/home'); router.push('/claimTasks');
state.tagsViewList = []; state.tagsViewList = [];
state.tagsViewRoutesList.map((v) => { state.tagsViewRoutesList.map((v) => {
if (v.meta?.isAffix && !v.meta.isHide) { if (v.meta?.isAffix && !v.meta.isHide) {
......
src/router/index.js
...@@ -103,7 +103,7 @@ router.beforeEach(async (to, from, next) => { ...@@ -103,7 +103,7 @@ router.beforeEach(async (to, from, next) => {
Session.clear(); Session.clear();
NProgress.done(); NProgress.done();
} else if (token && to.path === '/login') { } else if (token && to.path === '/login') {
next('/home'); next('/claimTasks');
NProgress.done(); NProgress.done();
} else { } else {
const storesRoutesList = useRoutesList(pinia); const storesRoutesList = useRoutesList(pinia);
......
src/views/claimTasks/user/approved/details.vue 0 → 100644
<template>
<div class="system-role-dialog-container">
<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="40%" @close="closeDialog" :close-on-click-modal="false">
<el-form ref="dialogFormRef" :model="state.formItem.addItem" :rules="state.rules" size="default" label-width="100px"
v-loading="state.dataLoading" label-position="right" style="width: 90%;text-align: center;">
<el-form-item label="任务名称" prop="task_name">
<el-input v-model="state.formItem.addItem.task_name" placeholder="请输入指标名称" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="指标名称" prop="name">
<el-input v-model="state.formItem.addItem.name" placeholder="请输入指标名称" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="参考信源" prop="refer">
<el-input type="textarea" v-model="state.formItem.addItem.refer" placeholder="请输入参考信源" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="参考指南" prop="guide">
<el-input type="textarea" v-model="state.formItem.addItem.guide" placeholder="请输入参考指南" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="标题" :prop="'dynamicItem.' + index+ '.name'" v-for="(item, index) in state.formItem.dynamicItem" :key="index">
<el-input v-model="item.name" placeholder="请输入标题" clearable style="width: 30%;" :disabled="true"></el-input>
<div style="width: 10%;">内容:</div>
<el-input v-model="item.value" placeholder="请输入标题对应的值" clearable style="width: 60%;" :disabled="true"></el-input>
</el-form-item>
<el-divider><span style="color: #F56C6C;">用户需填写区域</span></el-divider>
<el-form-item label="信源类型" prop="refer_type">
<el-select v-model="state.formItem.addItem.refer_type" placeholder="请选择信源等级" :disabled="true">
<el-option label="官网/政府" value="1"></el-option>
<el-option label="权威媒体" value="2"></el-option>
<el-option label="其他可信信源" value="3"></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="标题" :prop="'userFilled.' + index+ '.name'" v-for="(item, index) in state.formItem.userFilled" :key="index">
<el-input v-model="item.name" placeholder="请输入标题" clearable style="width: 30%;" :disabled="true"></el-input>
<div style="width: 10%;"><span style="color: red;" v-if="item.radio==1">*</span>内容:</div>
<el-input v-model="item.value" placeholder="请填写内容" style="width: 60%;" required :disabled="true"></el-input>
</el-form-item> -->
<el-form-item label="标题" :prop="'userFilled.' + index+ '.name'" v-for="(item, index) in state.formItem.userFilled" :key="index">
<el-row style="width: 100% !important;">
<el-col :span="7">
<el-input v-model="item.name" placeholder="请输入标题" clearabl :disabled="true"></el-input>
</el-col>
<el-col :span="2">
<span style="color: red;" v-if="item.radio==1">*</span>内容:
</el-col>
<el-col :span="13">
<el-input type="textarea" v-model="item.value" placeholder="请填写内容" required :disabled="true"></el-input>
</el-col>
<el-col :span="2">
<span style="color: red;" v-if="item.radio==1">必填</span>
</el-col>
</el-row>
<el-row style="width: 100% !important; margin-left: -8%; margin-top: 10 !important;">
<el-col :span="2">
<div>备注:</div>
</el-col>
<el-col :span="22">
<el-input v-model="item.remark" placeholder="请输入备注(选填)" clearabl :disabled="true"></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="收集备注" prop="remark">
<el-input type="textarea" v-model="state.formItem.addItem.remark" placeholder="请输入备注" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="网页截图">
<div style="border: 1px solid #ccc; width: 100%;">
<Toolbar
style="border-bottom: 1px solid #ccc"
:editor="editorRef"
:defaultConfig="toolbarConfig"
:mode="mode"
/>
<Editor
style="height: 300px; overflow-y: hidden;"
v-model="state.formItem.editorContent"
:defaultConfig="editorConfig"
:mode="mode"
@onCreated="handleCreated"
/>
</div>
</el-form-item>
<el-form-item label="是否可采集:" prop="state.not_collectible">
<template #default="scope">
<span style="color: #F56C6C" v-if="state.not_collectible==1" effect="plain" size="small">{{state.not_collectible_remarks}}</span>
<span style="color: #909399" v-else effect="plain" size="small">是</span>
</template>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="closeDialog()" size="default">取 消</el-button>
<!-- <el-button type="primary" :loading="state.btnLoading" @click="onSubmit(dialogFormRef)"
size="default">确认</el-button> -->
</span>
</template>
</el-dialog>
</div>
</template>
<script setup name="systemRoleDialog">
import '@wangeditor/editor/dist/css/style.css' // 引入 css
import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
import { claimTasksApi } from '/@/api/claimTasks'
import { ElMessage } from 'element-plus';
import { getUploadUrl } from "/@/utils/getHost.js";
import '/@/css/index.css';
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
// 定义变量内容
const dialogFormRef = ref();
const router = useRouter();
const state = reactive({
userId: null,
index:0,
userIndex:0,
apiData: {
id:'',
},
rules: {
refer_type: [{ required: true, message: '请输入选择信源类型', trigger: 'blur' }],
},
dialog: {
isShowDialog: false,
title: '',
submitTxt: '',
},
dataLoading: false,
btnLoading: false,
// 填写内容及自定义文本框
formItem: {
addItem:{
refer_type:'',
id:'',
},
dynamicItem: [
//默认显示一条
// {
// name: '',
// value:''
// }
],
userFilled: [
//默认显示一条
// {
// name: '',
// radio:'1',
// }
],
editorImgList:[], // 富文本里的内容
editorContent:'', // 富文本所有内容
not_collectible:'',
not_collectible_remarks:'',
}
});
// 打开弹窗
const openDialog = (data) => {
state.dialog.isShowDialog = true;
state.dialog.title = '指标详情';
state.apiData.id = data.id;
state.formItem.addItem.norm_receive_id = data.id;
// 清空数据
claimTasksApi().normReceivesDetail(state.apiData).then(res => {
let addItem = res.data.addItem;
let userFilled = res.data.userFilled;
let adminFilled = res.data.adminFilled;
// 数据详情
state.formItem.addItem.task_id = addItem.task_id;
state.formItem.addItem.norm_id = addItem.norm_id;
state.formItem.addItem.norm_list_id = addItem.id;
state.formItem.addItem.name = addItem.name;
state.formItem.addItem.task_name = addItem.task_name;
state.formItem.addItem.refer = addItem.refer;
state.formItem.addItem.guide = addItem.guide;
state.not_collectible_remarks = data.not_collectible_remarks
state.not_collectible = data.not_collectible
//富文本内容相关
if(res.data.normCollectInfo)
{
let normCollectInfo = res.data.normCollectInfo;
state.formItem.addItem.refer_type = normCollectInfo.refer_type;
state.formItem.addItem.remark = normCollectInfo.remark;
if(normCollectInfo.editorContent){
state.formItem.editorContent = normCollectInfo.editorContent
}else{
state.formItem.editorContent = '请输入截图'
}
}
state.userIndex = 0;
state.index = 0;
userFilled.forEach(item => {
state.formItem.userFilled.push({id:item.id,name:item.extend_name,radio:item.required+"",value:item.extend_value,remark:item.extend_remarks,});
state.userIndex++
});
adminFilled.forEach(item => {
state.formItem.dynamicItem.push({id:item.id,name:item.extend_name,value:item.extend_value,});
state.index++
});
}).catch(() => {
})
};
// 关闭弹窗
const closeDialog = () => {
dialogFormRef.value.resetFields();
state.dialog.isShowDialog = false;
};
// 编辑器实例，必须用 shallowRef
const editorRef = shallowRef()
const mode = ref('default')
const toolbarConfig = {}
const editorConfig = {
placeholder: '请输入截图',
MENU_CONF: {}
}
editorConfig.MENU_CONF['uploadImage'] = {
// 其他配置...
// 小于该值就插入 base64 格式（而不上传），默认为 0
base64LimitSize: 5 * 1024, // 5kb
server: getUploadUrl(),
fieldName: 'file',
// 单个文件上传成功之后
onSuccess(file, res) { // JS 语法
console.log(`${file.name} 上传成功`, res)
},
// 单个文件上传失败
onFailed(file, res) { // JS 语法
console.log(`${file.name} 上传失败`, res)
},
// 上传错误，或者触发 timeout 超时
onError(file, err, res) { // JS 语法
console.log(`${file.name} 上传出错`, err, res)
},
}
console.log(state.formItem.editorContent,'---')
onMounted(() => {
if(router.currentRoute.value.query.task_id){
state.formItem.addItem.task_id = router.currentRoute.value.query.task_id
}
});
// 组件销毁时，也及时销毁编辑器
onBeforeUnmount(() => {
const editor = editorRef.value
if (editor == null) return
editor.destroy()
})
const handleCreated = (editor) => {
editorRef.value = editor // 记录 editor 实例，重要！
}
// 暴露变量
defineExpose({
openDialog,
});
</script>
<style scoped lang="scss">
.el-dialog__body {
display: flex;
justify-content: center;
align-content: center;
}
/** el-input disabled时的背景和边框*/
.el-input.is-disabled{
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-input .el-input__inner){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-input .el-input__wrapper){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
.el-textarea.is-disabled{
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-textarea .el-textarea__inner){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-textarea .el-textarea__wrapper){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
</style>
src/views/claimTasks/user/approved/index.vue 0 → 100644
<template>
<div class="system-menu-container">
<div class="breadcrumb-box">
<Breadcrumb />
</div>
<div class="header-search flex space-between">
<div>
<el-select v-model="state.apiListParam.task_id" placeholder="请选择任务" size="default" @change="searchChange" clearable filterable style="width:200px;margin-right: 20px;">
<el-option v-for="(item, index) in state.taskList" :key="index" :label="item.name"
:value="item.id"></el-option>
</el-select>
<el-select v-model="state.apiListParam.norm_id" placeholder="请选择指标" size="default" @change="searchChange" clearable filterable style="width:300px;margin-right: 20px;">
<el-option v-for="(item, index) in state.normList" :key="index" :label="item.name"
:value="item.id"></el-option>
</el-select>
<el-select v-model="state.apiListParam.statusSelect" placeholder="请选择状态" size="default" @change="searchChange" clearable filterable style="width:300px;margin-right: 20px;">
<el-option v-for="(item, index) in state.statusList" :key="index" :label="item.name"
:value="item.value"></el-option>
</el-select>
<el-input class="search-item" placeholder="输入指标名称" v-model="state.apiListParam.name" size="default"
style="width: 220px;" clearable @change="searchChange()">
</el-input>
<el-button size="default" type="primary" @click="searchChange()" >查询</el-button>
<el-button size="default" @click="reset()" >重置</el-button>
</div>
</div>
<div class="page-main" v-loading="state.tableData.loading" ref="pageMain">
<el-card shadow="hover" style="height:100%;">
<el-table :data="state.tableData.data" style="width: 100%" :height="state.tableHeight"
ref="multipleTableRef">
<el-table-column label="序号" type="index" width="80" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="norm_list_info.name" label="指标名称" show-overflow-tooltip align="center">
</el-table-column>
<el-table-column prop="norm_list_info.sort" width="80" label="优先级" show-overflow-tooltip align="center">
<template #default="scope">
<span style="color: #909399;" v-if="scope.row.norm_list_info.sort=='1'">低</span>
<span style="color: #409EFF;" v-if="scope.row.norm_list_info.sort=='2'">中</span>
<span style="color: #F56C6C;" v-if="scope.row.norm_list_info.sort=='3'">高</span>
</template>
</el-table-column>
<el-table-column prop="norm_list_info.level" width="100" label="难度等级" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="norm_list_info.refer" label="信源" show-overflow-tooltip align="center">
<template #default="scope">
<el-link type="danger" v-if="checkUrl(scope.row.norm_list_info.refer)" :href="scope.row.norm_list_info.refer" target ="_blank">点击查看</el-link>
<span v-else>{{scope.row.norm_list_info.refer}}</span>
</template>
</el-table-column>
<el-table-column prop="norm_list_info.price" width="80" label="单价" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="status" label="完成情况" show-overflow-tooltip align="center">
<template #default="scope">
<el-tag type='warning' v-if="scope.row.status==0" effect="plain" size="small">已领取未填写</el-tag>
<el-tag type='success' v-if="scope.row.status==1" effect="plain" size="small">已完成未审核</el-tag>
<el-tag type='danger' v-if="scope.row.status==2" effect="plain" size="small">审核未通过</el-tag>
<el-tag type='warning' v-if="scope.row.status==3" effect="plain" size="small">已通过未结算</el-tag>
<el-tag type='info' v-if="scope.row.status==4" effect="plain" size="small">已结算</el-tag>
</template>
</el-table-column>
<el-table-column prop="not_collectible" label="是否可采集" show-overflow-tooltip align="center">
<template #default="scope">
<span style="color: #F56C6C" v-if="scope.row.not_collectible==1" effect="plain" size="small">{{scope.row.not_collectible_remarks}}</span>
<span style="color: #909399" v-else effect="plain" size="small">是</span>
</template>
</el-table-column>
<el-table-column prop="review_remarks" label="审核备注" show-overflow-tooltip align="center">
<template #default="scope">
<span style="color: #409EFF;" effect="plain" size="small">{{scope.row.review_remarks}}</span>
</template>
</el-table-column>
<el-table-column prop="review_time" width="180" label="审核时间" show-overflow-tooltip align="center">
<template #default="scope">
<span effect="plain" size="small">{{scope.row.review_time}}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="350" fixed="right" align="center">
<template #default="scope">
<div v-if="scope.row.status == 0 || scope.row.status == 1 || scope.row.status == 2">
<el-button size="small" @click="modify(scope.row)" type="primary">修改信息</el-button>
<el-button size="small" @click="details(scope.row)">查看信息</el-button>
<el-button size="small" @click="receive(scope.row.id)" type="danger">退回领取</el-button>
</div>
<div v-if="scope.row.status == 3 || scope.row.status == 4">
<el-button size="small" @click="details(scope.row)" >查看信息</el-button>
</div>
</template>
</el-table-column>
</el-table>
<div class="pagination-box">
<el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
:pager-count="5" :page-sizes="[10, 20, 30]" v-model:current-page="state.apiListParam.page" background
v-model:page-size="state.apiListParam.limit" layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total">
</el-pagination>
</div>
</el-card>
</div>
<ModifyDialog ref="ModifyDialogRef" @refresh="getList()" />
<DetailDialog ref="DetailDialogRef" @refresh="getList()" />
</div>
</template>
<script setup name="taskPackage-list">
import { getCurrentInstance } from 'vue';
import { claimTasksApi } from '/@/api/claimTasks/index';
import { taskPackageApi } from '/@/api/taskPackage/index';
import { normApi } from '/@/api/norm/index';
import { ElMessageBox, ElMessage } from 'element-plus';
import { Session } from '/@/utils/storage';
// 引入组件
const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue'));
const DetailDialog = defineAsyncComponent(() => import('/@/views/claimTasks/user/approved/details.vue'));
const ModifyDialog = defineAsyncComponent(() => import('/@/views/claimTasks/user/approved/modify.vue'));
// 定义变量内容
const DetailDialogRef = ref()
// 定义变量内容
const ModifyDialogRef = ref()
const state = reactive({
// 查询列表参数
apiListParam: {
page: 1,
limit: 10,
name: '',
status:'2,3',
task_id:'',
order:'asc',
norm_id:'',
statusSelect:'',
},
// 任务领取参数
apiReceiveParam: {
id: '',
},
tableData: {
data: [],
loading: false,
total: 0
},
tableHeight: '30vh',
normListExtend:[],
testIndex:0,
taskList:[],
normList:[],
statusList:[{name:'审核通过',value:'3'},{name:'审核不通过',value:'2'}]
});
// 获取任务列表
const getTaskList = () => {
taskPackageApi().taskPackageList({page:-1,limit:-1}).then(res => {
state.taskList = res.data
})
}
// 获取指标列表
const getNormList = () => {
normApi().normList({page:-1,limit:-1}).then(res => {
state.normList = res.data
})
}
// 页面加载时
onMounted(() => {
getTaskList()
getNormList()
getList()
state.tableHeight = getCurrentInstance().refs.pageMain.offsetHeight - 130 - 52 + "px";
});
//校验链接
const checkUrl = (vlaue) =>{
if (/^https?:\/\//.test(vlaue)) {
return true;
} else {
return false;
}
}
/**
* 搜索按钮
*/
const test = () => {
return state.testIndex+1;
}
/**
* 搜索按钮
*/
const searchChange = () => {
state.apiListParam.page = 1
getList()
}
/**
* 重置按钮
*/
const reset = () => {
state.apiListParam.page = 1
state.apiListParam.name = '';
state.apiListParam.statusSelect = ''
state.apiListParam.task_id = '';
state.apiListParam.norm_id = '';
getList()
}
// 分页改变
const onHandleSizeChange = (val) => {
state.apiListParam.limit = val;
getList();
};
const onHandleCurrentChange = (val) => {
state.apiListParam.page = val;
getList();
};
// 获取列表
const getList = () => {
state.tableData.loading = true
claimTasksApi().normReceivesList(state.apiListParam).then(res => {
state.tableData.loading = false
let data =res.data.data;
state.tableData.data = res.data.data
state.tableData.total = res.data.total
}).catch(() => {
state.tableData.loading = false
})
}
/**
* 点击退回任务
*/
const receive = (id) => {
state.apiReceiveParam.id = id
claimTasksApi().normReceivesRevoke(state.apiReceiveParam).then(res => {
ElMessage.success('任务退回成功!');
getList();
}).catch(() => {
state.tableData.loading = false
getList();
})
}
/**
* 修改任务
*/
const details = (data) => {
DetailDialogRef.value.openDialog(data);
}
/**
* 修改任务
*/
const modify = (data) => {
ModifyDialogRef.value.openDialog(data);
}
</script>
<style lang="scss" scoped>
.page-main {
height: calc(100vh - 50px - 106px);
}
</style>
src/views/claimTasks/user/approved/modify.vue 0 → 100644
<template>
<div class="system-role-dialog-container">
<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="40%" @close="closeDialog" :close-on-click-modal="false">
<el-form ref="dialogFormRef" :model="state.formItem.addItem" :rules="state.rules" size="default" label-width="100px"
v-loading="state.dataLoading" label-position="right" style="width: 90%;text-align: center;">
<el-form-item label="任务名称" prop="task_name">
<el-input v-model="state.formItem.addItem.task_name" placeholder="请输入指标名称" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="指标名称" prop="name">
<el-input v-model="state.formItem.addItem.name" placeholder="请输入指标名称" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="参考信源" prop="refer">
<el-input type="textarea" v-model="state.formItem.addItem.refer" placeholder="请输入参考信源" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="参考指南" prop="guide">
<el-input type="textarea" v-model="state.formItem.addItem.guide" placeholder="请输入参考指南" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="信源类型" prop="refer_type">
<el-select v-model="state.formItem.addItem.refer_type" placeholder="请选择信源等级">
<el-option label="官网/政府" value="1"></el-option>
<el-option label="权威媒体" value="2"></el-option>
<el-option label="其他可信信源" value="3"></el-option>
</el-select>
</el-form-item>
<el-form-item label="标题" :prop="'dynamicItem.' + index+ '.name'" v-for="(item, index) in state.formItem.dynamicItem" :key="index">
<el-input v-model="item.name" placeholder="请输入标题" clearable style="width: 30%;" :disabled="true"></el-input>
<div style="width: 10%;">内容:</div>
<el-input v-model="item.value" placeholder="请输入标题对应的值" clearable style="width: 60%;" :disabled="true"></el-input>
</el-form-item>
<el-divider><span style="color: #F56C6C;">用户需填写区域</span></el-divider>
<el-form-item label="标题" :prop="'userFilled.' + index+ '.name'" v-for="(item, index) in state.formItem.userFilled" :key="index">
<el-row style="width: 100% !important;">
<el-col :span="7">
<el-input v-model="item.name" placeholder="请输入标题" clearabl :disabled="true"></el-input>
</el-col>
<el-col :span="2">
<span style="color: red;" v-if="item.radio==1">*</span>内容:
</el-col>
<el-col :span="13">
<el-input v-model="item.value" placeholder="请填写内容" required></el-input>
</el-col>
<el-col :span="2">
<span style="color: red;" v-if="item.radio==1">必填</span>
</el-col>
</el-row>
<el-row style="width: 100% !important; margin-left: -8%; margin-top: 10 !important;">
<el-col :span="2">
<div>备注:</div>
</el-col>
<el-col :span="22">
<el-input v-model="item.remark" placeholder="请输入备注(选填)" clearabl :disabled="true"></el-input>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="state.formItem.addItem.remark" placeholder="请输入备注" clearable></el-input>
</el-form-item>
<el-form-item label="网页截图">
<div style="border: 1px solid #ccc; width: 100%;">
<Toolbar
style="border-bottom: 1px solid #ccc"
:editor="editorRef"
:defaultConfig="toolbarConfig"
:mode="mode"
/>
<Editor
style="height: 300px; overflow-y: hidden;"
v-model="state.formItem.editorContent"
:defaultConfig="editorConfig"
:mode="mode"
@onCreated="handleCreated"
/>
</div>
</el-form-item>
<el-form-item label="是否可采集:" prop="state.not_collectible">
<template #default="scope">
<span style="color: #F56C6C" v-if="state.not_collectible==1" effect="plain" size="small">{{state.not_collectible_remarks}}</span>
<span style="color: #909399" v-else effect="plain" size="small">是</span>
</template>
</el-form-item>
</el-form>
<template #footer>
<el-row style="width: 100% !important;">
<el-col :span="12">
<span class="dialog-footer">
<el-col :span="20">
<el-input v-model="state.notCollectibleData.reason" placeholder="请输入不可采集原因" clearable></el-input><el-button type="warning" :loading="state.btnLoading" @click="notCollectible()" size="danger">不可采集</el-button>
</el-col>
</span>
</el-col>
<el-col :span="12">
<span class="dialog-footer">
<el-button @click="closeDialog()" size="default">取 消</el-button>
<el-button type="primary" :loading="state.btnLoading" @click="onSubmit(dialogFormRef)"
size="danger">提交</el-button>
</span>
</el-col>
</el-row>
</template>
</el-dialog>
</div>
</template>
<script setup name="systemRoleDialog">
import '@wangeditor/editor/dist/css/style.css' // 引入 css
import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
import { claimTasksApi } from '/@/api/claimTasks'
import { ElMessage } from 'element-plus';
import { getUploadUrl } from "/@/utils/getHost.js";
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
// 定义变量内容
const dialogFormRef = ref();
const router = useRouter();
const state = reactive({
userId: null,
index:0,
userIndex:0,
apiData: {
id:'',
},
rules: {
refer_type: [{ required: true, message: '请输入选择信源类型', trigger: 'blur' }],
},
dialog: {
isShowDialog: false,
title: '',
submitTxt: '',
},
notCollectibleData:{
id:'',
reason:'',
},
dataLoading: false,
btnLoading: false,
// 填写内容及自定义文本框
formItem: {
addItem:{
refer_type:'',
id:'',
},
dynamicItem: [
//默认显示一条
// {
// name: '',
// value:''
// }
],
userFilled: [
//默认显示一条
// {
// name: '',
// radio:'1',
// }
],
editorImgList:[], // 富文本里的内容
editorContent:'', // 富文本所有内容
not_collectible:'',
not_collectible_remarks:'',
}
});
// 打开弹窗
const openDialog = (data) => {
state.dialog.isShowDialog = true;
state.dialog.title = '指标详情';
state.apiData.id = data.id;
state.formItem.addItem.norm_receive_id = data.id;
state.notCollectibleData.id = data.id
// 清空数据
claimTasksApi().normReceivesDetail(state.apiData).then(res => {
let addItem = res.data.addItem;
let userFilled = res.data.userFilled;
let adminFilled = res.data.adminFilled;
// 数据详情
state.formItem.addItem.task_id = addItem.task_id;
state.formItem.addItem.norm_id = addItem.norm_id;
state.formItem.addItem.norm_list_id = addItem.id;
state.formItem.addItem.name = addItem.name;
state.formItem.addItem.task_name = addItem.task_name;
state.formItem.addItem.refer = addItem.refer;
state.formItem.addItem.guide = addItem.guide;
state.not_collectible_remarks = data.not_collectible_remarks
state.not_collectible = data.not_collectible
//富文本内容相关
if(res.data.normCollectInfo)
{
let normCollectInfo = res.data.normCollectInfo;
state.formItem.addItem.refer_type = normCollectInfo.refer_type;
state.formItem.addItem.remark = normCollectInfo.remark;
if(normCollectInfo.editorContent){
state.formItem.editorContent = normCollectInfo.editorContent
}else{
state.formItem.editorContent = '请输入截图'
}
}
state.userIndex = 0;
state.index = 0;
console.log(state.formItem.addItem)
userFilled.forEach(item => {
state.formItem.userFilled.push({id:item.id,name:item.extend_name,radio:item.required+"",value:item.extend_value});
state.userIndex++
});
adminFilled.forEach(item => {
state.formItem.dynamicItem.push({id:item.id,name:item.extend_name,value:item.extend_value,});
state.index++
});
}).catch(() => {
})
};
// 数据不可采集
const notCollectible = () =>{
const editor = editorRef.value;
if(state.notCollectibleData.id ==""){
ElMessage.error('无法获取ID!');
return;
}
if(state.notCollectibleData.reason ==""){
ElMessage.error('请填写不可采集的原因!');
return;
}
claimTasksApi().notCollectible(state.notCollectibleData).then(res => {
const editor = editorRef.value;
// 获取富文本里的图片地址
editor.getElemsByType("image").forEach((item, index) => {
state.formItem.editorImgList.push(item.src);
})
state.formItem.editorContent = editor.getHtml() // 获取富文本内容
let apiIndex = 1;
if(state.formItem.editorImgList.length>2){
apiIndex++;
state.formItem.editorImgList = [];
ElMessage.error('只允许上传两张图片!');
}
if(apiIndex==1&&valid){
claimTasksApi().normReceivesModify(JSON.stringify(state.formItem)).then(res => {
editor.clear()
state.btnLoading = false
ElMessage.success('操作成功');
closeDialog();
emit('refresh');
}).catch(() => {
editor.clear()
state.btnLoading = false
closeDialog();
emit('refresh');
})
}
}).catch(() => {
editor.clear()
state.btnLoading = false
closeDialog();
emit('refresh');
})
state.notCollectibleData.reason = '';
}
// 提交
const onSubmit = () => {
const editor = editorRef.value;
// 获取富文本里的图片地址
editor.getElemsByType("image").forEach((item, index) => {
state.formItem.editorImgList.push(item.src);
})
state.formItem.editorContent = editor.getHtml() // 获取富文本内容
dialogFormRef.value.validate((valid, fields) => {
let userFilledInfo = state.formItem.userFilled;
let apiIndex = 1;
for(let i=0;i<userFilledInfo.length;i++)
{
if (userFilledInfo[0].radio==1) {
if (userFilledInfo[0].value == "") {
apiIndex++;
ElMessage.error('请填写红色星号必填项!');
break;
}
}
}
console.log(state.formItem.editorImgList)
if(state.formItem.editorImgList.length>2){
apiIndex++;
state.formItem.editorImgList = [];
ElMessage.error('只允许上传两张图片!');
}
if(apiIndex==1&&valid){
claimTasksApi().normReceivesModify(JSON.stringify(state.formItem)).then(res => {
editor.clear()
state.btnLoading = false
ElMessage.success('操作成功');
closeDialog();
emit('refresh');
}).catch(() => {
editor.clear()
state.btnLoading = false
closeDialog();
emit('refresh');
})
}
})
};
// 关闭弹窗
const closeDialog = () => {
state.index=0
state.userIndex=0
state.formItem.addItem.task_id = '';
state.formItem.addItem.norm_id = '';
state.formItem.addItem.norm_list_id = '';
state.formItem.addItem.name = '';
state.formItem.addItem.task_name = '';
state.formItem.addItem.refer = '';
state.formItem.addItem.refer_type = '';
state.formItem.addItem.remark = '';
state.formItem.addItem.guide = '';
state.formItem.dynamicItem = [];
state.formItem.userFilled = [];
state.formItem.editorImgList = [];
state.formItem.editorContent = '';
state.not_collectible_remarks = ''
state.not_collectible = ''
if(state.formItem.addItem.refer_type){
state.formItem.addItem.refer_type ='';
}
if(state.formItem.addItem.remark)
{
state.formItem.addItem.remark = '';
}
dialogFormRef.value.resetFields();
state.dialog.isShowDialog = false;
};
// 编辑器实例，必须用 shallowRef
const editorRef = shallowRef()
const mode = ref('default')
const toolbarConfig = {}
const editorConfig = {
placeholder: '请输入截图',
MENU_CONF: {}
}
editorConfig.MENU_CONF['uploadImage'] = {
// 其他配置...
// 小于该值就插入 base64 格式（而不上传），默认为 0
base64LimitSize: 5 * 1024, // 5kb
server: getUploadUrl(),
fieldName: 'file',
// 单个文件上传成功之后
onSuccess(file, res) { // JS 语法
console.log(`${file.name} 上传成功`, res)
},
// 单个文件上传失败
onFailed(file, res) { // JS 语法
console.log(`${file.name} 上传失败`, res)
},
// 上传错误，或者触发 timeout 超时
onError(file, err, res) { // JS 语法
console.log(`${file.name} 上传出错`, err, res)
},
}
onMounted(() => {
if(router.currentRoute.value.query.task_id){
state.formItem.addItem.task_id = router.currentRoute.value.query.task_id
}
});
// 组件销毁时，也及时销毁编辑器
onBeforeUnmount(() => {
const editor = editorRef.value
if (editor == null) return
editor.destroy()
})
const handleCreated = (editor) => {
editorRef.value = editor // 记录 editor 实例，重要！
}
// 暴露变量
defineExpose({
openDialog,
});
</script>
<style scoped lang="scss">
.el-dialog__body {
display: flex;
justify-content: center;
align-content: center;
}
.el-input.is-disabled{
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-input .el-input__inner){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-input .el-input__wrapper){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
.el-textarea.is-disabled{
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-textarea .el-textarea__inner){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
:deep(.el-textarea .el-textarea__wrapper){
background:#fff !important;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
}
</style>
src/views/claimTasks/user/completed/index.vue
...@@ -109,7 +109,7 @@ const state = reactive({ ...@@ -109,7 +109,7 @@ const state = reactive({
page: 1, page: 1,
limit: 10, limit: 10,
name: '', name: '',
status:'1,2,3', status:'1',
task_id:'', task_id:'',
order:'asc' order:'asc'
}, },
......
src/views/claimTasks/user/list/index.vue
...@@ -114,6 +114,7 @@ const state = reactive({ ...@@ -114,6 +114,7 @@ const state = reactive({
// 结算任务 // 结算任务
claimTasksParam:[], claimTasksParam:[],
taskList:[], taskList:[],
normList:[],
}); });
// 获取任务列表 // 获取任务列表
const getTaskList = () => { const getTaskList = () => {
...@@ -189,6 +190,8 @@ const searchChange = () => { ...@@ -189,6 +190,8 @@ const searchChange = () => {
const reset = () => { const reset = () => {
state.apiListParam.page = 1 state.apiListParam.page = 1
state.apiListParam.name = ''; state.apiListParam.name = '';
state.apiListParam.task_id = '';
state.apiListParam.norm_id = '';
getList() getList()
} }
......
src/views/claimTasks/user/settled/index.vue 0 → 100644
<template>
<div class="system-menu-container">
<div class="breadcrumb-box">
<Breadcrumb />
</div>
<div class="page-main" v-loading="state.tableData.loading" ref="pageMain">
<el-card shadow="hover" style="height:100%;">
<el-table :data="state.tableData.data" border style="width: 100%" :height="state.tableHeight"
ref="multipleTableRef">
<el-table-column label="序号" type="index" width="100" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="userInfo.name" label="用户名称" show-overflow-tooltip align="center">
<template #default="scope">
<span style="color: #409EFF;">{{scope.row.userInfo.name}}</span>
</template>
</el-table-column>
<el-table-column prop="time" label="结算时间" show-overflow-tooltip align="center">
<template #default="scope">
<span>{{scope.row.time}}</span>
</template>
</el-table-column>
<el-table-column prop="num" label="数量" show-overflow-tooltip align="center"></el-table-column>
<el-table-column prop="amount" label="总金额" show-overflow-tooltip align="center">
</el-table-column>
<el-table-column prop="status" label="状态" show-overflow-tooltip align="center">
<template #default="scope">
<span style="color: #909399;" v-if="scope.row.status=='0'">未确认</span>
<span style="color: #409EFF;" v-if="scope.row.status=='1'">已确认</span>
<span style="color: #F56C6C;" v-if="scope.row.status=='2'">确认收款</span>
</template>
</el-table-column>
<!-- <el-table-column label="操作" width="300" fixed="right" align="center">
<template #default="scope">
<el-button size="small" @click="details(scope.row.id)">查看详情</el-button>
</template>
</el-table-column> -->
</el-table>
<div class="pagination-box">
<el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
:pager-count="5" :page-sizes="[10, 20, 30]" v-model:current-page="state.apiListParam.page" background
v-model:page-size="state.apiListParam.limit" layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total">
</el-pagination>
</div>
</el-card>
</div>
</div>
</template>
<script setup name="taskPackage-list">
import { getCurrentInstance } from 'vue';
import { normOrdersApi } from '/@/api/normOrders/index';
import { ElMessageBox, ElMessage } from 'element-plus';
import { Session } from '/@/utils/storage';
// 引入组件
const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue'));
const router = useRouter();
// 定义变量内容
const DetailDialogRef = ref()
const state = reactive({
// 查询列表参数
apiListParam: {
page: 1,
limit: 10,
name: '',
user_id:'',
},
tableData: {
data: [],
loading: false,
total: 0
},
tableHeight: '30vh',
normListExtend:[],
testIndex:0,
taskList:[],
});
// 页面加载时
onMounted(() => {
getList()
state.tableHeight = getCurrentInstance().refs.pageMain.offsetHeight - 130 - 52 + "px";
});
/**
* 搜索按钮
*/
const test = () => {
return state.testIndex+1;
}
/**
* 搜索按钮
*/
const searchChange = () => {
state.apiListParam.page = 1
getList()
}
/**
* 重置按钮
*/
const reset = () => {
state.apiListParam.page = 1
state.apiListParam.name = '';
getList()
}
// 分页改变
const onHandleSizeChange = (val) => {
state.apiListParam.limit = val;
getList();
};
const onHandleCurrentChange = (val) => {
state.apiListParam.page = val;
getList();
};
// 获取列表
const getList = () => {
state.tableData.loading = true
state.apiListParam.user_id= Session.get('userInfo').id
normOrdersApi().normOrdersList(state.apiListParam).then(res => {
state.tableData.loading = false
let data =res.data.data;
state.tableData.data = res.data.data
state.tableData.total = res.data.total
}).catch(() => {
state.tableData.loading = false
})
}
/**
* 点击查看
*/
const details = (id) => {
// this.$router.push('/target')
router.push({
path: '/balance/settlementList/details',query: {id:id}
});
}
</script>
<style lang="scss" scoped>
.page-main {
height: calc(100vh - 50px - 106px);
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment