Commit fc11f9eb authored by renjintao's avatar renjintao

importcenter

parent 0e178557
<template>
<div>
<Input v-model="newName" placeholder="请选择上传文件" disabled>
<Button v-if="view" icon="md-download" slot="prepend" @click="downFile(newName)"> </Button>
<Button type="primary" icon="ios-cloud-upload-outline" slot="append" @click="handler">上传</Button>
</Input>
<Upload
v-model="name"
:action="postUrl"
:on-success="uploadSuccess"
:on-error="uploadError"
:on-remove="removeFile"
:format="formatList"
:max-size="maxSize"
:on-exceeded-size="onExceededSize"
:on-format-error="onFormatError"
:show-upload-list="false"
:files="files"
:on-progress="onProgress"
>
<Button v-show="1==2" type="primary" ref="upload">上传</Button>
</Upload>
<Progress :percent="per" :stroke-width="5" v-show="vshowPro" />
</div>
</template>
<script>
import util from "@/libs/util";
export default {
name: "inputExcel",
model: {
prop: "value",
event: "on-change"
},
data() {
return {
file: null,
name: this.value,
downUrl: fileUrlDown,
fileUrlPath: "",
nameList: [],
postUrl:
fileUrl +
"/upload/?token=Bearer " +
util.cookies.get("token") +
"&" +
this.parms,
formatList: ["xlsx", "xls"],
newName: "",
newPath: "",
per: 0,
vshowPro: false
};
},
created() {},
props: {
value: [String, Number, Array, Object],
maxSize: {
type: Number,
default: 10240
},
files: {
type: Boolean,
default: false
},
parms: {
type: String,
default: ""
},
showButton: {
type: Boolean,
default: true
}
},
methods: {
onProgress(event, file, fileList) {
this.per = 0;
this.vshowPro = true;
},
handler() {
this.$refs.upload.$el.click();
},
// change(event) {
// this.$emit('on-change', event.target.value)
// },
//上传成功文件
uploadSuccess(response, file, fileList) {
this.per = 60;
this.vshowPro = true;
const hbaseFileList = [];
const filesList = [];
if (file.response.status == 0) {
let objImag = {};
objImag.fileName = file.response.data.fileName;
objImag.filePath = file.response.data.downloadPath;
filesList.push(objImag);
this.newName = file.response.data.fileName;
this.newPath = file.response.data.downloadPath;
this.$emit("on-change", JSON.stringify(filesList));
this.per = 100;
setTimeout(() => {
this.per = 0;
this.vshowPro = false;
}, 2000);
} else {
this.$Message.error("上传失败,请重新上传!");
}
},
//上传文件失败
uploadError(response, file, fileList) {
this.$Message.error("上传失败,请重新上传!");
},
//文件大小验证返回
onExceededSize(file, fileList) {
if (Object.keys(file).length == 0) {
this.$Message.error(
"上传文件不能大于" + this.maxSize + "k,请重新上传!"
);
}
},
//文件格式验证
onFormatError(file, fileList) {
if (Object.keys(file).length == 0) {
this.$Message.error("上传文件格式不正确,请重新上传!");
}
},
//删除上传
removeFile(file, fileList) {},
formatL() {
if (this.files) {
this.formatList = [
"pdf",
"docx",
"doc",
"xls",
"xlsx",
"txt",
"png",
"jpg",
"gif",
"zip",
"rar"
];
}
return this.formatList;
},
downFile(path) {
let truePath = path.trim();
if (truePath.length > 2) {
if (
truePath.substring(0, 7).toLowerCase() == "http://" ||
truePath.substring(0, 8).toLowerCase() == "https://"
) {
window.open(truePath, "_blank");
} else {
this.fileUrlPath = this.downUrl + path;
window.open(this.fileUrlPath, "_blank");
}
}
}
},
mounted() {
this.formatL();
},
computed: {
nativeInputValue() {
return this.value === null || this.value === undefined ? "" : this.value;
},
view(){
return true
}
},
watch: {
value(v) {
this.name = v;
}
}
};
</script>
<style lang="less">
</style>
\ No newline at end of file
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
</Col> </Col>
<Col :span="24"> <Col :span="24">
<FormItem :label="l('file')" prop="file"> <FormItem :label="l('file')" prop="file">
<files ref="refFile" :parms="parms" files/> <InputExcel v-model="imgName" :parms="parms" :showButton="false" />
</FormItem> </FormItem>
</Col> </Col>
<Col :span="24"> <Col :span="24">
...@@ -26,24 +26,26 @@ ...@@ -26,24 +26,26 @@
</template> </template>
<script> <script>
import Api from "./api"; import Api from "./api";
import InputExcel from "@/components/page/inputExcel.vue";
export default { export default {
name: "Add", name: "Add",
components: {
InputExcel
},
data() { data() {
return { return {
disabled: false, disabled: false,
parms: { parms: "app=import&eid="+this.$u.guid()+"&name=excel",
app: 'import', imgName: "",
eid: this.$u.guid(),
name: '',
field: ''
},
entity: { entity: {
name: "", name: "",
file: "", file: "",
filePath:"",
remark: "", remark: "",
}, },
rules: { rules: {
name: [{ required: true, message: "必填", trigger: "blur" }], name: [{ required: true, message: "必填", trigger: "blur" }],
file:[{ required: true, message: "请上传文件", trigger: "change" }]
}, },
}; };
}, },
...@@ -58,7 +60,6 @@ export default { ...@@ -58,7 +60,6 @@ export default {
}, },
methods: { methods: {
handleSubmit() { handleSubmit() {
alert(JSON.stringify(this.$refs.refFile.nameList))
this.$refs.form.validate((v) => { this.$refs.form.validate((v) => {
if (v) { if (v) {
this.disabled = true; this.disabled = true;
...@@ -100,6 +101,11 @@ export default { ...@@ -100,6 +101,11 @@ export default {
}, },
}, },
watch: { watch: {
imgName(newName, oldName) {
const imgPathsArr = JSON.parse(newName);
this.entity.file=imgPathsArr[0].fileName
this.entity.filePath=imgPathsArr[0].filePath
},
v() { v() {
this.entity = this.$u.clone(this.v); this.entity = this.$u.clone(this.v);
}, },
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<Row> <Row>
<Filed :span="12" :name="l('name')">{{entity.name}}</Filed> <Filed :span="12" :name="l('name')">{{entity.name}}</Filed>
<Filed :span="12" :name="l('file')">{{entity.file}}</Filed> <Filed :span="12" :name="l('file')"><a @click="downFile(entity.filePath)">{{entity.file}}</a></Filed>
<Filed :span="12" :name="l('status')">{{entity.status}}</Filed> <Filed :span="12" :name="l('status')">{{entity.status}}</Filed>
<Filed :span="24" :name="l('remark')">{{entity.remark}}</Filed> <Filed :span="24" :name="l('remark')">{{entity.remark}}</Filed>
<Filed :span="12" :name="l('creationTime')">{{entity.creationTime}}</Filed> <Filed :span="12" :name="l('creationTime')">{{entity.creationTime}}</Filed>
...@@ -25,6 +25,8 @@ export default { ...@@ -25,6 +25,8 @@ export default {
data() { data() {
return { return {
entity: {}, entity: {},
downUrl: fileUrlDown,
fileUrlPath: "",
rules: { rules: {
name: [{ required: true, message: "必填", trigger: "blur" }], name: [{ required: true, message: "必填", trigger: "blur" }],
code: [{ required: true, message: "必填", trigger: "blur" }], code: [{ required: true, message: "必填", trigger: "blur" }],
...@@ -49,6 +51,21 @@ export default { ...@@ -49,6 +51,21 @@ export default {
handleClose() { handleClose() {
this.$emit("on-close"); this.$emit("on-close");
}, },
downFile(path) {
alert(path)
let truePath = path.trim();
if (truePath.length > 2) {
if (
truePath.substring(0, 7).toLowerCase() == "http://" ||
truePath.substring(0, 8).toLowerCase() == "https://"
) {
window.open(truePath, "_blank");
} else {
this.fileUrlPath = this.downUrl + path;
window.open(this.fileUrlPath, "_blank");
}
}
},
l(key) { l(key) {
key = "import_center" + "." + key; key = "import_center" + "." + key;
return this.$t(key); return this.$t(key);
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<Button type="primary" @click="add">新增</Button> <Button type="primary" @click="add">新增</Button>
</template> </template>
</DataGrid> </DataGrid>
<Modal v-model="modal" :title="title" width="1200" footer-hide> <Modal v-model="modal" :title="title" width="1200" :fullscreen="full" footer-hide>
<component :is="detail" :eid="curId" @on-close="cancel" @on-ok="ok" /> <component :is="detail" :eid="curId" @on-close="cancel" @on-ok="ok" />
</Modal> </Modal>
</div> </div>
...@@ -43,6 +43,7 @@ export default { ...@@ -43,6 +43,7 @@ export default {
keys: { op: "name", value: null }, keys: { op: "name", value: null },
}, },
modal: false, modal: false,
full:false,
title: "新增", title: "新增",
detail: null, detail: null,
curId: 0, curId: 0,
...@@ -149,21 +150,20 @@ export default { ...@@ -149,21 +150,20 @@ export default {
}, },
"查看" "查看"
), ),
//h('op', { attrs: { oprate: 'copy' }, on: { click: () => this.copy(params.row.id) } }, '克隆'),
// h(
// "op",
// {
// attrs: { oprate: "edit" },
// on: { click: () => this.edit(params.row.id) },
// },
// "编辑"
// ),
h( h(
"op", "op",
{ {
attrs: { oprate: "delete" }, attrs: { oprate: "delete" },
on: { click: () => this.remove(params.row.id) }, on: { click: () => this.remove(params.row.id) },
}, },
"删除"
),
h(
"op",
{
attrs: { oprate: "edit" },
on: { click: () => this.process(params.row.id) },
},
"处理" "处理"
), ),
]); ]);
...@@ -189,6 +189,7 @@ export default { ...@@ -189,6 +189,7 @@ export default {
}, },
add() { add() {
this.curId = 0; this.curId = 0;
this.full=false;
this.title = "新增"; this.title = "新增";
this.detail = () => import("./add"); this.detail = () => import("./add");
this.modal = true; this.modal = true;
...@@ -202,15 +203,24 @@ export default { ...@@ -202,15 +203,24 @@ export default {
view(id) { view(id) {
this.curId = id; this.curId = id;
this.title = "详情"; this.title = "详情";
this.full=false;
this.detail = () => import("./detail"); this.detail = () => import("./detail");
this.modal = true; this.modal = true;
}, },
edit(id) { edit(id) {
this.curId = id; this.curId = id;
this.title = "编辑"; this.title = "编辑";
this.full=false;
this.detail = () => import("./edit"); this.detail = () => import("./edit");
this.modal = true; this.modal = true;
}, },
process(id) {
this.curId = id;
this.title = "处理";
this.full=true;
this.detail = () => import("./process");
this.modal = true;
},
remove(id) { remove(id) {
Api.delete(id).then((r) => { Api.delete(id).then((r) => {
if (r.success) { if (r.success) {
......
<template>
<div class="content">
<Upload action :before-upload="beforeUpload" ref="uploadfile" :format="formatList">
<Button icon="ios-cloud-upload-outline">重新上传</Button>
</Upload>
<DataGrid
border
:height="tdHeightExcel"
:columns="columnsImport"
:data="excelData"
:tool="false"
:page="false"
:set="false"
></DataGrid>
<p class="tr pt10">
<span v-if="excelData.length>0">{{excelData.length}} 条数据</span>
<Button @click="cancelExcel">取消</Button>
<Button type="primary">确定导入</Button>
</p>
</div>
</template>
<script>
import Api from "./api";
import XLSX from "xlsx";
export default {
name: "Edit",
data() {
return {
disabled: false,
columns: [
// {
// title: '序号',
// type: 'index',
// width: 80,
// align: 'center'
// },
{ key: "id", title: this.l("id"), hide: true, align: "left" },
{
key: "userName",
title: this.l("userName"),
align: "left",
easy: true,
high: true,
render: (h, params) => {
return h("div", { class: "action" }, [
h(
"op",
{
attrs: { oprate: "detail" },
on: { click: () => this.detail(params.row.id) },
},
params.row.userName
),
]);
},
},
// {
// key: 'cardTypeId',
// title: this.l('cardTypeId'),
// align: 'left',
// high: true,
// hide: true
// },
{
key: "cardNo",
title: this.l("cardNo"),
align: "left",
easy: true,
high: true,
},
{
key: "gender",
title: this.l("gender"),
align: "center",
high: true,
code: "User.base.gender",
},
{
key: "birthday",
title: this.l("birthday"),
align: "center",
high: true,
type: "date",
},
{
key: "degreeId",
title: this.l("degreeId"),
align: "left",
high: true,
code: "User.base.degree",
},
{
key: "status",
title: this.l("status"),
align: "center",
high: true,
code: "User.base.status",
},
{
key: "departmentId",
title: this.l("departmentId"),
align: "right",
easy: true,
high: true,
},
{
key: "departmentTitle",
title: this.l("departmentTitle"),
align: "left",
easy: true,
high: true,
},
{
key: "roleTitles",
title: this.l("roleTitles"),
align: "left",
easy: true,
high: true,
hide: true,
render: (h, params) => {
return h("div", { class: "action" }, [
h(
"op",
{
attrs: {
oprate: "detail",
class:
params.row.roleTitles == null ||
params.row.roleTitles == ""
? "empower"
: "detail",
},
on: { click: () => this.authorize(params.row.id) },
},
params.row.roleTitles == null || params.row.roleTitles == ""
? "授权"
: params.row.roleTitles
),
]);
},
},
{
key: "accountId",
title: this.l("accountId"),
hide: true,
align: "left",
},
// {
// key: 'userType',
// title: this.l('userType'),
// hide: true,
// align: 'left'
// },
{
key: "phone",
title: this.l("phone"),
align: "left",
easy: true,
high: true,
},
{
key: "email",
title: this.l("email"),
align: "left",
easy: true,
high: true,
},
{
key: "licensedToWork",
title: this.l("licensedToWork"),
align: "left",
},
{
key: "positionId",
title: this.l("positionId"),
align: "left",
high: true,
code: "User.base.position",
},
{
key: "titleId",
title: this.l("titleId"),
align: "left",
high: true,
code: "User.base.jobtitle",
},
{
key: "creatorUserId",
title: this.l("creatorUserId"),
align: "left",
import: false,
hide: true,
},
{
key: "creationTime",
title: this.l("creationTime"),
align: "left",
import: false,
hide: true,
},
{
key: "lastModifierUserId",
title: this.l("lastModifierUserId"),
align: "left",
import: false,
hide: true,
},
{
key: "lastModificationTime",
title: this.l("lastModificationTime"),
align: "left",
import: false,
hide: true,
},
{
title: "操作",
key: "action",
width: 180,
align: "right",
import: false,
render: (h, params) => {
return h("div", { class: "action" }, [
h(
"op",
{
attrs: {
oprate: "detail",
class: "empower",
},
on: { click: () => this.syncAccount(params.row) },
},
params.row.accountId == 0 ? "同步" : ""
),
h(
"op",
{
attrs: { oprate: "edit" },
on: { click: () => this.edit(params.row.id) },
},
"编辑"
),
h(
"op",
{
attrs: { oprate: "remove" },
on: { click: () => this.remove(params.row) },
},
"删除"
),
h(
"op",
{
attrs: {
oprate: "detail",
},
on: { click: () => this.openReset(params.row) },
},
"重置密码"
),
]);
},
},
],
excelData: [],
formatList: ["xlsx"],
columnsImport: [],
departArr: [], //部门list
};
},
props: {
eid: Number,
},
created() {
this.tdHeightExcel = window.innerHeight - 240;
//导出对列表头进行预加载start
let tempCol = this.$u.clone(this.columns);
tempCol.forEach((ele, index) => {
if (ele.key == "action") {
ele.hide = true;
}
});
this.columnsImport = tempCol;
this.$api.get(`${systemUrl}/Department/GetDepartments`).then((r) => {
this.departArr = r.result.items;
});
//导出对列表头进行预加载end
},
mounted() {
window.onresize = () => {
///浏览器窗口大小变化
return (() => {
window.screenHeight = window.innerHeight;
this.tdHeightExcel = window.innerHeight - 240;
})();
};
},
methods: {
load(v) {
Api.get({ id: v }).then((r) => {
this.entity = r.result;
});
},
handleSubmit() {
this.$refs.form.validate((v) => {
if (v) {
this.disabled = true;
Api.update(this.entity)
.then((r) => {
this.disabled = false;
if (r.success) {
this.$Message.success("保存成功");
this.$emit("on-ok");
} else {
this.$Message.error("保存失败");
}
})
.catch((err) => {
this.disabled = false;
this.$Message.error("保存失败");
console.warn(err);
});
}
});
},
//导入excel文件
async beforeUpload(file) {
this.excelData = [];
this.$refs.uploadfile.clearFiles(); //清除上一次上传文件列表
var tempColums = this.$u.clone(this.columnsImport);
const workbook = await this.$u.readXLSX(file);
const sheet2JSONOpts = {
defval: "", //给defval赋值为空的字符串
};
var csv = XLSX.utils.sheet_to_csv(
workbook.Sheets[workbook.SheetNames[0]],
sheet2JSONOpts
);
var lines = csv.split("\n"); //第一行标题
var headers = lines[0].split(",");
var arrTi = [];
//转换到colum后的list表头start
headers.forEach((elHead) => {
tempColums.forEach((elCol) => {
if (elHead == elCol.title) {
//elHead=elCol.key
arrTi.push(elCol.key);
}
});
});
headers = arrTi;
//转换到colum后的list表头end
var result = [];
for (var i = 1; i < lines.length - 1; i++) {
var obj = {};
var currentline = lines[i].split(",");
for (var j = 0; j < headers.length; j++) {
obj[headers[j]] = currentline[j];
}
result.push(obj);
}
//对读取的excel文件数据进行处理
var arrTitleUse = []; //使用数据字典的字段
tempColums.forEach((elCode) => {
if (elCode.code) {
arrTitleUse.push({ key: elCode.key, code: elCode.code });
}
});
result.forEach((ele) => {
//如果导入文件没有departmentid,但存在departmentTitle的话,通过title获取id
if (
ele.departmentTitle &&
ele.departmentTitle != "" &&
(!ele.departmentId || ele.departmentId == "")
) {
this.departArr.forEach((e) => {
if (ele.departmentTitle && ele.departmentTitle == e.name) {
ele.departmentId = e.id;
}
});
} else if (
//如果导入文件没有departmentTitle,但存在departmentid的话,通过id获取departmentTitle
ele.departmentId &&
ele.departmentId + "" != "" &&
(!ele.departmentTitle || ele.departmentTitle == "")
) {
this.departArr.forEach((e) => {
if (ele.departmentId && ele.departmentId == e.id) {
ele.departmentTitle = e.name;
}
});
}
//对列表里的数据字典项进行处理
arrTitleUse.forEach((elem) => {
if (ele[elem.key] && ele[elem.key] != "" && ele[elem.key] != null) {
//如果数据字典项对应的DirName字段存在,通过name查询到对应的code,然后赋值
ele[elem.key] = this.$u.dirCode(
this.$store.getters.dictionaryByKey(elem.code),
ele[elem.key]
);
}
});
});
this.excelData = result;
//console.log(workbook);
return false;
},
handleClose() {
this.$emit("on-close");
},
cancelExcel() {
this.excelData = [];
this.$refs.uploadfile.clearFiles();
this.$emit("on-close");
},
l(key) {
key = "user" + "." + key;
return this.$t(key);
},
},
watch: {
eid(v) {
if (v != 0) {
this.load(v);
}
},
},
};
</script>
...@@ -69,6 +69,7 @@ import VueEditor from "vue2-editor" ...@@ -69,6 +69,7 @@ import VueEditor from "vue2-editor"
import echarts from 'echarts' import echarts from 'echarts'
import XLSX from 'xlsx' import XLSX from 'xlsx'
Vue.use(XLSX) Vue.use(XLSX)
// Vue.use(FormMaking, { // Vue.use(FormMaking, {
......
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