You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
237 lines
7.3 KiB
237 lines
7.3 KiB
2 years ago
|
<!--
|
||
|
|
@ 作者: 鲁智强
|
||
|
|
@ 时间: 2023-08-15 11:34:38
|
||
|
|
@ 备注:
|
||
|
|
-->
|
||
|
|
<template>
|
||
|
|
<div>
|
||
|
|
<el-button type="danger" class="button-margin" size="large" @click="handleBatchDelete">批量删除</el-button>
|
||
|
|
<el-button class="new_btn" type="success" size="large" @click="handleNew"
|
||
|
|
>新增</el-button
|
||
|
|
>
|
||
|
|
<el-button type="warning" circle size="large"
|
||
|
|
><el-icon><RefreshRight /></el-icon
|
||
|
|
></el-button>
|
||
|
|
<span class="aaa">
|
||
|
|
<el-form-item label="" size="large">
|
||
|
|
<el-select v-model="data.form.region" placeholder="请选分厂">
|
||
|
|
<el-option label="甲醇分厂" value="1"></el-option>
|
||
|
|
<el-option label="化产分厂" value="2"></el-option>
|
||
|
|
<el-option label="动力分厂" value="3"></el-option>
|
||
|
|
<el-option label="机焦车间" value="4"></el-option>
|
||
|
|
<el-option label="质检中心" value="5"></el-option>
|
||
|
|
<el-option label="安环部" value="6"></el-option>
|
||
|
|
<el-option label="备煤车间" value="7"></el-option>
|
||
|
|
<el-option label="保卫部" value="8"></el-option>
|
||
|
|
<el-option label="企管部" value="9"></el-option>
|
||
|
|
<el-option label="高管" value="10"></el-option>
|
||
|
|
<el-option label="综合办" value="11"></el-option>
|
||
|
|
<el-option label="人力资源部" value="12"></el-option>
|
||
|
|
<el-option label="财务部" value="13"></el-option>
|
||
|
|
<el-option label="营销部" value="14"></el-option>
|
||
|
|
<el-option label="生产部" value="15"></el-option>
|
||
|
|
<el-option label="仓储中心" value="16"></el-option>
|
||
|
|
<el-option label="物流中心" value="17"></el-option>
|
||
|
|
<el-option label="办公室" value="18"></el-option>
|
||
|
|
<el-option label="审计监察部" value="19"></el-option>
|
||
|
|
<el-option label="法律事务部" value="20"></el-option>
|
||
|
|
<el-option label="财务部" value="21"></el-option>
|
||
|
|
<el-option label="供应部" value="22"></el-option>
|
||
|
|
<el-option label="销售部" value="23"></el-option>
|
||
|
|
<el-option label="生产计划部" value="24"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="" size="large" style="width: 50">
|
||
|
|
<el-select v-model="data.form.section" placeholder="请选工段"> </el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="" size="large">
|
||
|
|
<el-select v-model="data.form.position" placeholder="请选职务"> </el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="" size="large">
|
||
|
|
<el-select v-model="data.form.column" placeholder="请选栏目">
|
||
|
|
<el-option label="请选栏目" value="0"></el-option>
|
||
|
|
<el-option label="流程制度" value="1"></el-option>
|
||
|
|
<el-option label="工艺技术" value="2"></el-option>
|
||
|
|
<el-option label="设备管理" value="3"></el-option>
|
||
|
|
<el-option label="仪控仪表" value="4"></el-option>
|
||
|
|
<el-option label="机电维修" value="5"></el-option>
|
||
|
|
<el-option label="安全生产" value="6"></el-option>
|
||
|
|
<el-option label="质量管理" value="7"></el-option>
|
||
|
|
<el-option label="财务管理" value="8"></el-option>
|
||
|
|
<el-option label="人力资源" value="9"></el-option>
|
||
|
|
<el-option label="仓储物流" value="10"></el-option>
|
||
|
|
<el-option label="营销采购" value="11"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
<el-input
|
||
|
|
v-model="searchName"
|
||
|
|
style="width: 170px"
|
||
|
|
placeholder="请输入题目"
|
||
|
|
size="large"
|
||
|
|
></el-input>
|
||
|
|
<el-button type="success" style="width: 100px" size="large"
|
||
|
|
>查询</el-button
|
||
|
|
>
|
||
|
|
</span>
|
||
|
|
<el-table
|
||
|
|
ref="multipleTableRef"
|
||
|
|
border
|
||
|
|
:header-cell-style="{'width':'100%','background':'#F2F2F2','text-align':'center'}"
|
||
|
|
stripe
|
||
|
|
@selection-change="handleSelectionChange"
|
||
|
|
>
|
||
|
|
<el-table-column type="selection" />
|
||
|
|
<el-table-column prop="name" label="文章标题" width="650" />
|
||
|
|
<el-table-column prop="sex" label="所属栏目" width="100" />
|
||
|
|
<el-table-column prop="age" label="可见范围" width="100"/>
|
||
|
|
<el-table-column prop="num" label="访问数据" width="440" />
|
||
|
|
<el-table-column prop="abc" label="状态" width="70">
|
||
|
|
<template #default="row">
|
||
|
|
<el-switch
|
||
|
|
v-model="row.row.status"
|
||
|
|
:active-icon="Check"
|
||
|
|
:inactive-icon="Close"
|
||
|
|
@click="handleDelac"/>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column fixed="right" label="操作">
|
||
|
|
<template #default="{ row }">
|
||
|
|
<el-button type="success" size="large" @click="handleEdit(row)"
|
||
|
|
>修改</el-button
|
||
|
|
>
|
||
|
|
<el-button type="danger" size="large" @click="handleDel(row)"
|
||
|
|
>删除</el-button
|
||
|
|
>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
<!-- 新建/编辑弹框 -->
|
||
|
|
<Dialog
|
||
|
|
v-if="data.dialogShow"
|
||
|
|
v-model:data.dialogShow="data.dialogShow"
|
||
|
|
:row-info="data.rowInfo"
|
||
|
|
/>
|
||
|
|
<!-- 详情弹窗 -->
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { reactive, ref, toRefs, computed, onMounted } from "vue";
|
||
|
|
import { countdownEmits, ElMessageBox, ElTable } from "element-plus";
|
||
|
|
import { Timer } from "@element-plus/icons-vue";
|
||
|
|
import { Check, Close } from '@element-plus/icons-vue'
|
||
|
|
import axios from "axios"; // 导入公理函数库
|
||
|
|
import Dialog from "./dialog.vue";
|
||
|
|
const data = reactive({
|
||
|
|
dialogShow: false, // 新增/编辑弹框
|
||
|
|
rowInfo: {}, // 新增/编辑的数据
|
||
|
|
title: "", // 是新建还是修改
|
||
|
|
queryInfo:{
|
||
|
|
query:'',
|
||
|
|
pagenum:1,
|
||
|
|
pagesize:'',
|
||
|
|
},
|
||
|
|
form: {
|
||
|
|
name: "",
|
||
|
|
region: "",
|
||
|
|
date1: "",
|
||
|
|
date2: "",
|
||
|
|
delivery: false,
|
||
|
|
type: [],
|
||
|
|
resource: "",
|
||
|
|
desc: "",
|
||
|
|
section: "",
|
||
|
|
position: "",
|
||
|
|
column: "",
|
||
|
|
},
|
||
|
|
studentInfo: {},
|
||
|
|
});
|
||
|
|
const imageUrl = ref('');
|
||
|
|
// 处理子组件传递的图片数据
|
||
|
|
const jokeMes = ref([]) // 表格数据
|
||
|
|
const temJokeMes = ref([]) // 临时表格数据
|
||
|
|
const searchName = ref(""); // 用于查询的输入值
|
||
|
|
|
||
|
|
const multipleSelection = ref([]);
|
||
|
|
const handleNew=()=> {
|
||
|
|
data.title = "新增";
|
||
|
|
data.rowInfo = {};
|
||
|
|
data.dialogShow = true;
|
||
|
|
}
|
||
|
|
const handleEdit=(val:any)=> {
|
||
|
|
data.title = "修改";
|
||
|
|
data.dialogShow = true;
|
||
|
|
data.rowInfo = val;
|
||
|
|
}
|
||
|
|
const handleDel=(val:any)=> {
|
||
|
|
ElMessageBox.confirm("你确定删除这条信息吗?", "提示", {
|
||
|
|
confirmButtonText: "确认",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
})
|
||
|
|
.then(() => {
|
||
|
|
})
|
||
|
|
.catch(() => {
|
||
|
|
// 捕获错误
|
||
|
|
});
|
||
|
|
}
|
||
|
|
// 添加行
|
||
|
|
const handleSelectionChange=(val:any)=> {
|
||
|
|
multipleSelection.value = val;
|
||
|
|
}
|
||
|
|
const handleBatchDelete=()=> {
|
||
|
|
if (multipleSelection.value.length === 0) {
|
||
|
|
ElMessageBox.alert("请选择要删除的数据", "提示", {
|
||
|
|
confirmButtonText: "确定",
|
||
|
|
});
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
ElMessageBox.confirm("确定要批量删除所选数据吗？", "提示", {
|
||
|
|
confirmButtonText: "确定",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
})
|
||
|
|
.then(() => {
|
||
|
|
})
|
||
|
|
.catch(() => {
|
||
|
|
// 用户取消删除
|
||
|
|
});
|
||
|
|
}
|
||
|
|
const handleDelac=(val:any)=> {
|
||
|
|
ElMessageBox.confirm("你确定启用这条信息吗?", "提示", {
|
||
|
|
confirmButtonText: "确认",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
})
|
||
|
|
.then(() => {
|
||
|
|
|
||
|
|
})
|
||
|
|
.catch(() => {
|
||
|
|
// 捕获错误
|
||
|
|
});
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
*{
|
||
|
|
font-size: 15px;
|
||
|
|
font-weight: bolder;
|
||
|
|
}
|
||
|
|
.aaa {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(6, 1fr); /* 五列 */
|
||
|
|
align-items: start; /* 顶格对齐 */
|
||
|
|
float: right;
|
||
|
|
width: 700px;
|
||
|
|
height: 30px;
|
||
|
|
margin: 5px 0;
|
||
|
|
}
|
||
|
|
.button-margin {
|
||
|
|
margin: 5px 0; /* 设置右侧外边距，调整按钮之间的间距 */
|
||
|
|
}
|
||
|
|
:deep(.el-table th){
|
||
|
|
font-weight: bold; /* 设置表头字体加粗 */
|
||
|
|
color: #333; /* 设置表头字体颜色 */
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|