|
|
<template>
|
|
|
<el-container>
|
|
|
<el-header style="width: 100%; height: 60px;font-size: 12px">
|
|
|
<el-form :inline="true" label-width="65px" label-position="left">
|
|
|
<el-row>
|
|
|
<el-col :span="15" >
|
|
|
<el-select v-model="queryParam.fileName" filterable placeholder="计划名称" @change="fileNameChange" >
|
|
|
<el-option
|
|
|
v-for="(item,index) in fileNameList"
|
|
|
:key="index"
|
|
|
:label="item"
|
|
|
:value="item">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
<el-form-item label="状态:" >
|
|
|
<el-select
|
|
|
v-model="queryParam.gdZt"
|
|
|
clearable
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in gdZtOptions"
|
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
|
>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="9">
|
|
|
<el-form-item style="float: right" >
|
|
|
<el-button type="success" @click="initList">查询</el-button>
|
|
|
<el-button
|
|
|
class="out-item"
|
|
|
type="primary"
|
|
|
icon="el-icon-download"
|
|
|
@click="handleExport"
|
|
|
>导出</el-button>
|
|
|
<!-- <div style="float: right;margin-left: 5px" >
|
|
|
<el-upload
|
|
|
:action="uploadAction"
|
|
|
:show-file-list="false"
|
|
|
:before-upload="beforeAvatarUpload"
|
|
|
:data="uploadData"
|
|
|
:on-success="handleAvatarSuccess"
|
|
|
:disabled="filedis"
|
|
|
:headers="heads"
|
|
|
>
|
|
|
<el-button type="success" @click="uploadExcel" >导入</el-button>
|
|
|
</el-upload>
|
|
|
</div>-->
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
<el-col >
|
|
|
<el-form-item style="float: right" >
|
|
|
<!-- <span style="font-size: 12px;color: red; float: right;"> * 表中红色数据：钢加小组结束期为休息日</span>-->
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-form>
|
|
|
|
|
|
</el-header>
|
|
|
<el-container style="padding-top: 0px">
|
|
|
<el-container>
|
|
|
<el-main>
|
|
|
|
|
|
<div class="mytable">
|
|
|
|
|
|
<vxe-grid
|
|
|
id="id"
|
|
|
ref="xGrid"
|
|
|
border
|
|
|
resizable
|
|
|
keep-source
|
|
|
show-overflow
|
|
|
:align="'center'"
|
|
|
:height="height"
|
|
|
:auto-resize="true"
|
|
|
:columns="tableColumn"
|
|
|
:data="list"
|
|
|
:custom-config="{ storage: true }"
|
|
|
highlight-current-row
|
|
|
highlight-hover-row
|
|
|
@checkbox-all="selectAllEvent"
|
|
|
@checkbox-change="selectChangeEvent"
|
|
|
:scroll-y="{ enabled: true }"
|
|
|
>
|
|
|
</vxe-grid>
|
|
|
</div>
|
|
|
</el-main>
|
|
|
</el-container>
|
|
|
</el-container>
|
|
|
</el-container>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { getCzxx} from '@/api/jhzx/qfxq'
|
|
|
import {getFilenameNew, getSygdList, listByFileNameNew, tj} from '@/api/jhzx/sygd'
|
|
|
|
|
|
import { mapGetters } from 'vuex'
|
|
|
import XEUtils from 'xe-utils'
|
|
|
import { getToken } from '@/utils/auth'
|
|
|
import { startLoading, endLoading } from '@/utils'
|
|
|
import { Message } from 'element-ui'
|
|
|
import ydjhNewTable from "@/views/jhzx/js/ydjhNewTable";
|
|
|
export default {
|
|
|
name:'SygdWH',
|
|
|
data() {
|
|
|
return {
|
|
|
fileNameList:[],
|
|
|
queryParam: {
|
|
|
fileName:'',
|
|
|
gdZt:'0'
|
|
|
},
|
|
|
gdZtOptions:[
|
|
|
{
|
|
|
value: "0",
|
|
|
label: "编辑",
|
|
|
},
|
|
|
{
|
|
|
value: "1",
|
|
|
label: "提交",
|
|
|
},
|
|
|
{
|
|
|
value: "2",
|
|
|
label: "审核",
|
|
|
},
|
|
|
],
|
|
|
list: [],
|
|
|
gcrl: [],
|
|
|
isupload:'02',
|
|
|
filedis:false,
|
|
|
uploadData:{},
|
|
|
heads: { token: getToken() },
|
|
|
uploadAction: process.env.VUE_APP_BASE_API + '/dmSygd/upload',
|
|
|
dictData:[],
|
|
|
height: '500px',
|
|
|
tableColumn:[],
|
|
|
checkedList: [],
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
...mapGetters(['name', 'bmbm'])
|
|
|
},
|
|
|
created() {
|
|
|
const {tableColumn}=ydjhNewTable()
|
|
|
this.tableColumn = tableColumn
|
|
|
window.addEventListener('resize', this.getHeight)
|
|
|
this.getHeight()
|
|
|
this.initBase()
|
|
|
this.queryParam.beginTime=XEUtils.toDateString(new Date(),'yyyy/MM/dd')
|
|
|
},
|
|
|
watch: {
|
|
|
'queryParam.beginTime'(newValue, Value){
|
|
|
this.queryParam.endTime= XEUtils.toDateString(XEUtils.getWhatMonth(newValue, 3),'yyyy/MM/dd')
|
|
|
},
|
|
|
'$route'(){
|
|
|
this.getParams();
|
|
|
},
|
|
|
},
|
|
|
methods: {
|
|
|
getParams(){
|
|
|
var a=[]
|
|
|
a= this.$route.params.list
|
|
|
if (a===undefined){
|
|
|
return;
|
|
|
}
|
|
|
this.list=a
|
|
|
if (this.$refs.xGrid) {
|
|
|
this.$refs.xGrid.loadData(this.list)
|
|
|
}
|
|
|
},
|
|
|
formatterZt({cellValue}) {
|
|
|
if (cellValue === "0") {
|
|
|
return '编辑'
|
|
|
}
|
|
|
if (cellValue === "1") {
|
|
|
return '提交'
|
|
|
}
|
|
|
if (cellValue === "2") {
|
|
|
return '审核'
|
|
|
}
|
|
|
return cellValue
|
|
|
},
|
|
|
handleExport() {
|
|
|
this.$refs.xGrid.exportData({
|
|
|
filename: '三月滚动计划',// 文件名字
|
|
|
sheetName: 'Sheet1',
|
|
|
type: 'xlsx',//导出文件类型 xlsx 和 csv
|
|
|
data: this.data, // 数据源
|
|
|
// sheetMethod: this.sheetMethod,
|
|
|
// useStyle: true,
|
|
|
// 过滤那个字段导出
|
|
|
columnFilterMethod: function(column, $columnIndex) {
|
|
|
return !(column.$columnIndex === 0 )
|
|
|
// 0是复选框 不导出
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
sheetMethod({ options, worksheet }){
|
|
|
const data = options.data
|
|
|
const columns = options.columns
|
|
|
let fields = ['dcCh','dcPl'];// 需要合并的列
|
|
|
// 获取当前添加样式的列的key
|
|
|
const key = columns.find((f) => f.field === 'dcCh').id
|
|
|
data.forEach((item, i) => {
|
|
|
const row = worksheet.getRow(i + 1)
|
|
|
const cells = row._cells
|
|
|
const address = cells.find((f) => f._column._key == key).address
|
|
|
//截取单元格列序号（英文字母）
|
|
|
const chartAt = address.replace(/[^a-zA-Z]/g, '')
|
|
|
if (i%2==0){
|
|
|
// 通过worksheet操作表格样式，这里只是填充了背景色，还可以操作其它表格的功能
|
|
|
//(i+2)过滤表头（例如表头A1，i=0，所以从A2开始添加样式）
|
|
|
worksheet.getCell(chartAt + (i + 2))
|
|
|
.fill = {
|
|
|
type: "pattern",
|
|
|
pattern: "solid",
|
|
|
fgColor: { argb: "ef7d7d" }
|
|
|
}
|
|
|
}else {
|
|
|
worksheet.getCell(chartAt + (i + 2))
|
|
|
.fill = {
|
|
|
type: "pattern",
|
|
|
pattern: "solid",
|
|
|
fgColor: { argb: "ef7d7d" }
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
uploadExcel() {
|
|
|
this.uploadData.isupload = this.isupload
|
|
|
},
|
|
|
beforeAvatarUpload(file) {
|
|
|
// 文件类型
|
|
|
const isType = file.type === 'application/vnd.ms-excel'
|
|
|
const isTypeComputer = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
|
|
|
const fileType = isType || isTypeComputer
|
|
|
// if (!fileType) {
|
|
|
// this.$message.error('上传文件只能是xls/xlsx格式！')
|
|
|
// return
|
|
|
// }
|
|
|
startLoading()
|
|
|
return fileType
|
|
|
},
|
|
|
handleAvatarSuccess(res, file) {
|
|
|
endLoading()
|
|
|
if (res.success) {
|
|
|
this.$message({ message: '导入成功', type: 'success' })
|
|
|
this.list = res.data
|
|
|
if (this.$refs.xGrid) {
|
|
|
this.$refs.xGrid.loadData(this.list)
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
Message({
|
|
|
message: res.message || 'Error',
|
|
|
type: 'error',
|
|
|
duration: 5 * 1000
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
cellStyle2({row}) {
|
|
|
if (this.gcrl.includes(row.gjjsXz)) {
|
|
|
return {
|
|
|
color: 'red',
|
|
|
cursor: 'pointer'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
initBase(){
|
|
|
getFilenameNew().then(res=>{
|
|
|
this.fileNameList=res.data
|
|
|
})
|
|
|
getCzxx({}).then(res=>{
|
|
|
this.dictData = res.data
|
|
|
})
|
|
|
},
|
|
|
initList() {
|
|
|
const fileName=this.queryParam.fileName
|
|
|
if (!fileName){
|
|
|
this.$message.warning('请先选择文件名')
|
|
|
return
|
|
|
}
|
|
|
listByFileNameNew({fileName,zt:this.queryParam.gdZt}).then((res) => {
|
|
|
this.list = res.data
|
|
|
})
|
|
|
},
|
|
|
formatDate ({ cellValue }) {
|
|
|
return XEUtils.toDateString(cellValue, 'yyyy/MM/dd')
|
|
|
},
|
|
|
getHeight() {
|
|
|
this.height = window.innerHeight - 150
|
|
|
},
|
|
|
// 全选
|
|
|
selectAllEvent() {
|
|
|
const records = this.$refs.xGrid.getCheckboxRecords();
|
|
|
this.checkedList = records;
|
|
|
},
|
|
|
// 单选
|
|
|
selectChangeEvent() {
|
|
|
const records = this.$refs.xGrid.getCheckboxRecords();
|
|
|
this.checkedList = records;
|
|
|
},
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="scss" scoped >
|
|
|
|
|
|
.el-header{margin:0;padding: 5px;height:auto;
|
|
|
.el-input{
|
|
|
width: 140px;
|
|
|
}
|
|
|
.el-select{
|
|
|
width: 140px;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
.el-container{padding: 0;margin:0;}
|
|
|
.el-main{padding: 0;}
|
|
|
.el-col{padding: 0;height: 32px;}
|
|
|
.el-aside{background: #fff;padding: 0}
|
|
|
.el-container{padding: 0}
|
|
|
.el-row {}
|
|
|
.el-row:last-child {margin-bottom: 0; }
|
|
|
|
|
|
.tableStyles{
|
|
|
background: #0a76a4;
|
|
|
}
|
|
|
|
|
|
.my-dropdown {
|
|
|
width: 400px;
|
|
|
height: 400px;
|
|
|
background-color: #fff;
|
|
|
border: 1px solid #dcdfe6;
|
|
|
box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
|
|
|
font-size: 12px;
|
|
|
|
|
|
}
|
|
|
.mytable1{
|
|
|
|
|
|
}
|
|
|
.borderClass{
|
|
|
|
|
|
}
|
|
|
.vxe-input {
|
|
|
display: inline-block !important;
|
|
|
position: relative !important;
|
|
|
width: auto;
|
|
|
}
|
|
|
.el-input {
|
|
|
display: inline-block !important;
|
|
|
position: relative !important;
|
|
|
width: auto;
|
|
|
}
|
|
|
.keyword-lighten {
|
|
|
color: #000;
|
|
|
background-color: #FFFF00;
|
|
|
}
|
|
|
|
|
|
.vxe-textarea--inner {
|
|
|
line-height: inherit;
|
|
|
}
|
|
|
.el-form-item__label-wrap {
|
|
|
margin-left: 0px !important;
|
|
|
float: left;
|
|
|
}
|
|
|
.fontClass{
|
|
|
font-size: 12px;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
|
|
|
|
|
|
</style>
|
