|
|
@@ -1,6 +1,14 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <div v-for="(item, index) in optionsExcel" :key="index">
|
|
|
+ <div class="flex-count">
|
|
|
+ <div class="flex-count-header">
|
|
|
+ <span>在线文档-文件管理</span>
|
|
|
+ <el-button type="primary" class="header-button" @click="clickSave"
|
|
|
+ >新建</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <Table @clickDemand="clickDemand" :list="lable" ref="TableList"> </Table>
|
|
|
+ <!-- <div v-for="(item, index) in optionsExcel" :key="index">
|
|
|
<div @click="clickSee(item)">{{ item.option.title }}</div>
|
|
|
</div>
|
|
|
<el-button @click="newExcle">新建</el-button>
|
|
|
@@ -16,132 +24,133 @@
|
|
|
left: 0px;
|
|
|
top: 0px;
|
|
|
"
|
|
|
- ></div>
|
|
|
+ ></div> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import axios from 'axios'
|
|
|
+import axios from "axios";
|
|
|
import luckyexcel from "luckyexcel";
|
|
|
+import Table from "../../../components/el-form.vue";
|
|
|
export default {
|
|
|
+ components: {
|
|
|
+ Table,
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
excelStatus: false,
|
|
|
optionsExcel: [],
|
|
|
ids: "",
|
|
|
+ lable: {
|
|
|
+ name: "first",
|
|
|
+ height: "650",
|
|
|
+ titledata: [
|
|
|
+ {
|
|
|
+ label: "名称",
|
|
|
+ prop: "needName",
|
|
|
+ width: 300,
|
|
|
+ color: "#0682CD",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "创建时间",
|
|
|
+ prop: "needType",
|
|
|
+ width: 200,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "创建科室",
|
|
|
+ prop: "applyDept",
|
|
|
+ width: 200,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "创建人",
|
|
|
+ prop: "applyDepartment",
|
|
|
+ width: 200,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "权限状态",
|
|
|
+ prop: "proposer",
|
|
|
+ width: 200,
|
|
|
+ },
|
|
|
+ ], //表格头
|
|
|
+ data: [], //内容数据
|
|
|
+ loading: true,
|
|
|
+ pageData: {
|
|
|
+ total: 100, // 总条数
|
|
|
+ pageSize: 10, // 每页数量
|
|
|
+ pageNum: 1, // 页码
|
|
|
+ },
|
|
|
+ isSelection: true, // 表格有多选时设置
|
|
|
+ isOperation: false, // 表格有操作列时设置
|
|
|
+ isIndex: false, // 列表序号
|
|
|
+ operation: {
|
|
|
+ // 表格有操作列时设置
|
|
|
+ label: "操作", // 列名
|
|
|
+ width: "50", // 根据实际情况给宽度
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ label: "操作", // 操作名称
|
|
|
+ type: "", //按钮类型
|
|
|
+ handleRow: (e, r, o) => {
|
|
|
+ // this.disabled = true;
|
|
|
+ // this.dialogTitle = "查看";
|
|
|
+ // if (r.taskName === "起草") {
|
|
|
+ // this.disabled = false;
|
|
|
+ // } else {
|
|
|
+ // this.disabled = true;
|
|
|
+ // }
|
|
|
+ // this.fromList = r;
|
|
|
+ // this.clickForm(r);
|
|
|
+ // this.getFromQuery(r);
|
|
|
+ // this.dialogStatus = true;
|
|
|
+ // setTimeout(() => {
|
|
|
+ // this.getBtnStatus(r);
|
|
|
+ // }, 500);
|
|
|
+ // this.formWorkId = r.id;
|
|
|
+ // this.formId = r.taskId;
|
|
|
+ // this.taskName = r.taskName;
|
|
|
+ // this.getQuery()
|
|
|
+ }, // 自定义事件
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ },
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
- console.log(window.location.protocol);
|
|
|
- console.log(window.location.host);
|
|
|
this.getAllExcel();
|
|
|
- // var options = {
|
|
|
- // container: "luckysheet", // 设定DOM容器的id
|
|
|
- // // title: "123123", // 设定表格名称
|
|
|
- // // lang: "zh",
|
|
|
- // // allowUpdate: true,
|
|
|
- // // localUrl:'123',
|
|
|
- // // loadUrl: window.location.protocol + localurl + "/load/${wb.id}",
|
|
|
- // // loadSheetUrl: window.location.protocol + localurl + "/loadSheet/${wb.id}",
|
|
|
- // // updateUrl:
|
|
|
- // // "ws://" +
|
|
|
- // // localurl +
|
|
|
- // // "/ws/" +
|
|
|
- // // Math.round(Math.random() * 100) +
|
|
|
- // // "/${wb.id}",
|
|
|
- // // 更多其他设置...
|
|
|
- // };
|
|
|
- // window.luckysheet.create({
|
|
|
- // container: "luckysheet",
|
|
|
- // });
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- // In some cases, you need to use $nextTick
|
|
|
- // this.$nextTick(() => {
|
|
|
- // $(function () {
|
|
|
- // luckysheet.create({
|
|
|
- // localUrl: "123",
|
|
|
- // // loadUrl: window.location.protocol + localurl + "/load/${wb.id}",
|
|
|
- // // loadSheetUrl: window.location.protocol + localurl + "/loadSheet/${wb.id}",
|
|
|
- // // updateUrl:
|
|
|
- // // "ws://" +
|
|
|
- // // localurl +
|
|
|
- // // "/ws/" +
|
|
|
- // // Math.round(Math.random() * 100) +
|
|
|
- // // "/${wb.id}",
|
|
|
- // container: "luckysheet", // 设定DOM容器的id
|
|
|
- // allowUpdate: true,
|
|
|
- // functionButton:
|
|
|
- // '<button id="" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 5px;" onclick="exportHandle()">保存</button><button id="" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 85px;" onclick="exportHandles()">在线导出</button>',
|
|
|
- // title: "Luckysheet Demo", // 设定表格名称
|
|
|
- // lang: "zh", // 设定表格语言
|
|
|
- // // plugins:['chart'],
|
|
|
- // data: [
|
|
|
- // {
|
|
|
- // name: "Cell", //工作表名称
|
|
|
- // color: "", //工作表颜色
|
|
|
- // index: 0, //工作表索引
|
|
|
- // status: 1, //激活状态
|
|
|
- // order: 0, //工作表的下标
|
|
|
- // hide: 0, //是否隐藏
|
|
|
- // row: 36, //行数
|
|
|
- // column: 18, //列数
|
|
|
- // defaultRowHeight: 19, //自定义行高
|
|
|
- // defaultColWidth: 73, //自定义列宽
|
|
|
- // celldata: [], //初始化使用的单元格数据
|
|
|
- // config: {
|
|
|
- // merge: {}, //合并单元格
|
|
|
- // rowlen: {}, //表格行高
|
|
|
- // columnlen: {}, //表格列宽
|
|
|
- // rowhidden: {}, //隐藏行
|
|
|
- // colhidden: {}, //隐藏列
|
|
|
- // borderInfo: {}, //边框
|
|
|
- // authority: {}, //工作表保护
|
|
|
- // },
|
|
|
- // scrollLeft: 0, //左右滚动条位置
|
|
|
- // scrollTop: 315, //上下滚动条位置
|
|
|
- // luckysheet_select_save: [], //选中的区域
|
|
|
- // calcChain: [], //公式链
|
|
|
- // isPivotTable: false, //是否数据透视表
|
|
|
- // pivotTable: {}, //数据透视表设置
|
|
|
- // filter_select: {}, //筛选范围
|
|
|
- // filter: null, //筛选配置
|
|
|
- // luckysheet_alternateformat_save: [], //交替颜色
|
|
|
- // luckysheet_alternateformat_save_modelCustom: [], //自定义交替颜色
|
|
|
- // luckysheet_conditionformat_save: {}, //条件格式
|
|
|
- // frozen: {}, //冻结行列配置
|
|
|
- // chart: [], //图表配置
|
|
|
- // zoomRatio: 1, // 缩放比例
|
|
|
- // image: [], //图片
|
|
|
- // showGridLines: 1, //是否显示网格线
|
|
|
- // dataVerification: {}, //数据验证配置
|
|
|
- // },
|
|
|
- // {
|
|
|
- // name: "Sheet2",
|
|
|
- // color: "",
|
|
|
- // index: 1,
|
|
|
- // status: 0,
|
|
|
- // order: 1,
|
|
|
- // celldata: [],
|
|
|
- // config: {},
|
|
|
- // },
|
|
|
- // {
|
|
|
- // name: "Sheet3",
|
|
|
- // color: "",
|
|
|
- // index: 2,
|
|
|
- // status: 0,
|
|
|
- // order: 2,
|
|
|
- // celldata: [],
|
|
|
- // config: {},
|
|
|
- // },
|
|
|
- // ],
|
|
|
- // });
|
|
|
- // });
|
|
|
- // });
|
|
|
},
|
|
|
+ mounted() {},
|
|
|
methods: {
|
|
|
+ clickSave() {
|
|
|
+ this.$http({
|
|
|
+ url: "/market/cOnlineExcel/addExcel",
|
|
|
+ method: "post",
|
|
|
+ headers: {
|
|
|
+ "Content-Type": "application/json",
|
|
|
+ },
|
|
|
+ data: {
|
|
|
+ folderId: '',
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ // if (res.data.result === 1) {
|
|
|
+ // _this.$message({
|
|
|
+ // message: res.data.desc,
|
|
|
+ // type: "error",
|
|
|
+ // });
|
|
|
+ // } else {
|
|
|
+ // _this.$message({
|
|
|
+ // message: "成功",
|
|
|
+ // type: "success",
|
|
|
+ // });
|
|
|
+ // var id = res.data.desc;
|
|
|
+ // _this.addNewStatus = false;
|
|
|
+ // //放入id，切换到excel模式
|
|
|
+ // document.getElementById("excelId").setAttribute("value", id);
|
|
|
+ // _this.showExcel = true;
|
|
|
+ // }
|
|
|
+ });
|
|
|
+ },
|
|
|
clickSee(e) {
|
|
|
- console.log(e);
|
|
|
this.$http({
|
|
|
url: "/api/sheet/workbook/" + e.id,
|
|
|
method: "post",
|
|
|
@@ -182,48 +191,42 @@ export default {
|
|
|
//获取所有
|
|
|
getAllExcel() {
|
|
|
let data = {};
|
|
|
- axios.post("http://43.138.50.94:7777/sheet/allSheet", data).then((res) => {
|
|
|
- console.log(res);
|
|
|
- this.optionsExcel = res.data;
|
|
|
- });
|
|
|
- // this.$http({
|
|
|
- // url: "/api/sheet/allSheet",
|
|
|
- // method: "post",
|
|
|
- // headers: {
|
|
|
- // "Content-Type": "application/json",
|
|
|
- // },
|
|
|
- // data: {},
|
|
|
- // }).then((res) => {
|
|
|
- // console.log(res);
|
|
|
- // this.optionsExcel = res.data;
|
|
|
- // });
|
|
|
+ axios
|
|
|
+ .post("http://43.138.50.94:7777/sheet/allSheet", data)
|
|
|
+ .then((res) => {
|
|
|
+ console.log(res);
|
|
|
+ this.optionsExcel = res.data;
|
|
|
+ });
|
|
|
},
|
|
|
newExcle() {
|
|
|
let data = {};
|
|
|
axios.post("http://43.138.50.94:7777/sheet/create", data).then((res) => {
|
|
|
console.log(res);
|
|
|
let list = {
|
|
|
- name:res.data.name,
|
|
|
- id:res.data.id
|
|
|
- }
|
|
|
- this.optionsExcel.push(list)
|
|
|
- // this.optionsExcel = res.data;
|
|
|
+ name: res.data.name,
|
|
|
+ id: res.data.id,
|
|
|
+ };
|
|
|
+ this.optionsExcel.push(list);
|
|
|
});
|
|
|
- // this.excelStatus = true
|
|
|
- // this.$http({
|
|
|
- // url: "/api/sheet/create",
|
|
|
- // method: "post",
|
|
|
- // headers: {
|
|
|
- // "Content-Type": "application/json",
|
|
|
- // },
|
|
|
- // data: {},
|
|
|
- // }).then((res) => {
|
|
|
- // console.log(res);
|
|
|
- // });
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
-<style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.flex-count {
|
|
|
+ background-color: #fff;
|
|
|
+ .flex-count-header {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ span {
|
|
|
+ font-size: 22px;
|
|
|
+ margin: 20px 0 0 30px;
|
|
|
+ }
|
|
|
+ .header-button {
|
|
|
+ width: 10%;
|
|
|
+ margin: 20px 0 20px 30px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
yangbifan