309 lines
12 KiB
HTML
309 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0, user-scalable=0">
|
||
<title>数据转换工具模块</title>
|
||
<script src="./lib/jquery/dist/jquery.js"></script>
|
||
<script src="./lib/vuejs/vue.js"></script>
|
||
<script src="./lib/vuejs/axios.min.js"></script>
|
||
<script src="./lib/elementui/index.js"></script>
|
||
<!--<script src="./lib/linq.js/Content/Scripts/linq.min.js"></script>-->
|
||
<script src="Scripts/linq.js"></script>
|
||
<link href="./lib/elementui/index.css" rel="stylesheet" />
|
||
</head>
|
||
<body>
|
||
<div id="app" >
|
||
<el-container>
|
||
<el-header>数据转换工具</el-header>
|
||
<el-main v-loading="loading" v-loading.fullscreen.lock="false" :element-loading-text="showLoadingTip"
|
||
element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.1)">
|
||
|
||
<el-row>
|
||
<el-form :inline="false" class="demo-form-inline" label-width="100px" size="small" style=" box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); padding-top: 20px">
|
||
|
||
<el-form-item>
|
||
数据表格选择
|
||
<el-upload
|
||
class="upload-demo"
|
||
action="/shujuzhuanhuan/upload"
|
||
:on-success="handleSuccess"
|
||
:on-error="handleError"
|
||
:before-upload="beforeUpload"
|
||
>
|
||
<el-button size="small" type="primary">点击上传</el-button>
|
||
</el-upload>
|
||
|
||
|
||
<!-- <el-upload-->
|
||
<!-- class="upload-demo"-->
|
||
<!-- ref="upload"-->
|
||
<!-- action="/shujuzhuanhuan/upload"-->
|
||
<!-- :on-preview="handlePreview"-->
|
||
<!-- :on-remove="handleRemove"-->
|
||
<!-- :file-list="fileList"-->
|
||
<!-- :auto-upload="true">-->
|
||
<!-- <el-button slot="trigger" size="small" type="primary">选取文件</el-button>-->
|
||
<!-- <el-button style="margin-left: 10px;" size="small" type="success">上传到服务器</el-button>-->
|
||
<!-- <div slot="tip" class="el-upload__tip">只能上传xls/xlsx/csv文件，且不超过5000kb</div>-->
|
||
<!-- </el-upload>-->
|
||
|
||
</el-form-item>
|
||
<el-form-item>
|
||
任务年份
|
||
<el-select v-model="uploaddata.rwnf" placeholder="请选择" >
|
||
<el-option style=" width: 100%"
|
||
v-for="item in [2020,2021,2022,2023]"
|
||
:key="item"
|
||
:label="item"
|
||
:value="item"
|
||
:change="changeShiJian()">
|
||
</el-option>
|
||
</el-select>
|
||
|
||
|
||
</el-form-item>
|
||
<el-form-item>
|
||
开始时间
|
||
<el-input v-model="uploaddata.kaishishijian" placeholder="请输入开始时间"></el-input>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
结束时间
|
||
<el-input v-model="uploaddata.jieshushijian" placeholder="请输入结束时间"></el-input>
|
||
</el-form-item>
|
||
<el-form-item :inline="true">
|
||
数据集类型
|
||
<!-- <el-input v-model="strSWMC.source" placeholder="请选择数据集类型"></el-input>-->
|
||
<el-select v-model="uploaddata.shujujileixing" placeholder="请选择" >
|
||
<el-option style=" width: 100%"
|
||
v-for="item in ShuJuJiList"
|
||
:key="item"
|
||
:label="item"
|
||
:value="item"
|
||
:change="changeBiaoJi()">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item :inline="true">
|
||
数据集标记
|
||
<el-input v-model="uploaddata.shujujibiaoji" placeholder="请选择数据集标记"></el-input>
|
||
</el-form-item>
|
||
<el-form-item :inline="true">
|
||
数据集中文名
|
||
<el-input v-model="uploaddata.shujujizhongwenming" placeholder="请选择数据集中文名"></el-input>
|
||
</el-form-item>
|
||
|
||
<el-form-item>
|
||
<el-button type="primary" :loading="btnLoading[0]" round @click="DealFileData">数据转换并导入</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</el-row>
|
||
|
||
<el-row>
|
||
<el-input type="textarea"
|
||
:rows="10"
|
||
placeholder="数据导入操作状态提示"
|
||
v-model="textarea">
|
||
</el-input>
|
||
</el-row>
|
||
</el-main>
|
||
<el-footer>
|
||
|
||
</el-footer>
|
||
</el-container>
|
||
|
||
|
||
</div>
|
||
</body>
|
||
</html>
|
||
|
||
<script>
|
||
///////////////////////////////////////////////////
|
||
//该部分是Vue应用封装
|
||
var app = new Vue({
|
||
el: '#app',
|
||
data() {
|
||
return {
|
||
|
||
//提示内容显示
|
||
textarea: "",
|
||
//等待提示
|
||
loading: false,
|
||
btnLoading: [false, false, false, false, false, false, false, false, false, false, false, false],
|
||
//正在进行实时更新替换, 大约需要30秒钟至几分钟不等, 请等待...
|
||
showLoadingTip: '系统正在操作中,请耐心的等待...',
|
||
//strSWMC: {source:'',dest:''},
|
||
fileList:[],
|
||
ShuJuJiList:['老的不良反应','国抽_抽检监测','国抽_风险监测','国抽_监督抽检','国抽_评价性抽检'],
|
||
//上传的格式设置
|
||
uploaddata:{rwnf:'',kaishishijian:'',jieshushijian:'',shujujileixing:'',shujujibiaoji:'',shujujizhongwenming:''},
|
||
//字典设置内容;
|
||
shujujiDict:[
|
||
'LB','GC_CJJC','GC_FXJC','GC_JDCJ','GC_PJXCJ'
|
||
]
|
||
|
||
}
|
||
},
|
||
mounted() {
|
||
var _this = this; //this指向vue
|
||
Vue.prototype.$loading = this.loading
|
||
//_this.loading = true;
|
||
},
|
||
methods: {
|
||
|
||
//显示进度内容
|
||
addNote(str) {
|
||
var aData = new Date().toLocaleString();;
|
||
this.textarea = aData + " " + str + '\r\n' + this.textarea;
|
||
},
|
||
//显示提示信息
|
||
showTip(strmessage) {
|
||
this.$message({
|
||
message: strmessage,
|
||
type: 'warning'
|
||
});
|
||
},
|
||
|
||
handleSuccess(response, file, fileList) {
|
||
// 文件上传成功的处理逻辑
|
||
console.log('成功情况',response);
|
||
},
|
||
handleError(error, file, fileList) {
|
||
// 文件上传失败的处理逻辑
|
||
console.log('失败情况',error);
|
||
},
|
||
|
||
|
||
handlePreview(){},
|
||
handleRemove(){},
|
||
submitUpload(){
|
||
// axios.post('/excel/upload',{file:}).then(res=>{
|
||
//
|
||
// })
|
||
},
|
||
|
||
|
||
//改变时间操作
|
||
changeShiJian(){
|
||
console.log('xianshi',this.uploaddata);
|
||
this.uploaddata.kaishishijian=this.uploaddata.rwnf + '-1-1';
|
||
this.uploaddata.jieshushijian=this.uploaddata.rwnf + '-12-31';
|
||
},
|
||
//改变标记现实内容
|
||
changeBiaoJi(cindex){
|
||
console.log('biaoji',this.uploaddata);
|
||
console.log('cindex',cindex);
|
||
let curBiaoJi=this.uploaddata.rwnf+this.uploaddata.shujujileixing;
|
||
let curZhongWen=this.uploaddata.rwnf+this.uploaddata.shujujileixing;
|
||
|
||
this.uploaddata.shujujibiaoji=this.uploaddata.rwnf+this.uploaddata.shujujileixing;
|
||
this.uploaddata.shujujizhongwenming=this.uploaddata.rwnf+this.uploaddata.shujujileixing;
|
||
},
|
||
|
||
DealFileData(){
|
||
//先获取有多少条数据
|
||
|
||
//通过服务端一条条的导入，产生处理的效果
|
||
|
||
|
||
//最后提示完成操作
|
||
|
||
},
|
||
|
||
// //单个替换的操作,dict格式为{"source":"","dest":"","type":""}
|
||
// SingleChange(btnid, dict, apiname, desc) {
|
||
// var _this = this; //this指向vue
|
||
// _this.loading = true;
|
||
// _this.btnLoading[btnid] = true;
|
||
// _this.addNote("开始进行" + desc + "替换操作,请等待");
|
||
// var curUrl = "./strReplace/" + apiname + "?source=" + dict.source + "&dest=" + dict.dest;
|
||
// if (dict.type != "") {
|
||
// curUrl = curUrl + "&type=" + dict.type
|
||
// }
|
||
// (async () => {
|
||
// await axios({
|
||
// url: curUrl
|
||
// }).then((res) => {
|
||
// console.log(res);
|
||
// _this.addNote("此次" + desc + "替换操作完成," + res.data.data + "谢谢使用!");
|
||
// _this.loading = false;
|
||
// _this.btnLoading[btnid] = false;
|
||
// });
|
||
// })();
|
||
// },
|
||
// changeSWMC() {
|
||
// //先判断是不是填写了内容
|
||
// if (this.strSWMC.source == "" || this.strSWMC.dest == "") {
|
||
// this.showTip("请填写需要修改的食物名称!")
|
||
// //dLayer.msg('请填写需要修改的食物名称!');
|
||
// return;
|
||
// }
|
||
// var _this = this; //this指向vue
|
||
// _this.loading = true;
|
||
// _this.btnLoading[0] = true;
|
||
// _this.addNote("开始进行" + this.strSWMC.source + "导入操作,请等待");
|
||
// var curUrl = '/strreplace/ReplaceXFL_SWMC?source=' + this.strSWMC.source + '&dest=' + this.strSWMC.dest;
|
||
//
|
||
// (async () => {
|
||
// await axios({
|
||
// url: curUrl
|
||
// }).then((res) => {
|
||
// console.log(res);
|
||
// _this.addNote("此次[食物名称]导入操作完成," + res.data.data + "谢谢使用!");
|
||
// _this.loading = false;
|
||
// _this.btnLoading[0] = false;
|
||
// //增加日志20220921Add
|
||
// addlog("SQL查询", "数据导入操作")
|
||
// });
|
||
// })();
|
||
//
|
||
// }
|
||
|
||
}
|
||
})
|
||
///////////////////////////////////////////////////
|
||
|
||
|
||
//加上日志20211109
|
||
function addlog(otype, ocontent, ouser) {
|
||
var curUser = "";
|
||
if (sessionStorage['userName'] != null) {
|
||
curUser = sessionStorage['userName']
|
||
} else {
|
||
curUser = ouser
|
||
}
|
||
|
||
$.get("/operatelog/addlog?ouser=" + curUser + "&otype=" + otype + "&ocontent=" + ocontent.substring(0, 2500), {})
|
||
.then(function (e) { return true })
|
||
}
|
||
|
||
|
||
|
||
</script>
|
||
|
||
<style>
|
||
.el-header, .el-footer {
|
||
background-color: #B3C0D1;
|
||
color: #333;
|
||
text-align: center;
|
||
line-height: 60px;
|
||
}
|
||
|
||
|
||
.el-main {
|
||
background-color: #E9EEF3;
|
||
color: #333;
|
||
text-align: center;
|
||
line-height: 56px;
|
||
}
|
||
.el-button{
|
||
min-width:200px;
|
||
}
|
||
|
||
body > .el-container {
|
||
margin-bottom: 40px;
|
||
}
|
||
|
||
</style>
|