Skip to content

D
data-collect
Commit 430501a3 by wenyi.chen
Options

v1

parent ea6b41d4
Showing with 675 additions and 239 deletions
src/views/dataScreening/list/ss.vue
...@@ -87,7 +87,7 @@ import { ElMessageBox, ElMessage } from 'element-plus'; ...@@ -87,7 +87,7 @@ import { ElMessageBox, ElMessage } from 'element-plus';
// 引入组件 // 引入组件
const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue')); const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue'));
const AddDialog = defineAsyncComponent(() => import('/@/views/norm/list/dialog.vue')); const AddDialog = defineAsyncComponent(() => import('/@/views/norm/list/dialog.vue'));
const DetailDialog = defineAsyncComponent(() => import('/@/views/norm/list/details.vue')); // const DetailDialog = defineAsyncComponent(() => import('/@/views/norm/list/details.vue'));
const EditDialog = defineAsyncComponent(() => import('/@/views/norm/list/edit.vue')); const EditDialog = defineAsyncComponent(() => import('/@/views/norm/list/edit.vue'));
const ImporDialog = defineAsyncComponent(() => import('/@/views/norm/list/impor.vue')); const ImporDialog = defineAsyncComponent(() => import('/@/views/norm/list/impor.vue'));
const router = useRouter(); const router = useRouter();
......
src/views/norm/list/--details--.vue 0 → 100644
<template>
<div class="system-role-dialog-container">
<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="60%" @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="name">
<el-input type="textarea" v-model="state.formItem.addItem.name" placeholder="请输入指标名称" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="难度等级">
<el-select v-model="state.formItem.addItem.level" :disabled="true" placeholder="请选择难度等级">
<el-option label="1" value="1"></el-option>
<el-option label="2" value="2"></el-option>
<el-option label="3" value="3"></el-option>
</el-select>
</el-form-item>
<el-form-item label="优先级">
<el-select v-model="state.formItem.addItem.sort" :disabled="true" 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="refer">
<el-input type="textarea" v-model="state.formItem.addItem.refer" placeholder="请输入参考信源" clearable :disabled="true"></el-input>
</el-form-item>
<el-form-item label="price" prop="price">
<el-input-number v-model="state.formItem.addItem.price" :precision="2" :step="0.1" :max="10" placeholder="请输入单价" :disabled="true"></el-input-number>
</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: 40%;" :disabled="true"></el-input>
<div style="width: 20%;">内容:</div>
<el-input v-model="item.value" placeholder="请输入标题对应的值" clearable style="width: 40%;" :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="12">
<el-input v-model="item.name" placeholder="请输入标题" clearabl :disabled="true"></el-input>
</el-col>
<el-col :span="6">
<div>是否必填:</div>
</el-col>
<el-col :span="6">
<div>
<el-radio v-model="item.radio" label="1" :disabled="true">是</el-radio>
<el-radio v-model="item.radio" label="0" :disabled="true">否</el-radio>
</div>
</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="18">
<el-input v-model="item.remarks" placeholder="请输入备注(选填)" clearabl :disabled="true"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-form>
<el-divider style="width: 90%;"><span style="color: #F56C6C;">用户已领取列表</span></el-divider>
<el-table :data="state.tableData" border style="width: 100%" :height="state.tableHeight"
ref="multipleTableRef">
<el-table-column v-for="column in state.columns" :key="column.prop" :label="column.label" :prop="column.prop" :width="column.width" show-overflow-tooltip align="center">
<template #default="scope">
<span style="color:#409EFF" v-if="column.label =='用户名称'">{{scope.row[column.prop]}}</span>
<span style="color:#909399" v-else-if="column.label =='领取状态' && scope.row[column.prop] ==1">已领取</span>
<span style="color:#E6A23C" v-else-if="column.label =='完成状态' && scope.row[column.prop] ==0">未完成</span>
<span style="color:#409EFF" v-else-if="column.label =='完成状态' && scope.row[column.prop] ==1">已完成</span>
<span v-else>{{scope.row[column.prop]}}</span>
</template>
</el-table-column>
</el-table>
</el-dialog>
</div>
</template>
<script setup name="systemRoleDialog">
import { normApi } from '/@/api/norm'
import { ElMessage } from 'element-plus';
import { toolsApi } from '/@/api/tools'
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
// 定义变量内容
const dialogFormRef = ref();
const router = useRouter();
const state = reactive({
userId: null,
index:0,
userIndex:0,
apiData: {
id:'',
},
rules: {
},
dialog: {
isShowDialog: false,
title: '',
submitTxt: '',
},
tableData:[
],
columns:[
],
collectsTableData:[],
collectsColumns:[],
dataLoading: false,
btnLoading: false,
// 填写内容及自定义文本框
formItem: {
addItem:{
name:'',
level:'',
sort:'',
refer:'',
price:'',
task_id:'',
},
dynamicItem: [
//默认显示一条
// {
// name: '',
// value:''
// }
],
userFilled: [
//默认显示一条
// {
// name: '',
// radio:'1',
// }
]
}
});
// 打开弹窗
const openDialog = (norm_id) => {
state.dialog.isShowDialog = true;
state.dialog.title = '子任务详情';
state.apiData.id = norm_id;
// 清空数据
state.formItem.addItem.name = '';
state.formItem.addItem.level = '';
state.formItem.addItem.sort = '';
state.formItem.addItem.refer = '';
state.formItem.addItem.price = '';
state.formItem.addItem.task_id = '';
state.formItem.addItem.guide = '';
state.formItem.dynamicItem = [];
state.formItem.userFilled = [];
state.tableData=[];
state.columns=[];
state.collectsTableData=[];
state.collectsColumns=[];
normApi().normDetail(state.apiData).then(res => {
let addItem = res.data.addItem;
let custom = res.data.custom;
// 数据详情
state.formItem.addItem.name = addItem.name;
state.formItem.addItem.level = addItem.level;
state.formItem.addItem.sort = addItem.sort+'';
state.formItem.addItem.refer = addItem.refer;
state.formItem.addItem.price =addItem.price;
state.formItem.addItem.task_id= addItem.task_id
state.formItem.addItem.guide= addItem.guide
state.userIndex = 0;
state.index = 0;
custom.forEach(item => {
if(item.user_filled==1){
state.formItem.userFilled.push({name:item.extend_name,radio:item.required+"",remarks:item.extend_remarks});
state.userIndex++
}else{
state.formItem.dynamicItem.push({name:item.extend_name,value:item.extend_value});
state.index++
}
});
//领取列表
let receivesList = res.data.receivesList
if(receivesList){
let arr = [
{ label:'序号', prop: 'index',width:'80px'},
// { label:'ID', prop: 'id'},
{ label:'用户名称', prop: 'userInfo.name',width:120},
{ label:'任务名称', prop: 'task_info.name',width:180},
{ label:'指标名称', prop: 'norm_list_info.name',width:180},
];
state.columns = arr;
receivesList.forEach(function(item, index, arr) {
let list = {
'index': index+1,
// 'id':item.id,
'userInfo.name': item.userInfo.name,
'task_info.name': item.task_info.name,
'norm_list_info.name': item.norm_list_info.name,
'receives_status': item.receives_status,
'completion_status': item.completion_status,
'not_collectible_remarks': item.not_collectible_remarks?item.not_collectible_remarks:"是",
}
state.tableData.push(list);
item.norm_list_extend.forEach(function(items, indexs, arrs) {
if(state.columns.length>0){
state.columns.forEach(function(itemss, indexss, arrss) {
let vlues = state.columns.map(itemsss => itemsss.prop).indexOf('extend_value'+indexs)
if(vlues== -1){
state.columns.push( { label: items.extend_name, prop: 'extend_value'+indexs,width:180 })
}
});
}else{
state.columns.push( { label: items.extend_name, prop: 'extend_value'+indexs,width:180 })
}
list['extend_value'+indexs] =items.extend_value;
});
});
state.columns.push( { label: '领取状态', prop:'receives_status',width:100 })
state.columns.push( { label: '完成状态', prop:'completion_status',width:100 })
state.columns.push( { label: '是否可采集', prop:'not_collectible_remarks',width:200 })
}
}).catch(() => {
})
};
// 关闭弹窗
const closeDialog = () => {
dialogFormRef.value.resetFields();
state.dialog.isShowDialog = false;
};
// 暴露变量
defineExpose({
openDialog,
});
onMounted(() => {
if(router.currentRoute.value.query.task_id){
state.formItem.addItem.task_id = router.currentRoute.value.query.task_id
}
});
</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/norm/list/details.vue
<template> <template>
<div class="system-role-dialog-container"> <div class="system-menu-container">
<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="60%" @close="closeDialog" :close-on-click-modal="false"> <div class="breadcrumb-box">
<el-form ref="dialogFormRef" :model="state.formItem.addItem" :rules="state.rules" size="default" label-width="100px" <Breadcrumb />
v-loading="state.dataLoading" label-position="right" style="width: 90%;text-align: center;"> </div>
<el-form-item label="子任务名称" prop="name"> <div class="header-search flex space-between">
<el-input type="textarea" v-model="state.formItem.addItem.name" placeholder="请输入指标名称" clearable :disabled="true"></el-input> <div>
</el-form-item> <el-page-header @back="backToPreviousPage">
<el-form-item label="难度等级"> </el-page-header>
<el-select v-model="state.formItem.addItem.level" :disabled="true" placeholder="请选择难度等级"> </div>
<el-option label="1" value="1"></el-option> <div style="margin-right: 20px;">
<el-option label="2" value="2"></el-option> <el-button type="primary" size="small" @click="whole">查看详细信息</el-button>
<el-option label="3" value="3"></el-option> </div>
</el-select> </div>
</el-form-item> <div class="page-main" ref="pageMain" v-loading="state.loading">
<el-form-item label="优先级"> <el-card shadow="hover" style="height:100%; overflow: scroll">
<el-select v-model="state.formItem.addItem.sort" :disabled="true" placeholder="请选择优先级"> <div class="box_info">
<el-option label="低" value="1"></el-option> <el-row :gutter="20">
<el-option label="中" value="2"></el-option> <el-col :span="8"><sapn class="box_title">任务名称：</sapn><span></span></el-col>
<el-option label="高" value="3"></el-option> <el-col :span="8"><sapn class="box_title">子任务名称：</sapn><span>{{state.formItem.addItem.name }}</span></el-col>
</el-select> <el-col :span="8"><sapn class="box_title">难度等级：</sapn><span>{{state.formItem.addItem.level }}级</span></el-col>
</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="price" prop="price">
<el-input-number v-model="state.formItem.addItem.price" :precision="2" :step="0.1" :max="10" placeholder="请输入单价" :disabled="true"></el-input-number>
</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: 40%;" :disabled="true"></el-input>
<div style="width: 20%;">内容:</div>
<el-input v-model="item.value" placeholder="请输入标题对应的值" clearable style="width: 40%;" :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="12">
<el-input v-model="item.name" placeholder="请输入标题" clearabl :disabled="true"></el-input>
</el-col>
<el-col :span="6">
<div>是否必填:</div>
</el-col>
<el-col :span="6">
<div>
<el-radio v-model="item.radio" label="1" :disabled="true">是</el-radio>
<el-radio v-model="item.radio" label="0" :disabled="true">否</el-radio>
</div>
</el-col>
</el-row> </el-row>
<el-row style="width: 100% !important; margin-left: -8%; margin-top: 10 !important;"> </div>
<el-col :span="2"> <div class="box_info">
<div>备注:</div> <el-row :gutter="20">
<el-col :span="8"><sapn class="box_title">优先级：</sapn><span>{{formatOutputSort(state.formItem.addItem.sort)}}级</span></el-col>
<el-col :span="8"><sapn class="box_title">单价：</sapn><span>{{state.formItem.addItem.price }}/元</span></el-col>
<el-col :span="8"><sapn class="box_title">参考信源：</sapn>
<el-link type="danger" v-if="checkUrl(state.formItem.addItem.refer)" :href="state.formItem.addItem.refer" target ="_blank">点击查看</el-link>
<span v-else>{{state.formItem.addItem.refer}}</span>
</el-col> </el-col>
<el-col :span="18"> </el-row>
<el-input v-model="item.remarks" placeholder="请输入备注(选填)" clearabl :disabled="true"></el-input> </div>
<div class="box_info">
<el-row :gutter="20">
<el-col :span="8">
<sapn class="box_title">参考指南：</sapn>
<el-link type="danger" v-if="checkUrl(state.formItem.addItem.guide)" :href="state.formItem.addItem.guide" target ="_blank">点击查看</el-link>
<span v-else>{{state.formItem.addItem.guide}}</span>
</el-col> </el-col>
</el-row> </el-row>
</el-form-item> </div>
</el-form> <el-divider><span style="color: #F56C6C;">展示端</span></el-divider>
<el-divider style="width: 90%;"><span style="color: #F56C6C;">用户已领取列表</span></el-divider> <div class="custom">
<el-table :data="state.tableData" border style="width: 100%" :height="state.tableHeight" <div style="width: 100%; margin-bottom: 20px;" v-for="(item, index) in state.formItem.dynamicItem">
ref="multipleTableRef"> <sapn class="box_title">{{item.name}}：</sapn>
<el-table-column v-for="column in state.columns" :key="column.prop" :label="column.label" :prop="column.prop" :width="column.width" show-overflow-tooltip align="center"> <span v-html="formatOutputCustom(item.value)"></span>
<template #default="scope"> </div>
<span style="color:#409EFF" v-if="column.label =='用户名称'">{{scope.row[column.prop]}}</span> </div>
<span style="color:#909399" v-else-if="column.label =='领取状态' && scope.row[column.prop] ==1">已领取</span> <el-divider><span style="color: #F56C6C;">用户端</span></el-divider>
<span style="color:#E6A23C" v-else-if="column.label =='完成状态' && scope.row[column.prop] ==0">未完成</span> <div class="custom">
<span style="color:#409EFF" v-else-if="column.label =='完成状态' && scope.row[column.prop] ==1">已完成</span> <div style="width: 30%; margin-bottom: 20px; float: left;" v-for="(item, index) in state.formItem.userFilled">
<span v-else>{{scope.row[column.prop]}}</span> <div>名称：{{item.name}}</div>
</template> <div>内容：</div>
</el-table-column> <div>是否必填：
</el-table> <span style="color:#F56C6C" v-if="item.radio==1">必填</span>
</el-dialog> <span style="color:#909399" v-if="item.radio==0">选填</span>
</div> </div>
<div>备注：{{item.remarks}}</div>
</div>
</div>
</el-card>
</div>
</div>
</template> </template>
<script setup name="systemRoleDialog"> <script setup name="taskPackage-list">
import { getCurrentInstance } from 'vue';
import { normApi } from '/@/api/norm' import { normApi } from '/@/api/norm'
import { ElMessage } from 'element-plus'; import { ElMessageBox, ElMessage } from 'element-plus';
import { toolsApi } from '/@/api/tools' import { Session } from '/@/utils/storage';
// 定义子组件向父组件传值/事件 // 引入组件
const emit = defineEmits(['refresh']); const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue'));
// 定义变量内容
const dialogFormRef = ref();
const router = useRouter(); const router = useRouter();
const state = reactive({ const state = reactive({
userId: null, apiData:{
index:0, id:'',
userIndex:0,
apiData: {
id:'',
},
rules: {
}, },
dialog: { loading: false,
isShowDialog: false,
title: '',
submitTxt: '',
},
tableData:[
],
columns:[
],
collectsTableData:[],
collectsColumns:[],
dataLoading: false,
btnLoading: false,
// 填写内容及自定义文本框 // 填写内容及自定义文本框
formItem: { formItem: {
addItem:{ addItem:{
name:'', name:'',
...@@ -122,41 +89,17 @@ const state = reactive({ ...@@ -122,41 +89,17 @@ const state = reactive({
task_id:'', task_id:'',
}, },
dynamicItem: [ dynamicItem: [
//默认显示一条
// {
// name: '',
// value:''
// }
], ],
userFilled: [ userFilled: [
//默认显示一条
// {
// name: '',
// radio:'1',
// }
] ]
} }
}); });
/**
// 打开弹窗 * 获取指标详情
const openDialog = (norm_id) => { */
state.dialog.isShowDialog = true; const getInfo = ()=>{
state.dialog.title = '子任务详情'; state.loading = true
state.apiData.id = norm_id;
// 清空数据 // 清空数据
state.formItem.addItem.name = '';
state.formItem.addItem.level = '';
state.formItem.addItem.sort = '';
state.formItem.addItem.refer = '';
state.formItem.addItem.price = '';
state.formItem.addItem.task_id = '';
state.formItem.addItem.guide = '';
state.formItem.dynamicItem = [];
state.formItem.userFilled = [];
state.tableData=[];
state.columns=[];
state.collectsTableData=[];
state.collectsColumns=[];
normApi().normDetail(state.apiData).then(res => { normApi().normDetail(state.apiData).then(res => {
let addItem = res.data.addItem; let addItem = res.data.addItem;
let custom = res.data.custom; let custom = res.data.custom;
...@@ -167,126 +110,116 @@ const openDialog = (norm_id) => { ...@@ -167,126 +110,116 @@ const openDialog = (norm_id) => {
state.formItem.addItem.refer = addItem.refer; state.formItem.addItem.refer = addItem.refer;
state.formItem.addItem.price =addItem.price; state.formItem.addItem.price =addItem.price;
state.formItem.addItem.task_id= addItem.task_id state.formItem.addItem.task_id= addItem.task_id
state.formItem.addItem.guide= addItem.guide state.formItem.addItem.guide= addItem.guide;
state.userIndex = 0;
state.index = 0;
custom.forEach(item => { custom.forEach(item => {
if(item.user_filled==1){ if(item.user_filled==1){
state.formItem.userFilled.push({name:item.extend_name,radio:item.required+"",remarks:item.extend_remarks}); state.formItem.userFilled.push({name:item.extend_name,radio:item.required+"",remarks:item.extend_remarks});
state.userIndex++
}else{ }else{
state.formItem.dynamicItem.push({name:item.extend_name,value:item.extend_value}); state.formItem.dynamicItem.push({name:item.extend_name,value:item.extend_value});
state.index++
} }
}); });
state.loading = false
//领取列表
let receivesList = res.data.receivesList
if(receivesList){
let arr = [
{ label:'序号', prop: 'index',width:'80px'},
// { label:'ID', prop: 'id'},
{ label:'用户名称', prop: 'userInfo.name',width:120},
{ label:'任务名称', prop: 'task_info.name',width:180},
{ label:'指标名称', prop: 'norm_list_info.name',width:180},
];
state.columns = arr;
receivesList.forEach(function(item, index, arr) {
let list = {
'index': index+1,
// 'id':item.id,
'userInfo.name': item.userInfo.name,
'task_info.name': item.task_info.name,
'norm_list_info.name': item.norm_list_info.name,
'receives_status': item.receives_status,
'completion_status': item.completion_status,
'not_collectible_remarks': item.not_collectible_remarks?item.not_collectible_remarks:"是",
}
state.tableData.push(list);
item.norm_list_extend.forEach(function(items, indexs, arrs) {
if(state.columns.length>0){
state.columns.forEach(function(itemss, indexss, arrss) {
let vlues = state.columns.map(itemsss => itemsss.prop).indexOf('extend_value'+indexs)
if(vlues== -1){
state.columns.push( { label: items.extend_name, prop: 'extend_value'+indexs,width:180 })
}
});
}else{
state.columns.push( { label: items.extend_name, prop: 'extend_value'+indexs,width:180 })
}
list['extend_value'+indexs] =items.extend_value;
});
});
state.columns.push( { label: '领取状态', prop:'receives_status',width:100 })
state.columns.push( { label: '完成状态', prop:'completion_status',width:100 })
state.columns.push( { label: '是否可采集', prop:'not_collectible_remarks',width:200 })
}
}).catch(() => { }).catch(() => {
}) })
}; }
// 关闭弹窗 //校验链接
const closeDialog = () => { const checkUrl = (vlaue) =>{
dialogFormRef.value.resetFields(); if (/^https?:\/\//.test(vlaue)) {
state.dialog.isShowDialog = false; return true;
}; } else {
return false;
}
}
// 暴露变量 /**
defineExpose({ * 优先级格式化输出
openDialog, * @param {*} vlaue
}); */
const formatOutputSort = (vlaue) =>{
if (vlaue==1) {
return '低';
} else if(vlaue==2) {
return '中';
}else{
return '高';
}
}
/**
* 自定义内容格式化输出
* @param {*} vlaue
*/
const formatOutputCustom = (vlaue) =>{
if(vlaue){
let arr = vlaue.split(",");
let txt = '';
if(arr.length>1){
arr.map((item, index) => {
let str = checkUrl(item);
if(str){
txt+= "<div><a style='color:#409EFF;' href='"+item+"' target ='_blank'>"+(index+1)+"、"+item+"</a></div>";
}else{
txt+= "<div>"+(index+1)+"、"+item+"</div>";
}
})
return txt;
}else{
return vlaue;
}
}else{
return vlaue;
}
}
// 页面加载时
onMounted(() => { onMounted(() => {
if(router.currentRoute.value.query.task_id){ // getDepatment()
state.formItem.addItem.task_id = router.currentRoute.value.query.task_id if(router.currentRoute.value.query.norm_id){
} state.apiData.id = router.currentRoute.value.query.norm_id
// state.isHide = true // 如果有任务ID才允许发布
getInfo()
}else{
router.go(-1);
}
state.tableHeight = getCurrentInstance().refs.pageMain.offsetHeight - 80 - 52 + "px";
})
/**
* 返回上一级页面
*/
const backToPreviousPage = () => {
// this.$router.push('/target')
router.go(-1);
}
// 详情信息
const whole= () => {
alert(111)
router.push({
path: '/norm/list/whole',query: {norm_id:state.apiData.id}
});
}
});
</script> </script>
<style scoped lang="scss"> <style lang="scss" scoped>
.el-dialog__body { .page-main {
height: calc(100vh - 50px - 116px);
display: flex;
justify-content: center;
align-content: center;
} }
.el-input.is-disabled{ .norm_title{
background:#fff !important; font-weight:bold;color: #409EFF;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
} }
:deep(.el-input .el-input__inner){ .box_info{
background:#fff !important; margin-bottom: 20px;
color: var(--el-radio-text-color) !important;
-webkit-text-fill-color: var(--el-radio-text-color) !important;
} }
:deep(.el-input .el-input__wrapper){ .box_title{
background:#fff !important; // color: #409EFF;
color: var(--el-radio-text-color) !important; font-weight: 600;
-webkit-text-fill-color: var(--el-radio-text-color) !important; }
.custom_a{
text-decoration: none !important;
float: left;
} }
.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> </style>
src/views/norm/list/index.vue
...@@ -80,7 +80,6 @@ ...@@ -80,7 +80,6 @@
:total="state.tableData.total"> :total="state.tableData.total">
</el-pagination> </el-pagination>
</div> </div>
<DetailDialog ref="DetailDialogRef" @refresh="getList()" />
<AddDialog ref="AddDialogRef" @refresh="getList()" /> <AddDialog ref="AddDialogRef" @refresh="getList()" />
<EditDialog ref="EditDialogRef" @refresh="getList()" /> <EditDialog ref="EditDialogRef" @refresh="getList()" />
<ImporDialog ref="ImporDialogRef" @refresh="getList()" /> <ImporDialog ref="ImporDialogRef" @refresh="getList()" />
...@@ -99,7 +98,6 @@ import { Session } from '/@/utils/storage'; ...@@ -99,7 +98,6 @@ import { Session } from '/@/utils/storage';
// 引入组件 // 引入组件
const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue')); const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue'));
const AddDialog = defineAsyncComponent(() => import('/@/views/norm/list/dialog.vue')); const AddDialog = defineAsyncComponent(() => import('/@/views/norm/list/dialog.vue'));
const DetailDialog = defineAsyncComponent(() => import('/@/views/norm/list/details.vue'));
const EditDialog = defineAsyncComponent(() => import('/@/views/norm/list/edit.vue')); const EditDialog = defineAsyncComponent(() => import('/@/views/norm/list/edit.vue'));
const ImporDialog = defineAsyncComponent(() => import('/@/views/norm/list/impor.vue')); const ImporDialog = defineAsyncComponent(() => import('/@/views/norm/list/impor.vue'));
const router = useRouter(); const router = useRouter();
...@@ -146,7 +144,7 @@ onMounted(() => { ...@@ -146,7 +144,7 @@ onMounted(() => {
} }
getList() getList()
getTaskList() getTaskList()
state.tableHeight = getCurrentInstance().refs.pageMain.offsetHeight - 80 - 52 + "px"; state.tableHeight = getCurrentInstance().refs.pageMain.offsetHeight - 100 - 52 + "px";
}); });
const searchChange = () => { const searchChange = () => {
...@@ -232,9 +230,11 @@ const release= () => { ...@@ -232,9 +230,11 @@ const release= () => {
AddDialogRef.value.openDialog(); AddDialogRef.value.openDialog();
} }
// 详情弹窗 // 详情信息
const details= (norm_id) => { const details= (id) => {
DetailDialogRef.value.openDialog(norm_id); router.push({
path: '/norm/list/details',query: {norm_id:id}
});
} }
// 编辑弹窗 // 编辑弹窗
...@@ -292,6 +292,6 @@ const multipleExports= () => { ...@@ -292,6 +292,6 @@ const multipleExports= () => {
<style lang="scss" scoped> <style lang="scss" scoped>
.page-main { .page-main {
height: calc(100vh - 50px - 106px); height: calc(100vh - 50px - 126px);
} }
</style> </style>
src/views/norm/list/whole.vue 0 → 100644
<template>
<div class="system-menu-container">
<div class="breadcrumb-box">
<Breadcrumb />
</div>
<div class="header-search flex space-between">
<div>
<el-page-header @back="backToPreviousPage">
</el-page-header>
</div>
</div>
<div class="page-main" ref="pageMain" v-loading="state.loading">
<el-card shadow="hover">
<el-table :data="state.tableData" border style="width: 100%" :height="state.tableHeight"
ref="multipleTableRef">
<el-table-column v-for="column in state.columns" :key="column.prop" :label="column.label" :prop="column.prop" :width="column.width" show-overflow-tooltip align="center">
<template #default="scope">
<span style="color:#409EFF" v-if="column.label =='用户名称'">{{scope.row[column.prop]}}</span>
<span style="color:#909399" v-else-if="column.label =='领取状态' && scope.row[column.prop] ==1">已领取</span>
<span style="color:#E6A23C" v-else-if="column.label =='完成状态' && scope.row[column.prop] ==0">未完成</span>
<span style="color:#409EFF" v-else-if="column.label =='完成状态' && scope.row[column.prop] ==1">已完成</span>
<span v-else>{{scope.row[column.prop]}}</span>
</template>
</el-table-column>
</el-table>
</el-card>
</div>
</div>
</template>
<script setup name="systemRoleDialog">
import { normApi } from '/@/api/norm'
import { ElMessage } from 'element-plus';
import { toolsApi } from '/@/api/tools'
const Breadcrumb = defineAsyncComponent(() => import('/@/layout/navBars/breadcrumb/breadcrumb.vue'));
const router = useRouter();
// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
// 定义变量内容
const dialogFormRef = ref();
const state = reactive({
userId: null,
index:0,
userIndex:0,
apiData: {
id:'',
},
rules: {
},
dialog: {
isShowDialog: false,
title: '',
submitTxt: '',
},
tableData:[
],
columns:[
],
collectsTableData:[],
collectsColumns:[],
dataLoading: false,
btnLoading: false,
// 填写内容及自定义文本框
formItem: {
addItem:{
name:'',
level:'',
sort:'',
refer:'',
price:'',
task_id:'',
},
dynamicItem: [
//默认显示一条
// {
// name: '',
// value:''
// }
],
userFilled: [
//默认显示一条
// {
// name: '',
// radio:'1',
// }
]
}
});
// 打开弹窗
const getInfo = () => {
normApi().normDetail(state.apiData).then(res => {
let addItem = res.data.addItem;
let custom = res.data.custom;
// 数据详情
state.formItem.addItem.name = addItem.name;
state.formItem.addItem.level = addItem.level;
state.formItem.addItem.sort = addItem.sort+'';
state.formItem.addItem.refer = addItem.refer;
state.formItem.addItem.price =addItem.price;
state.formItem.addItem.task_id= addItem.task_id
state.formItem.addItem.guide= addItem.guide
state.userIndex = 0;
state.index = 0;
custom.forEach(item => {
if(item.user_filled==1){
state.formItem.userFilled.push({name:item.extend_name,radio:item.required+"",remarks:item.extend_remarks});
state.userIndex++
}else{
state.formItem.dynamicItem.push({name:item.extend_name,value:item.extend_value});
state.index++
}
});
//领取列表
let receivesList = res.data.receivesList
if(receivesList){
let arr = [
{ label:'序号', prop: 'index',width:'80px'},
// { label:'ID', prop: 'id'},
{ label:'用户名称', prop: 'userInfo.name',width:120},
{ label:'任务名称', prop: 'task_info.name',width:180},
{ label:'指标名称', prop: 'norm_list_info.name',width:180},
];
state.columns = arr;
receivesList.forEach(function(item, index, arr) {
let list = {
'index': index+1,
// 'id':item.id,
'userInfo.name': item.userInfo.name,
'task_info.name': item.task_info.name,
'norm_list_info.name': item.norm_list_info.name,
'receives_status': item.receives_status,
'completion_status': item.completion_status,
'not_collectible_remarks': item.not_collectible_remarks?item.not_collectible_remarks:"是",
}
state.tableData.push(list);
item.norm_list_extend.forEach(function(items, indexs, arrs) {
if(state.columns.length>0){
state.columns.forEach(function(itemss, indexss, arrss) {
let vlues = state.columns.map(itemsss => itemsss.prop).indexOf('extend_value'+indexs)
if(vlues== -1){
state.columns.push( { label: items.extend_name, prop: 'extend_value'+indexs,width:180 })
}
});
}else{
state.columns.push( { label: items.extend_name, prop: 'extend_value'+indexs,width:180 })
}
list['extend_value'+indexs] =items.extend_value;
});
});
state.columns.push( { label: '领取状态', prop:'receives_status',width:100 })
state.columns.push( { label: '完成状态', prop:'completion_status',width:100 })
state.columns.push( { label: '是否可采集', prop:'not_collectible_remarks',width:200 })
}
}).catch(() => {
})
};
// 关闭弹窗
const closeDialog = () => {
dialogFormRef.value.resetFields();
state.dialog.isShowDialog = false;
};
// 暴露变量
defineExpose({
});
onMounted(() => {
if(router.currentRoute.value.query.norm_id){
state.apiData.id = router.currentRoute.value.query.norm_id
// state.isHide = true // 如果有任务ID才允许发布
getInfo()
}else{
router.go(-1);
}
state.tableHeight = getCurrentInstance().refs.pageMain.offsetHeight - 50 - 22 + "px";
});
</script>
<style scoped lang="scss">
.page-main {
height: calc(100vh - 50px - 116px);
}
.norm_title{
font-weight:bold;color: #409EFF;
}
.box_info{
margin-bottom: 20px;
}
.box_title{
// color: #409EFF;
font-weight: 600;
}
.custom_a{
text-decoration: none !important;
float: left;
}
</style>
\ No newline at end of file
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