Skip to content

K
klck
Commit d747c56f authored by xiangjiaojunxp's avatar xiangjiaojunxp
Browse files
Options

页面修改

parent 90115373
Hide whitespace changes
Inline Side-by-side
Showing with 69 additions and 138 deletions
ruoyi-ui/public/index.html
View file @ d747c56f
......@@ -216,7 +216,7 @@
<style>
.el-dialog__header{
padding:20px 20px 10px;
background-color: #b8d1fb;
background-color: dodgerblue;
}
.el-dialog__headerbtn .el-dialog__close {
color: #f5f8ff;
......
ruoyi-ui/src/views/system/supplies/index.vue
View file @ d747c56f
......@@ -2,22 +2,16 @@
<div class="app-container">
<el-form ref="queryForm" size="small" :inline="true" label-width="68px">
<el-form-item label="模板" prop="name">
<el-select v-model="selectedOption" size="mini" @change="handleOptionChange" placeholder="请选择你要查看的模板" >
<!-- <el-option label="自设的模板名" value="这里是Excel表内容"></el-option>-->
<el-select v-model="selectedOption" ref="mySelect" size="mini" @change="handleOptionChange" placeholder="请选择你要查看的模板" >
<!-- <el-option label="自设的模板名" value="使用空白模板"></el-option>-->
<el-option
v-for="item in depss"
:key="item.id"
:label="item.name"
:value="item.id"
>
v-for="item in depss" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<!--<el-button type="primary" icon="el-icon-search" size="mini" >搜索</el-button> -->
<!--<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
<!--<el-button type="primary" icon="el-icon-search" size="mini" >搜索</el-button>-->
<el-button icon="el-icon-refresh" size="mini">重置</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
......@@ -41,27 +35,25 @@
v-hasPermi="['ruoyi-myexcel:myexcel:export']"
>导出</el-button>
</el-col>
<el-col :span="1.5">
<el-upload
type="file"
name="file"
ref="upload"
:before-upload="handleFileChange"
action=''
:limit="1"
:file-list="fileList"
>
<el-button plain size="mini" icon="el-icon-upload2" type="primary">导入</el-button>
</el-upload>
</el-col>
<!-- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>-->
<el-col :span="1.5">
<el-upload
type="file"
name="file"
ref="upload"
:before-upload="handleFileChange"
action=''
:limit="1"
:file-list="fileList"
:disabled="disableNextButton"
>
<el-button plain size="mini" icon="el-icon-upload2" type="primary" :disabled="disableNextButton" >导入</el-button>
</el-upload>
</el-col>
</el-row>
<!-- luckysheet容器 -->
<!-- <div id="luckysheetContainer"></div>-->
<div
id="luckysheet"
style="margin: 0px; padding: 0px; position: absolute; width: 100%;height: 800px; left: 0px; top: 110px; bottom: 0px; z-index: 0"
style="margin: 0px; padding: 0px; position: absolute; width: 100%;height: 1000px; left: 0px; top: 110px; bottom: 0px; z-index: 0"
>
</div>
<!-- 用户添加或修改我的Excel表格的弹框 -->
......@@ -87,6 +79,7 @@
</div>
</template>
<script>
import $ from 'jquery'
/*安装插件 npm install xlsx，安装完成后引入 import XLSX from ‘xlsx’*/
......@@ -108,6 +101,7 @@ export default {
selectedOption:'',
luckysheetData: '',
fileList:[],
disableNextButton: true,
depss:[],
// 表单参数
form: {},
......@@ -142,7 +136,7 @@ export default {
getMyluckyexcel(this.selectedOption).then(response => {
const sysSupplies = response.data;
this.disableNextButton = this.selectedOption === '';
this.luckysheetData = sysSupplies.jsons;
//将接收到的json存到json_data中
//const json_data = response.data;
......@@ -156,16 +150,11 @@ export default {
showinfobar: false, //是否显示顶部名称栏
lang:'zh',
});
}).catch(() => {
// 处理错误逻辑，这里是一个空的错误处理函数
this.$message.error('暂停失败,发生未知错误!');
this.$message.error('查询失败,发生未知错误!');
});
},
/** 导出设置 */
handleExport(){
exportExcel(luckysheet.getAllSheets(), '导出')
},
/** 弹出的确认框关闭 */
handleClose(done) {
this.$confirm('确认关闭？')
......@@ -208,38 +197,14 @@ export default {
}
},
/*// 表单重置
reset() {
this.form = {
id: null,
name: null,
description: null
};
this.resetForm("form");
},
/!** 搜索按钮操作 *!/
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/!** 重置按钮操作 *!/
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
//刷新下拉选框内容
this.selectedOption='';
this.disableNextButton='';
//刷新luckysheet表格
this.init();
},
/!** 导出按钮操作 *!/
handleExport() {
this.download('ruoyi-mymodule/mymodule/export', {
...this.queryParams
}, `mymodule_${new Date().getTime()}.xlsx`)
},*/
/** Luckyexcel文档 */
init() {
let options = {
......@@ -255,8 +220,8 @@ export default {
"status": 1, //激活状态
"order": 0, //工作表的下标
"hide": 0,//是否隐藏
"row": 20, //行数
"column": 15, //列数
"row": 8, //行数
"column": 10, //列数
"defaultRowHeight": 19, //自定义行高
"defaultColWidth": 73, //自定义列宽
"celldata": [
......@@ -301,82 +266,48 @@ export default {
luckysheet.create(options)
},
Excel(e) {
let that = this
// 错误情况判断
const files = e.target.files
if (files.length <= 0) {
return false;
} else if (!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())) {
this.$message({
message: "上传格式不正确，请上传xls或者xlsx格式",
type: "warning"
});
return false
} else {
that.upload_file = files[0].name
}
// 读取表格
const fileReader = new FileReader()
fileReader.onload = ev => {
try {
const data = ev.target.result;
const workbook = XLSX.read(data, {
type: "binary"
})
// 读取第一张表
const wsname = workbook.SheetNames[0]
const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname])
// 打印 ws 就可以看到读取出的表格数据
console.log(ws)
// 定义一个新数组，存放处理后的表格数据
that.lists = []
ws.forEach(item => {
that.lists.push({
// 对ws进行处理后放进lists内
})
})
// 调用方法将lists数组发送给后端
this.submit_form(that.lists)
} catch (e) {
return false
}
}
fileReader.readAsBinaryString(files[0])
},
/** 导入事件*/
handleFileChange(evt) {
let name = evt.name
let suffixArr = name.split('.'),
suffix = suffixArr[suffixArr.length - 1]
if (suffix != 'xlsx') {
alert('当前仅支持导入xlsx文件')
return
if (this.disableNextButton) {
this.$message.warning("请先选择模板再进行导入!");
return false; // 如果按钮被禁用，提前返回，避免执行下一步操作
}
LuckyExcel.transformExcelToLucky(
evt,
function(exportJson, luckysheetfile) {
if (exportJson.sheets == null || exportJson.sheets.length == 0) {
alert(
'无法读取excel文件的内容，目前不支持xls文件!'
)
return
let name = evt.name
let suffixArr = name.split('.'),
suffix = suffixArr[suffixArr.length - 1]
if (suffix != 'xlsx') {
this.$message({
message: "上传格式不正确，请上传xls或者xlsx格式",
type: "warning"
});
return
}
LuckyExcel.transformExcelToLucky(
evt,
function(exportJson, luckysheetfile) {
if (exportJson.sheets == null || exportJson.sheets.length == 0) {
this.$message({
message: "导入失败，请检查上传的文件是否正确",
type: "warning"
});
return
}
luckysheet.destroy()
luckysheet.create({
container: 'luckysheet', //luckysheet is the container id
title: exportJson.info.name,
lang: 'zh', // 设定表格语言
showinfobar: false,
data: exportJson.sheets,
userInfo: exportJson.info.name.creator
})
}
)
luckysheet.destroy()
luckysheet.create({
container: 'luckysheet', //luckysheet is the container id
title: exportJson.info.name,
lang: 'zh', // 设定表格语言
showinfobar: false,
data: exportJson.sheets,
userInfo: exportJson.info.name.creator
})
}
)
},
/** 导出设置 */
handleExport(){
exportExcel(luckysheet.getAllSheets(), this.from_name)
},
}
// 配置项
......
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