<template>
	<div class="content-main">
		<el-form :inline="true" class="search-content">
			<el-row>
				<el-form-item label="方案标题:">
					<el-input
						autocomplete="off"
						placeholder="请输入"
						clearable
						v-model="searchForm.xmfabt"
						style="width: 180px"
					></el-input>
				</el-form-item>
				<el-form-item label="年度:">
					<el-select
						clearable
						placeholder="请选择"
						v-model="searchForm.xmnd"
						style="width: 180px !important"
					>
						<el-option
							v-for="(item, index) in this.xmndList"
							:key="index"
							:label="index.xmnd"
							:value="item.xmnd"
						></el-option>
					</el-select>
				</el-form-item>
				<el-form-item>
					<div class="search-button">
						<span class="search-line"></span>
						<el-button
							type="primary"
							size="small"
							class="iconfont iconchaxun"
							@click="getList"
							>&nbsp;查询</el-button
						>
						<el-button
							type="primary"
							size="small"
							class="iconfont iconzhongzhi"
							@click="chongzhi"
							>&nbsp;重置</el-button
						>
					</div>
				</el-form-item>
			</el-row>
		</el-form>
		<!-- <el-row class="solid"></el-row>
		<el-row class="addCommon">
			<el-button
				type="primary"
				class="outButton"
				icon="el-icon-plus"
				@click="showDialog('', true, 0)"
			>新增</el-button>
		</el-row> -->
		<el-table border :data="tableData" style="margin-top: 20px">
			<el-table-column
				type="index"
				sortable
				label="序号"
				width="80"
				align="center"
			>
				<template slot-scope="scope">
					<span>{{ scope.$index + 1 }}</span>
				</template>
			</el-table-column>
			<el-table-column
				align="center"
				show-overflow-tooltip
				sortable
				label="方案标题"
				prop="xmfabt"
			></el-table-column>
			<el-table-column
				align="center"
				show-overflow-tooltip
				sortable
				label="项目申请单位"
				prop="xmsqdw"
			></el-table-column>
			<el-table-column
				align="center"
				show-overflow-tooltip
				sortable
				label="年度"
				prop="xmnd"
			></el-table-column>
			<el-table-column
				align="center"
				show-overflow-tooltip
				sortable
				label="发布时间"
				prop="fbsj"
			></el-table-column>
			<el-table-column
				align="center"
				show-overflow-tooltip
				sortable
				label="状态"
				prop="xmlxztmc"
			></el-table-column>
			<el-table-column align="center" label="操作">
				<template slot-scope="scope">
					<el-tooltip
						class="item"
						effect="light"
						content="查看"
						placement="top"
					>
						<el-button
							type="primary"
							size="small"
							class="operate_show_btn iconfont iconchakan2"
							@click="showDialog(scope.row, true, 1)"
						></el-button>
					</el-tooltip>
					<el-tooltip
						class="item"
						effect="light"
						content="审核"
						placement="top"
					>
						<el-button
							type="primary"
							size="small"
							class="operate_edit_btn iconfont iconshenhe"
							@click="showDialog(scope.row, true, 2)"
							v-if="
								buttonNameList.indexOf('审核') > -1 &&
								(scope.row.xmzbzt == 4 ||
									scope.row.xmzbzt == 6 ||
									scope.row.xmlxzt == 14)
							"
						></el-button>
					</el-tooltip>
				</template>
			</el-table-column>
		</el-table>
		<el-row class="pagination-wrap">
			<el-pagination
				@size-change="handleSizeChange"
				@current-change="handleCurrentChange"
				:current-page.sync="pageForm.pageNum"
				:page-sizes="[10, 20, 30, 40, 50]"
				:page-size="pageForm.pageSize"
				layout="total, sizes, prev, pager, next, jumper"
				:total="pageForm.total"
			></el-pagination>
		</el-row>
		<div v-if="dialogVisible">
			<el-dialog
				:title="dialogTitle"
				:visible.sync="dialogVisible"
				width="80%"
				:before-close="handleClose"
				:close-on-click-modal="false"
				:modal-append-to-body="false"
			>
				<el-row class="approvalProcess">
					<el-col :span="2">
						<el-button
							style="
								width: 40px;
								height: 100px;
								float: right;
								margin-right: 3em;
								line-height: 1.3em;
							"
							:class="{ active: cur == 1 }"
							@click="
								cur = 1
								dialogTitle = '项目申请'
							"
							>项<br />目<br />申<br />请</el-button
						>
						<!-- :class="{'processColor':xmlxzt == 1}" -->
						<span
							class="arrow"
							style="margin-left: 60px; margin-top: -40px"
						></span>
						<!-- :class="{'processColor':xmlxzt == 1}" -->
						<span
							class="arrow"
							style="margin-left: 60px; margin-top: 20px"
						></span>
					</el-col>
					<el-col :span="8">
						<el-row>
							<el-col :span="8" style="position: relative">
								<el-button
									:class="{ active: cur == 2 }"
									@click="
										cur = 2
										dialogTitle = '设计招标'
									"
									:disabled="xmlxzt <= 2 && !xmzbzt"
									>设计招标</el-button
								>
								<!-- :class="{'processColor':xmlxzt == 2}" -->
								<span class="arrow"></span>
							</el-col>
							<el-col :span="8" style="position: relative">
								<el-button
									:class="{ active: cur == 3 || cur == 4 }"
									@click="
										cur = 3 || cur == 4
										dialogTitle = '项目建议书'
									"
									:disabled="xmzbzt < 4"
									>项目建议书</el-button
								>
								<!-- :class="{'processColor':xmlxzt == 3 || xmlxzt == 4}" -->
								<span class="arrow"></span>
							</el-col>
							<el-col :span="8">
								<el-button
									:class="{
										active:
											cur == 5 || cur == 6 || cur == 7,
									}"
									@click="
										cur = 5 || cur == 6
										dialogTitle = '可研报告'
									"
									:disabled="xmzbzt < 6"
									>可研报告</el-button
								>
							</el-col>
						</el-row>
						<el-row style="margin-top: 20px">
							<el-col :span="8">
								<el-button
									:class="{ active: cur == 7 }"
									@click="
										cur = 7
										dialogTitle = '立项审批'
									"
									:disabled="xmlxzt < 8"
									>立项审批</el-button
								>
								<span class="arrow"></span>
							</el-col>
							<el-col :span="8">
								<el-button
									:class="{ active: cur == 8 }"
									@click="
										cur = 8
										dialogTitle = '监理招标'
									"
									:disabled="xmlxzt < 9"
									>监理招标</el-button
								>
								<!-- :class="{'processColor':xmlxzt = 8}" -->
								<span class="arrow"></span>
							</el-col>
							<el-col :span="8">
								<el-button
									:class="{ active: cur == 9 }"
									@click="
										cur = 9
										dialogTitle = '建设招标'
									"
									:disabled="xmlxzt < 10"
									>建设招标</el-button
								>
								<!-- :class="{'processColor':xmlxzt = 9}" -->
								<span
									class="arrow"
									style="margin-top: -44px"
								></span>
							</el-col>
						</el-row>
					</el-col>
					<el-col :span="14" style="margin-top: 30px">
						<el-row>
							<el-col :span="6" style="position: relative">
								<el-button
									:class="{ active: cur == 10 || cur == 11 }"
									@click="
										cur = 10
										dialogTitle = '资金申请'
									"
									:disabled="xmlxzt < 11"
									>资金申请</el-button
								>
								<!-- :class="({'processColor':xmlxzt == 10 || xmlxzt == 11})" -->
								<span class="arrow"></span>
							</el-col>
							<el-col :span="6" style="position: relative">
								<el-button
									:class="{ active: cur == 12 }"
									@click="
										cur = 12
										dialogTitle = '项目进度简报'
									"
									:disabled="xmlxzt < 13"
									>项目进度简报</el-button
								>
								<!-- :class="{'processColor':xmlxzt == 12}" -->
								<span class="arrow"></span>
							</el-col>
							<el-col :span="6" style="position: relative">
								<el-button
									:class="{ active: cur >= 13 }"
									@click="
										cur = 13 || 14 || 15 || 16
										dialogTitle = '项目验收'
									"
									:disabled="xmlxzt < 14"
									>项目验收</el-button
								>
							</el-col>
							<el-col :span="6" style="position: relative">
								<el-button
									:class="{ active: cur == 0 }"
									@click="cur = 0"
									:disabled="xmlxzt == 1"
									>补充材料</el-button
								>
							</el-col>
						</el-row>
					</el-col>
				</el-row>
				<xiangmushenqing
					v-if="this.cur == 1"
					@showDialog1="showDialog"
					@getList1="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></xiangmushenqing>
				<shejizhaobiao
					v-if="this.cur == 2"
					@showDialog2="showDialog"
					@getList2="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></shejizhaobiao>
				<jianyishu
					v-if="this.cur == 3 || this.cur == 4"
					@showDialog3="showDialog"
					@getList3="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></jianyishu>
				<keyanbaogao
					v-if="this.cur == 5 || this.cur == 6"
					@showDialog4="showDialog"
					@getList4="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></keyanbaogao>
				<lixiangshenpi
					v-if="this.cur == 7"
					@showDialog5="showDialog"
					@getList5="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></lixiangshenpi>
				<jianlizhaobiao
					v-if="this.cur == 8"
					@showDialog6="showDialog"
					@getList6="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></jianlizhaobiao>
				<jianshezhaobiao
					v-if="this.cur == 9"
					@showDialog7="showDialog"
					@getList7="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></jianshezhaobiao>
				<zijinshenqing
					v-if="this.cur == 10 || this.cur == 11"
					@showDialog8="showDialog"
					@getList8="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></zijinshenqing>
				<jindujianbao
					v-if="this.cur == 12"
					@showDialog9="showDialog"
					@getList9="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></jindujianbao>
				<xiangmuyanshou
					v-if="this.cur >= 13"
					@showDialog10="showDialog"
					@getList10="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				></xiangmuyanshou>
				<buchongcailiao
					v-if="this.cur == 0"
					@showDialog="showDialog"
					@getList="getList"
					:fatherObj="fatherObj"
					:fatherEchoForm="fatherEchoForm"
					:xmsqIdForm="xmsqIdForm"
					:xmIdForm="xmIdForm"
					ref="dialog"
				>
				</buchongcailiao>
			</el-dialog>
		</div>
	</div>
</template>
<script>
import xiangmushenqing from './component/xiangmushenqing'
import shejizhaobiao from './component/shejizhaobiao'
import jianyishu from './component/jianyishu'
import keyanbaogao from './component/keyanbaogao'
import lixiangshenpi from './component/lixiangshenpi'
import jianlizhaobiao from './component/jianlizhaobiao'
import jianshezhaobiao from './component/jianshezhaobiao'
import zijinshenqing from './component/zijinshenqing'
import jindujianbao from './component/jindujianbao'
import xiangmuyanshou from './component/xiangmuyanshou'
import buchongcailiao from './component/buchongcailiao'
import { fileApi } from '@/api'
import {
	projectInfo,
	projectApplicationPage,
	projectApplicationDelete,
	projectApplicationGet,
	getProject,
} from '@/api/projectManagement/index'
import { authorityControl } from '@/api/login/login'
export default {
	name: 'projectView',
	components: {
		xiangmushenqing,
		shejizhaobiao,
		jianyishu,
		keyanbaogao,
		lixiangshenpi,
		jianlizhaobiao,
		jianshezhaobiao,
		zijinshenqing,
		jindujianbao,
		xiangmuyanshou,
		buchongcailiao,
	},
	data() {
		return {
			searchForm: {
				// 项目方案标题
				xmfabt: '',
				// 项目年度
				xmnd: '',
			},
			// 分页
			pageForm: {
				pageNum: 1,
				pageSize: 10,
				total: 1,
			},
			// 表格数据
			tableData: [],
			// 弹窗控制
			dialogVisible: false,
			// 文件上传路径
			actionUrl: fileApi + '/upload',
			fileList: [],
			cur: 1,
			// 父组件传参
			fatherObj: {},
			// 项目年度下拉表
			xmndList: [],
			// 最新项目信息表
			fatherEchoForm: {},
			// xmsqId专属信息
			xmsqIdForm: {},
			// xmId专属信息
			xmIdForm: {},
			// xmId
			xmId: '',
			// 项目立项状态
			xmlxzt: '',
			// 项目招标状态
			xmzbzt: '',
			dialogTitle: '',
			buttonNameList: [],
		}
	},
	methods: {
		getButtonList(menuCode, userCode) {
			let codeData = {
				resourceCode: menuCode,
				userId: userCode,
			}
			authorityControl(codeData).then((res) => {
				let buttonNameList = []
				res.data.forEach((item) => {
					this.buttonNameList.push(item.resourceName)
				})
			})
		},
		// 分页页数
		handleSizeChange(val) {
			this.pageForm.pageSize = val
			this.getList()
		},
		//分页每页显示几个
		handleCurrentChange(val) {
			this.pageForm.pageNum = val
			this.getList()
		},
		handleClose() {
			this.dialogVisible = false
			this.getList()
		},
		// 文件上传的方法
		handleRemove(file, fileList) {
			console.log(file, fileList)
		},
		handlePreview(file) {
			console.log(file)
		},
		handleExceed(files, fileList) {
			this.$message.warning(
				`当前限制选择 1 个文件，本次选择了 ${
					files.length
				} 个文件，共选择了 ${files.length + fileList.length} 个文件`
			)
		},
		beforeRemove(file, fileList) {
			return this.$confirm(`确定移除 ${file.name}？`)
		},

		// 每次打开弹窗掉一次该接口，获取xmlxzt和xmzbzt
		fatherProjectApplicationGet(data) {
			projectApplicationGet(data).then((res) => {
				if (res.infoCode === 200) {
					this.xmsqIdForm = res.data
					this.xmlxzt = res.data.xmlxzt
					this.xmzbzt = res.data.xmzbzt
					if (res.data.xmlxzt == 16) {
						this.xmsqIdForm.xmlxzt = 3
						this.xmlxzt = 3
					}
					console.log(
						'父组件的xmsqIdForm:',
						this.xmsqIdForm,
						'xmlxzt:',
						this.xmlxzt,
						'xmzbzt:',
						this.xmzbzt
					)
				} else {
					this.$message({
						type: 'error',
						message: res.msg,
					})
				}
			})
		},

		// 每次打开弹层调用该接口，获取管理端下发来的信息
		fatherProjectInfo() {
			projectInfo().then((res) => {
				if (res.infoCode === 200) {
					this.fatherEchoForm = res.data
					console.log('父组件的fatherEchoForm:', this.fatherEchoForm)
				} else {
					this.$message({
						type: 'error',
						message: res.msg,
					})
				}
			})
		},

		// 获取管理端下发信息
		fatherGetProject(data) {
			getProject(data).then((res) => {
				if (res.infoCode === 200) {
					this.xmIdForm = res.data
					console.log('父组件this.xmIdForm:', this.xmIdForm)
				} else {
					this.$message({
						type: 'error',
						message: res.msg,
					})
				}
			})
		},

		// 列表查询
		getList(type) {
			if (type != 'start') {
				//非初始化调用：查询、分页
				sessionStorage.setItem(
					'searchData',
					JSON.stringify(this.searchForm)
				)
				sessionStorage.setItem(
					'pageData',
					JSON.stringify(this.pageForm)
				)
			} else {
				//初始化分两种情况，详情页等返回后的初始化，以及第一次进入此菜单的初始化
				if (JSON.parse(sessionStorage.getItem('searchData'))) {
					//详情页返回后，将对应查询条件和分页的字段赋值，页面回显参数
					this.searchForm = JSON.parse(
						sessionStorage.getItem('searchData')
					)
					this.pageForm = JSON.parse(
						sessionStorage.getItem('pageData')
					)
				} else {
					//第一次进去此菜单时，保存上方默认的data
					sessionStorage.setItem(
						'searchData',
						JSON.stringify(this.searchForm)
					)
					sessionStorage.setItem(
						'pageData',
						JSON.stringify(this.pageForm)
					)
				}
			}
			let data = {
				pageNum: this.pageForm.pageNum,
				pageSize: this.pageForm.pageSize,
				xmfabt: this.searchForm.xmfabt,
				xmnd: this.searchForm.xmnd,
			}
			projectApplicationPage(data).then((res) => {
				if (res.infoCode === 200) {
					this.tableData = res.data.list
					this.pageForm.total = Number(res.data.total)
					this.tableData.forEach((item, index, arr) => {
						// 项目申请单位处理
						// item.xmsqdw = sessionStorage.getItem('orgName');
						// 项目年度下拉表处理
						this.xmndList.push({
							xmnd: item.xmnd,
						})
						// 项目状态处理
						item.xmlxzt == 1
							? (item.xmlxztmc = '待上报')
							: item.xmlxzt == 1
						item.xmlxzt == 2
							? (item.xmlxztmc = '已申请')
							: item.xmlxzt == 2
						item.xmlxzt == 3
							? (item.xmlxztmc = '设计招标')
							: item.xmlxzt == 3
						item.xmlxzt == 4
							? (item.xmlxztmc = '建议书已提交')
							: item.xmlxzt == 4
						item.xmlxzt == 5
							? (item.xmlxztmc = '建议书已批复')
							: item.xmlxzt == 5
						item.xmlxzt == 6
							? (item.xmlxztmc = '可研报告已提交')
							: item.xmlxzt == 6
						item.xmlxzt == 7
							? (item.xmlxztmc = '可研报告已批复')
							: item.xmlxzt == 7
						item.xmlxzt == 8
							? (item.xmlxztmc = '立项审批')
							: item.xmlxzt == 8
						item.xmlxzt == 9
							? (item.xmlxztmc = '监理招标')
							: item.xmlxzt == 9
						item.xmlxzt == 10
							? (item.xmlxztmc = '建设招标')
							: item.xmlxzt == 10
						item.xmlxzt == 11
							? (item.xmlxztmc = '资金申请')
							: item.xmlxzt == 11
						item.xmlxzt == 12
							? (item.xmlxztmc = '资金批复')
							: item.xmlxzt == 12
						item.xmlxzt == 13
							? (item.xmlxztmc = '项目进度')
							: item.xmlxzt == 13
						item.xmlxzt == 14
							? (item.xmlxztmc = '验收申请')
							: item.xmlxzt == 14
						item.xmlxzt == 15
							? (item.xmlxztmc = '已验收')
							: item.xmlxzt == 15
						item.xmlxzt == 16
							? (item.xmlxztmc = '已截止')
							: item.xmlxzt == 16
						// 列表fbsj字段截取
						if (item.fbsj) {
							item.fbsj = item.fbsj.slice(0, 10)
						}
					})
					// 项目年度下拉表去重处理
					let newObj = {}
					this.xmndList = this.xmndList.reduce((item, next) => {
						newObj[next.xmnd]
							? ''
							: (newObj[next.xmnd] = true && item.push(next))
						return item
					}, [])
					console.log('列表页的this.xmndList:', this.xmndList)
				} else {
					this.$message({
						type: 'error',
						message: res.msg,
					})
				}
			})
			// 重置cur
			this.cur = 1
			this.dialogTitle = '项目申请'
		},

		// dialog
		showDialog(row, isShow, type) {
			this.xmsqIdForm.xmsqId = row.xmsqId
			let status = {
				待上报: '1',
				已申请: '1',
				设计招标: '2',
				建议书已提交: '3',
				建议书已批复: '4',
				可研报告已提交: '5',
				可研报告已批复: '6',
				立项审批: '7',
				监理招标: '8',
				建设招标: '9',
				资金申请: '10',
				资金批复: '10',
				项目进度: '12',
				验收申请: '13',
				已验收: '14',
				已截止: '2',
			}
			this.cur = type == 0 ? 1 : status[row.xmlxztmc]
			if (this.cur == 16) {
				this.cur = 2
			}
			this.dialogVisible = isShow
			this.xmId = row.xmId
			// 0为新增
			if (type == 0) {
				let data = sessionStorage.getItem('KOKENL')
				this.fatherProjectInfo(data)
				this.xmsqIdForm = {}
				this.fatherObj = {
					xmId: this.fatherEchoForm.xmId,
					type: type,
					xmfabt: this.fatherEchoForm.xmfabt,
					xmsqdw: this.fatherEchoForm.xmsqdw,
					xmnd: this.fatherEchoForm.xmnd,
					fbsj: this.fatherEchoForm.fbsj,
					xmsqId: this.fatherEchoForm.xmsqId,
					xmfaxq: this.fatherEchoForm.xmfaxq,
					xmsqFileVOList: this.fatherEchoForm.xmsqFileVOList,
				}
				console.log('父组件新增fatherObj:', this.fatherObj)
				console.log('父组件新增this.cur:', this.cur)
				this.getList()
			}
			// 1为查看
			if (type == 1) {
				let data = {
					xmsqId: row.xmsqId,
				}
				this.fatherProjectApplicationGet(data)
				this.fatherGetProject(this.xmId)
				this.fatherObj = {
					xmId: row.xmId,
					type: type,
					xmfabt: row.xmfabt,
					xmsqdw: row.xmsqdw,
					xmnd: row.xmnd,
					fbsj: row.fbsj,
					xmsqId: row.xmsqId,
				}
				console.log('父组件查看fatherObj:', this.fatherObj)
				console.log('父组件查看this.cur:', this.cur)
			}
			// 2为填报
			if (type == 2) {
				let data = {
					xmsqId: row.xmsqId,
				}
				this.fatherProjectApplicationGet(data)
				this.fatherGetProject(this.xmId)
				this.fatherObj = {
					xmId: row.xmId,
					type: type,
					xmfabt: row.xmfabt,
					xmsqdw: row.xmsqdw,
					xmnd: row.xmnd,
					fbsj: row.fbsj,
					xmsqId: row.xmsqId,
				}
				console.log('父组件填报fatherObj:', this.fatherObj)
				console.log('父组件填报this.cur:', this.cur)
			}
			// 3为修改
			if (type == 3) {
				let data = {
					xmsqId: row.xmsqId,
				}
				this.fatherProjectApplicationGet(data)
				this.fatherGetProject(this.xmId)
				this.fatherObj = {
					xmId: row.xmId,
					type: type,
					xmfabt: row.xmfabt,
					xmsqdw: row.xmsqdw,
					xmnd: row.xmnd,
					fbsj: row.fbsj,
					xmsqId: row.xmsqId,
				}
				console.log('父组件修改fatherObj:', this.fatherObj)
				console.log('父组件修改this.cur:', this.cur)
			}
		},

		// 删除
		deleteInfo(row) {
			let data = {
				xmsqId: row.xmsqId,
			}
			projectApplicationDelete(data).then((res) => {
				if (res.infoCode === 200) {
					this.$message({
						type: 'success',
						message: '删除成功!',
					})
					this.getList()
				} else {
					this.$message({
						type: 'error',
						message: res.msg,
					})
				}
			})
		},

		// 重置
		chongzhi() {
			this.searchForm = {}
			this.pageForm = {
				pageNum: 1,
				pageSize: 10,
				total: 1,
			}
			this.getList()
		},
	},
	mounted() {
		this.getButtonList(
			sessionStorage.getItem('resourceCode'),
			sessionStorage.getItem('userCode')
		)
		this.getList('start')
	},
}
</script>

<style lang="scss" scoped>
// .content-main {
// 	margin: 10px 10px 0 10px;
// 	padding: 10px;
// 	// height: calc(100vh - 251px);
// 	border: 1px #f4f5f8 solid;
// 	background-color: #fff;
// }
.pagination-wrap {
	margin-top: 20px;
	text-align: right;
}

.moreSelect {
	position: relative;
	float: right;
	margin-left: 20px;
	&:before {
		content: '';
		position: absolute;
		display: block;
		left: -10px;
		width: 0px;
		height: 40px;
		border-left: 1px #75b5fa dashed;
	}
	.el-button--primary {
		margin-top: 3px;
		vertical-align: top;
	}
	.el-form-item {
		margin-right: 0;
	}
	.el-button {
		float: left;
	}
}

.solid {
	margin-top: 10px;
	margin-bottom: 10px;
	border-top: 1px #75b5fa dashed;
}

.search-content {
	padding: 10px 0;
	.el-form-item {
		margin-bottom: 0;
	}
}

.addCommon {
	margin-top: 20px;
	padding: 10px;
	text-align: left;
	background-color: #edf5fd;
}

.operate_modify_btn {
	padding: 0;
	width: 24px;
	height: 24px;
	background-color: #f9b000;
	&:hover,
	&:focus {
		background: #db9b02 !important;
	}
}
.operate_delete_btn {
	padding: 0;
	width: 24px;
	height: 24px;
	background-color: #fd7171;
	&:hover,
	&:focus {
		background: #d34444 !important;
	}
}
.operate_reply_btn {
	padding: 0;
	width: 24px;
	height: 24px;
	background-color: #3ae5cf;
	&:hover,
	&:focus {
		background: #30a0c1 !important;
	}
}
.operate_check_btn,
.operate_show_btn,
.operate_edit_btn,
.operate_delete_btn {
	float: left;
}

.approvalProcess {
	padding-bottom: 20px;
	.el-col-11 {
		.el-row {
			padding-top: 0;
			padding-bottom: 10px;
		}
		.el-row + .el-row {
			padding-top: 10px;
			padding-bottom: 0;
		}
	}
	.el-col-11 + .el-col-11 {
		margin-top: 15px;
		.el-row {
			padding-top: 10px;
		}
	}
	.el-button {
		padding: 12px 10px;
		width: 70%;
		&.active {
			color: #3a8ee6;
			border-color: #3a8ee6;
			background-color: #ecf5ff;
		}
	}
	.el-col-2,
	.el-col-8 {
		position: relative;
	}
	.arrow {
		position: absolute;
		top: 50%;
		right: 9%;
		margin-top: -10px;
		width: 22px;
		height: 20px;
		&:after,
		&:before {
			position: absolute;
			top: 50%;
			content: '';
		}
		&:after {
			left: 0;
			margin-top: -3px;
			width: 15px;
			height: 6px;
			background-color: #c0c4cc;
		}
		&:before {
			right: -50%;
			margin-top: -10px;
			margin-right: 0;
			border-width: 10px;
			border-style: solid;
			border-color: transparent;
			border-left-color: #c0c4cc;
		}
	}
	.processColor {
		&:after {
			background-color: #409eff;
		}
		&:before {
			border-left-color: #409eff;
		}
	}
}
</style>
