<template>
|
<div class="Craftcenter">
|
<div class="content">
|
<div class="content-list">
|
<div class="list_top">
|
<div class="list_top_left">
|
<span
|
style="
|
width: 3.13rem;
|
height: 3.13rem;
|
background-color: #ffbf00;
|
border-radius: 50%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
"
|
>
|
<img
|
style="width: 1.5rem; height: 1.5rem"
|
src="@/assets/index/icon/icon.png"
|
alt=""
|
/>
|
</span>
|
</div>
|
<div class="list_top_right">
|
<div style="font-size: 1rem">电气</div>
|
<div
|
style="
|
font-size: 0.88rem;
|
color: rgba(136, 137, 138, 1);
|
margin-top: 0.81rem;
|
"
|
>
|
<span>此为任务作用中电气的的详情步骤工艺。</span>
|
<div style="display: flex; margin-top: 0.81rem">
|
<span style="margin-right: 1.25rem"
|
>步骤：{{ electric ? electric.maxNodal : "0" }}</span
|
>
|
<span
|
>套筒数量：{{ electric ? electric.sumTorqueSum : "0" }}</span
|
>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="list_bottom">
|
<div
|
style="
|
color: rgba(67, 134, 255, 1);
|
font-size: 0.88rem;
|
cursor: pointer;
|
"
|
@click="showdetails('电气')"
|
>
|
工艺明细
|
</div>
|
<span
|
style="width: 0.06rem; height: 1.5rem; background-color: #d9d9d9"
|
></span>
|
<div
|
style="
|
color: rgba(67, 134, 255, 1);
|
font-size: 0.88rem;
|
cursor: pointer;
|
"
|
@click="addcraft('电气')"
|
>
|
新增工艺
|
</div>
|
</div>
|
</div>
|
<div class="content-list">
|
<div class="list_top">
|
<div class="list_top_left">
|
<span
|
style="
|
width: 3.13rem;
|
height: 3.13rem;
|
background-color: #5bd171;
|
border-radius: 50%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
"
|
>
|
<img
|
style="width: 1.5rem; height: 1.5rem"
|
src="@/assets/index/icon/icon.png"
|
alt=""
|
/>
|
</span>
|
</div>
|
<div class="list_top_right">
|
<div style="font-size: 1rem">机械</div>
|
<div
|
style="
|
font-size: 0.88rem;
|
color: rgba(136, 137, 138, 1);
|
margin-top: 0.81rem;
|
"
|
>
|
<span>此为任务作用中机械的的详情步骤工艺。</span>
|
<div style="display: flex; margin-top: 0.81rem">
|
<span style="margin-right: 1.25rem"
|
>步骤：{{ mechanical ? mechanical.maxNodal : "0" }}</span
|
>
|
<span
|
>套筒数量：{{
|
mechanical ? mechanical.sumTorqueSum : "0"
|
}}</span
|
>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="list_bottom">
|
<div
|
style="
|
color: rgba(67, 134, 255, 1);
|
font-size: 0.88rem;
|
cursor: pointer;
|
"
|
@click="showdetails('机械')"
|
>
|
工艺明细
|
</div>
|
<span
|
style="width: 0.06rem; height: 1.5rem; background-color: #d9d9d9"
|
></span>
|
<div
|
style="
|
color: rgba(67, 134, 255, 1);
|
font-size: 0.88rem;
|
cursor: pointer;
|
"
|
@click="addcraft('机械')"
|
>
|
新增工艺
|
</div>
|
</div>
|
</div>
|
<div class="content-list">
|
<div class="list_top">
|
<div class="list_top_left">
|
<span
|
style="
|
width: 3.13rem;
|
height: 3.13rem;
|
background-color: #2c92f6;
|
border-radius: 50%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
"
|
>
|
<img
|
style="width: 1.5rem; height: 1.5rem"
|
src="@/assets/index/icon/icon.png"
|
alt=""
|
/>
|
</span>
|
</div>
|
<div class="list_top_right">
|
<div style="font-size: 1rem">地沟</div>
|
<div
|
style="
|
font-size: 0.88rem;
|
color: rgba(136, 137, 138, 1);
|
margin-top: 0.81rem;
|
"
|
>
|
<span>此为任务作用中地沟的的详情步骤工艺。</span>
|
<div style="display: flex; margin-top: 0.81rem">
|
<span style="margin-right: 1.25rem"
|
>步骤：{{ trench ? trench.maxNodal : "0" }}</span
|
>
|
<span>套筒数量：{{ trench ? trench.sumTorqueSum : "0" }}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="list_bottom">
|
<div
|
style="
|
color: rgba(67, 134, 255, 1);
|
font-size: 0.88rem;
|
cursor: pointer;
|
"
|
@click="showdetails('地沟')"
|
>
|
工艺明细
|
</div>
|
<span
|
style="width: 0.06rem; height: 1.5rem; background-color: #d9d9d9"
|
></span>
|
<div
|
style="
|
color: rgba(67, 134, 255, 1);
|
font-size: 0.88rem;
|
cursor: pointer;
|
"
|
@click="addcraft('地沟')"
|
>
|
新增工艺
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- 工艺明细弹出框 -->
|
<el-dialog
|
v-model="detailsDialogVisible"
|
title="电气"
|
:close-on-click-modal="false"
|
width="98%"
|
top="10vh"
|
:modal="false"
|
:show-close="false"
|
>
|
<template #header="{ close, titleId, titleClass }">
|
<div class="my-header">
|
<h4
|
:id="titleId"
|
:class="titleClass"
|
style="font-size: 1.2rem; font-weight: bold"
|
>
|
{{ title }}
|
</h4>
|
<el-icon size="25" @click="close"><CloseBold /></el-icon>
|
</div>
|
</template>
|
<div>
|
<div class="head">
|
<div class="serch">
|
<div class="time_box">
|
<div class="time">创建日期</div>
|
<el-date-picker
|
v-model="queryForm.selectTime"
|
prefix-icon="none"
|
clear-icon="none"
|
style="
|
font-size: 0.75rem !important;
|
border: 0.06rem solid rgba(222, 222, 222, 1);
|
border-radius: 0 0.25rem 0.25rem 0;
|
box-shadow: none;
|
width: 19rem;
|
height: 2rem;
|
border-left: 0;
|
"
|
format="YYYY-MM-DD HH:mm:ss"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
type="datetimerange"
|
range-separator="~"
|
start-placeholder="起始日期"
|
end-placeholder="截止日期"
|
size="small"
|
/>
|
</div>
|
<!-- <div class="serch_box">
|
<div class="serchb">
|
<el-select
|
v-model="queryForm.selectType"
|
placeholder="请选择"
|
size="small"
|
style="width: 100%; height: 100%; font-size: 0.15rem"
|
>
|
<el-option
|
v-for="item in selectoptions"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</div>
|
<input
|
v-model="queryForm.selectInput"
|
placeholder="请输入关键词搜索"
|
style="border-left: 0.06rem solid #e2e2e2"
|
/>
|
</div> -->
|
<el-button
|
type="primary"
|
size="small"
|
style="height: 2rem; margin-left: 0.98rem"
|
@click="handleQuery"
|
>查询</el-button
|
>
|
<el-button
|
size="small"
|
@click="resetQuery"
|
style="height: 2rem; font-size: 0.88rem"
|
>重置</el-button
|
>
|
</div>
|
<el-button
|
style="width: 5rem; height: 2rem; margin-top: 1.13rem"
|
@click="printExcel"
|
>批量导出</el-button
|
>
|
</div>
|
<el-table
|
style="margin-top: 1.13rem"
|
:data="gridData"
|
height="430"
|
:header-cell-style="{
|
background: 'rgba(250,250,250,1)',
|
color: '#101010',
|
fontSize: '0.88rem',
|
height: '3rem',
|
border: '0.01rem solid #eee',
|
}"
|
:row-style="{
|
color: '#101010',
|
fontSize: '0.88rem',
|
height: '3rem',
|
border: '0.01rem solid #eee',
|
}"
|
:cell-style="{
|
border: '0.01rem solid #eee',
|
}"
|
>
|
<el-table-column prop="setpNum" label="序号" min-width="2%" />
|
<el-table-column
|
prop="craftsStep"
|
label="工艺顶点/步骤"
|
min-width="3%"
|
/>
|
<el-table-column
|
prop="craftContent"
|
label="工艺内容"
|
min-width="5%"
|
/>
|
<el-table-column prop="tools" label="工具" min-width="2%" />
|
<el-table-column prop="date" label="物料" min-width="1%" />
|
<!-- <el-table-column prop="date" label="图片视频" min-width="2%" /> -->
|
<el-table-column prop="" label="是否涉及" min-width="2%" />
|
<el-table-column prop="nodal" label="排序" min-width="1%" />
|
<el-table-column prop="date" label="创建人" min-width="2%">
|
<template #default="">
|
{{ user }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="createTime" label="创建日期" min-width="2%" />
|
<el-table-column label="操作" min-width="3%">
|
<template #default="scope">
|
<el-button
|
type="text"
|
size="small"
|
@click="Editcraft(scope.row, '编辑')"
|
>编辑</el-button
|
>
|
<el-button type="text" size="small">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</el-dialog>
|
|
<!-- 新增工艺/编辑工艺 -->
|
<el-dialog
|
top="1%"
|
v-model="craftdialogVisible"
|
title="工艺信息"
|
width="50%"
|
:show-close="false"
|
@close="handleClose"
|
>
|
<template #header="{ titleId, titleClass }">
|
<div class="my-craftheader">
|
<h4
|
:id="titleId"
|
:class="titleClass"
|
style="font-size: 1.2rem; font-weight: bold"
|
>
|
工艺信息（{{ title }}）
|
</h4>
|
</div>
|
</template>
|
<el-form
|
:model="form"
|
label-width="auto"
|
label-position="top"
|
:rules="rules"
|
ref="ruleFormRef"
|
>
|
<el-row :gutter="10">
|
<el-col :span="16"
|
><el-form-item prop="craftsStep">
|
<template #label>
|
<span style="font-size: 0.88rem; color: black"
|
>工艺顶点/步骤</span
|
>
|
</template>
|
<el-input
|
size="small"
|
v-model="form.craftsStep"
|
placeholder="请输入"
|
style="height: 2rem"
|
/> </el-form-item
|
></el-col>
|
<el-col :span="8"
|
><el-form-item prop="DeviceCode">
|
<template #label>
|
<span style="font-size: 0.88rem; color: black">物料</span>
|
</template>
|
<el-select
|
v-model="WLvalue"
|
placeholder="请选择"
|
multiple
|
filterable
|
:remote-method="remoteMethod"
|
:loading="loading"
|
size="small"
|
style="width: 240px"
|
>
|
<el-option
|
v-for="item in WLoptions"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select> </el-form-item
|
></el-col>
|
</el-row>
|
<el-row :gutter="10">
|
<el-col :span="8"
|
><el-form-item prop="isinvolved">
|
<template #label>
|
<span style="font-size: 0.88rem; color: black">是否涉及</span>
|
</template>
|
<el-select
|
v-model="form.isinvolved"
|
placeholder="请选择"
|
size="small"
|
style="width: 240px"
|
>
|
<el-option
|
v-for="item in isoptions"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select> </el-form-item
|
></el-col>
|
<el-col :span="8"
|
><el-form-item prop="sort">
|
<template #label>
|
<span style="font-size: 0.88rem; color: black">排序</span>
|
</template>
|
<el-input
|
size="small"
|
v-model="form.setpNum"
|
placeholder="请输入"
|
style="height: 2rem"
|
/> </el-form-item
|
></el-col>
|
<el-col :span="8"
|
><el-form-item prop="tools">
|
<template #label>
|
<span style="font-size: 0.88rem; color: black">工具</span>
|
</template>
|
<el-select
|
v-model="form.tools"
|
placeholder="请选择"
|
multiple
|
filterable
|
:remote-method="GJremoteMethod"
|
:loading="GJloading"
|
size="small"
|
style="width: 240px"
|
value-key="id"
|
>
|
<el-option
|
v-for="item in GJoptions"
|
:key="item.id"
|
:label="item.toolName"
|
:value="item"
|
/> </el-select></el-form-item
|
></el-col>
|
</el-row>
|
<!-- <el-row>
|
<el-form-item prop="Unit">
|
<template #label
|
><span style="font-size: 0.88rem; color: black"
|
>图片视频</span
|
></template
|
>
|
<el-upload
|
class="avatar-uploader"
|
action="#"
|
list-type="picture-card"
|
:auto-upload="false"
|
>
|
<el-icon><Plus /></el-icon>
|
|
<template #file="{ file }">
|
<div>
|
<img
|
class="el-upload-list__item-thumbnail"
|
:src="file.url"
|
alt=""
|
/>
|
<span class="el-upload-list__item-actions">
|
<span
|
class="el-upload-list__item-preview"
|
@click="handlePictureCardPreview(file)"
|
>
|
<el-icon size="15"><zoom-in /></el-icon>
|
</span>
|
<span
|
v-if="!disabled"
|
class="el-upload-list__item-delete"
|
@click="handleDownload(file)"
|
>
|
<el-icon size="15"><Download /></el-icon>
|
</span>
|
<span
|
v-if="!disabled"
|
class="el-upload-list__item-delete"
|
@click="handleRemove(file)"
|
>
|
<el-icon size="15"><Delete /></el-icon>
|
</span>
|
</span>
|
</div>
|
</template>
|
</el-upload>
|
</el-form-item>
|
</el-row> -->
|
<el-row>
|
<h4
|
style="
|
color: rgba(16, 16, 16, 1);
|
font-size: 1.13rem;
|
font-weight: bold;
|
"
|
>
|
工艺内容
|
</h4>
|
</el-row>
|
<el-row>
|
<el-col>
|
<el-form-item prop="craftContent">
|
<template #label>
|
<span style="font-size: 0.88rem; color: black">内容描述</span>
|
</template>
|
<el-input v-model="form.craftContent" placeholder="请输入" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-form-item prop="Unit">
|
<template #label>
|
<span style="font-size: 0.88rem; color: black">选择套筒</span>
|
</template>
|
<div
|
style="
|
display: flex;
|
justify-content: space-between;
|
width: 32.5rem;
|
height: 25rem;
|
"
|
>
|
<div style="width: 50%; height: 100%; background: #f5f5f5">
|
<div
|
style="
|
padding: 0.88rem 0.88rem 0 0.88rem;
|
box-sizing: border-box;
|
"
|
>
|
<el-input
|
placeholder="请输入内容"
|
style="height: 2rem"
|
></el-input>
|
<div
|
style="height: 1.25rem; display: flex; align-items: center"
|
>
|
<span
|
style="color: rgba(28, 31, 35, 0.8); font-size: 0.75rem"
|
>共{{ checkList.length }}项</span
|
><span
|
style="
|
color: rgba(28, 31, 35, 0.8);
|
font-size: 0.75rem;
|
margin-left: 0.38rem;
|
"
|
>全选</span
|
>
|
</div>
|
</div>
|
<el-scrollbar height="20rem" style="padding-left: 0.88rem">
|
<el-checkbox-group
|
v-model="checkList"
|
style="display: flex; flex-direction: column"
|
>
|
<el-checkbox
|
v-for="item in sleeveData"
|
:key="item.id"
|
:label="item.articleName"
|
:value="item"
|
/>
|
</el-checkbox-group>
|
</el-scrollbar>
|
</div>
|
<div style="width: 50%; height: 100%">
|
<div
|
style="padding: 0.88rem 0 0 0.88rem; box-sizing: border-box"
|
>
|
<span style="color: rgb(167, 171, 176); font-size: 0.88rem"
|
>已选{{ checkList.length }}项</span
|
>
|
<span
|
style="
|
color: rgb(65, 70, 76);
|
font-size: 0.88rem;
|
margin-left: 1rem;
|
"
|
>清空</span
|
>
|
</div>
|
<el-scrollbar
|
height="calc(25rem - 44.15px)"
|
style="padding-left: 0.88rem"
|
>
|
<p
|
style="
|
display: flex;
|
justify-content: space-between;
|
margin: 0.5rem 0;
|
"
|
v-for="(item, index) in checkList"
|
:key="item"
|
class="scrollbar-demo-item"
|
>
|
<span>
|
{{ item.articleName }}
|
</span>
|
<span>
|
<el-input-number
|
size="small"
|
style="width: 7rem"
|
v-model="item.num"
|
:min="1"
|
:max="100"
|
@change="handleChange"
|
/>
|
</span>
|
</p>
|
</el-scrollbar>
|
</div>
|
</div>
|
</el-form-item>
|
</el-row>
|
</el-form>
|
<template #footer>
|
<div class="dialog-footer" style="text-align: center">
|
<el-button @click="craftdialogVisible = false" style="height: 2rem"
|
>取消</el-button
|
>
|
<el-button
|
type="primary"
|
@click="addprocess(ruleFormRef)"
|
style="height: 2rem"
|
>
|
保存
|
</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
<script setup>
|
import { ref, reactive, onMounted } from "vue";
|
import { formatTime } from "@/utils/index.js";
|
import {
|
GetSleeveandStep,
|
GetProcess,
|
AddProcess,
|
GetPageData,
|
ArticleInfom,
|
GetTool,
|
ExportApi,
|
} from "@/api/newapi/Process";
|
import { ElMessage } from "element-plus";
|
import { exportExcel } from "@/utils/index.js";
|
//工艺明细弹出框
|
const detailsDialogVisible = ref(false);
|
//工艺明细数据
|
const gridData = ref([]);
|
//电气数量
|
const electric = ref(null);
|
//机械数量
|
const mechanical = ref(null);
|
//地沟
|
const trench = ref(null);
|
//搜索
|
const queryForm = reactive({
|
selectName: "",
|
selectTime: [], // 时间范围
|
selectType: "",
|
selectInput: "",
|
});
|
const selectoptions = ref([
|
{
|
value: "setpNum",
|
label: "序号",
|
},
|
{
|
value: "tools",
|
label: "工具",
|
},
|
]);
|
//选择的套筒数据
|
const checkList = ref([]);
|
//获取数据
|
const title = ref("电气");
|
const showdetails = (val) => {
|
detailsDialogVisible.value = true;
|
title.value = val;
|
initData(title.value);
|
// GetProcess(val).then((res) => {
|
// gridData.value = res.data;
|
// });
|
};
|
//新增工艺/编辑工艺
|
const craftdialogVisible = ref(false);
|
const type = ref("新增");
|
const form = ref({
|
craftType: "", //工艺类型（组）
|
nodal: "", //节点
|
craftsStep: "", //工艺步骤
|
craftContent: "", //工艺内容
|
sleeveNum: "", //套筒数量
|
tools: "", //工具
|
isinvolved: "", //是否涉及
|
sort: "", //排序
|
craftID: 1,
|
setpNum: "",
|
torqueOne: null,
|
torqueOneQuantity: 0,
|
torqueSum: 0,
|
torqueTwo: null,
|
torqueTwoQuantity: 0,
|
articleOne: "",
|
articleTwo: "",
|
});
|
const props = { multiple: true };
|
//套筒数据
|
const sleeveData = ref([]);
|
|
//新增工艺
|
const addcraft = (row) => {
|
type.value = "新增";
|
title.value = row;
|
craftdialogVisible.value = true;
|
ArticleInfom({
|
page: 1,
|
rows: 100,
|
total: 0,
|
tableName: "",
|
sort: "",
|
order: "",
|
wheres: "",
|
export: true,
|
value: "",
|
filter: [
|
{
|
name: "",
|
value: "",
|
displayType: "",
|
},
|
],
|
}).then((res) => {
|
sleeveData.value = res.rows;
|
});
|
GetTool({
|
page: 1,
|
rows: 100,
|
total: 0,
|
tableName: "",
|
sort: "",
|
order: "",
|
wheres: "",
|
export: true,
|
value: "",
|
filter: [
|
{
|
name: "",
|
value: "",
|
displayType: "",
|
},
|
],
|
}).then((res) => {
|
GJoptions.value = res.rows;
|
});
|
};
|
//编辑工艺
|
const Editcraft = (row) => {
|
type.value = "编辑";
|
detailsDialogVisible.value = false;
|
craftdialogVisible.value = true;
|
form.value = row;
|
console.log(row, form);
|
};
|
//规则
|
const ruleFormRef = ref();
|
const rules = reactive({
|
craftType: [{ required: true, message: "请选择工艺类型", trigger: "change" }],
|
nodal: [{ required: true, message: "请选择节点", trigger: "change" }],
|
craftsStep: [{ required: true, message: "请输入工艺步骤", trigger: "blur" }],
|
craftContent: [
|
{ required: true, message: "请输入工艺内容", trigger: "blur" },
|
],
|
sleeveNum: [{ required: true, message: "请输入套筒数量", trigger: "blur" }],
|
});
|
|
//保存
|
const addprocess = async (formEl) => {
|
let string = "";
|
form.value.tools.forEach((item) => {
|
string += item.toolName + ",";
|
});
|
|
form.value.articleOne = checkList.value[0].num;
|
form.value.articleTwo = checkList.value[1].num;
|
form.value.tools = string;
|
form.value.craftType = title.value;
|
console.log(form.value);
|
|
if (!formEl) return;
|
await formEl.validate((valid, fields) => {
|
if (valid) {
|
AddProcess(form.value).then((res) => {
|
ElMessage({
|
message: res.message,
|
type: "success",
|
});
|
craftdialogVisible.value = false;
|
});
|
} else {
|
console.log("error submit!", fields);
|
}
|
});
|
};
|
//物料模糊查询
|
const WLvalue = ref(null);
|
const loading = ref(false);
|
const WLoptions = ref([]);
|
const remoteMethod = (query) => {
|
if (query) {
|
loading.value = true;
|
setTimeout(() => {
|
loading.value = false;
|
WLoptions.value = list.value.filter((item) => {
|
return item.label.toLowerCase().includes(query.toLowerCase());
|
});
|
}, 200);
|
} else {
|
WLoptions.value = [];
|
}
|
};
|
//工具模糊查询
|
const GJvalue = ref(null);
|
const GJloading = ref(false);
|
const GJoptions = ref([]);
|
const GJremoteMethod = (query) => {
|
if (query) {
|
GJloading.value = true;
|
setTimeout(() => {
|
GJloading.value = false;
|
GJoptions.value = list.value.filter((item) => {
|
return item.label.toLowerCase().includes(query.toLowerCase());
|
});
|
}, 200);
|
} else {
|
GJoptions.value = [];
|
}
|
};
|
//是否涉及
|
const isoptions = reactive([
|
{ label: "是", value: "是" },
|
{ label: "否", value: "否" },
|
]);
|
const user = ref(null);
|
//分页请求参数
|
const pageQuery = ref({
|
page: 1, //当前页面
|
rows: 10, //每页显示条数
|
order: "desc", //排序方式
|
sort: "craftID", //排序字段
|
wheres: "", //条件查询
|
});
|
|
const initData = (val) => {
|
// 查询条件
|
const startTime = formatTime(queryForm.selectTime[0]);
|
const endTime = formatTime(queryForm.selectTime[1]);
|
const filter = [
|
{
|
name: "gruop",
|
value: val,
|
displayType: "Contains",
|
},
|
{
|
name: queryForm.selectType,
|
value: queryForm.selectInput,
|
displayType: "Equal",
|
},
|
{
|
name: "pustatus",
|
value: queryForm.selectName,
|
displayType: "Contains",
|
},
|
{ name: "createTime", value: startTime, displayType: "ThanOrEqual" },
|
{ name: "createTime", value: endTime, displayType: "LessOrEqual" },
|
];
|
GetPageData({
|
...pageQuery.value,
|
filter,
|
}).then((res) => {
|
gridData.value = res.rows;
|
});
|
};
|
const printExcel = () => {
|
// 查询条件
|
const startTime = formatTime(queryForm.selectTime[0]);
|
const endTime = formatTime(queryForm.selectTime[1]);
|
const filter = [
|
{
|
name: "gruop",
|
value: title.value,
|
displayType: "String",
|
},
|
{
|
name: queryForm.selectType,
|
value: queryForm.selectInput,
|
displayType: "String",
|
},
|
{
|
name: "pustatus",
|
value: queryForm.selectName,
|
displayType: "String",
|
},
|
{ name: "createTime", value: startTime, displayType: "ThanOrEqual" },
|
{ name: "createTime", value: endTime, displayType: "LessOrEqual" },
|
];
|
ExportApi({
|
...pageQuery.value,
|
filter,
|
});
|
};
|
|
//数据检索事件
|
const handleQuery = () => {
|
pageQuery.value.page = 1;
|
initData(title.value);
|
};
|
const resetQuery = () => {
|
queryForm.value = { selectTime: [] };
|
pageQuery.value.page = 1;
|
initData(title.value);
|
};
|
|
// const handleChange = () => {
|
// console.log(checkList.value);
|
// };
|
const handleClose = () => {
|
console.log(checkList.value);
|
};
|
|
onMounted(() => {
|
GetSleeveandStep("电气").then((res) => {
|
electric.value = res.data[0];
|
});
|
GetSleeveandStep("机械").then((res) => {
|
mechanical.value = res.data[0];
|
});
|
GetSleeveandStep("地沟").then((res) => {
|
trench.value = res.data[0];
|
});
|
user.value = JSON.parse(localStorage.getItem("user")).userName;
|
});
|
</script>
|
<style lang="scss" scoped>
|
.Craftcenter {
|
display: flex;
|
justify-content: center;
|
background-color: rgba(0, 0, 0, 0.3);
|
.content {
|
display: flex;
|
justify-content: space-between;
|
|
margin-top: 5.88rem;
|
width: 75rem;
|
.content-list {
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
width: 22.69rem;
|
height: 11.44rem;
|
background-color: #fff;
|
.list_top {
|
display: flex;
|
padding: 1.38rem 1.38rem;
|
box-sizing: border-box;
|
.list_top_left {
|
margin-right: 0.94rem;
|
}
|
}
|
.list_bottom {
|
height: 3.06rem;
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
border: 0.06rem solid rgba(217, 217, 217, 1);
|
box-sizing: border-box;
|
padding: 0 4rem;
|
}
|
}
|
}
|
.my-header {
|
height: 3.94rem;
|
display: flex;
|
flex-direction: row;
|
justify-content: space-between;
|
gap: 1rem;
|
padding-left: 2.06rem;
|
border-bottom: 0.06rem solid rgba(233, 233, 233, 1);
|
}
|
.serch {
|
display: flex;
|
align-items: center;
|
.time_box {
|
display: flex;
|
align-items: center;
|
text-align: center;
|
|
.time {
|
box-sizing: border-box;
|
width: 6.88rem;
|
height: 2rem;
|
text-align: center;
|
border: 0.06rem solid rgba(222, 222, 222, 1);
|
border-radius: 0.25rem 0 0 0.25rem;
|
font-size: 0.75rem;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
}
|
.serch_box {
|
display: flex;
|
align-items: center;
|
text-align: center;
|
margin-left: 0.98rem;
|
border-radius: 0.38rem;
|
.serchb {
|
box-sizing: border-box;
|
width: 6.88rem;
|
height: 2rem;
|
text-align: center;
|
|
font-size: 0.75rem;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
input {
|
box-sizing: border-box;
|
outline: none;
|
width: 19rem;
|
height: 2rem;
|
border: 0.06rem solid rgba(222, 222, 222, 1);
|
border-radius: 0 0.25rem 0.25rem 0;
|
padding-left: 0.3125rem;
|
font-size: 1rem;
|
}
|
}
|
}
|
.my-craftheader {
|
height: 3.94rem;
|
display: flex;
|
flex-direction: row;
|
justify-content: space-between;
|
gap: 1rem;
|
border-bottom: 0.06rem solid rgba(233, 233, 233, 1);
|
}
|
}
|
.avatar-uploader .avatar {
|
width: 7rem;
|
height: 7rem;
|
display: block;
|
}
|
:deep(.avatar-uploader .el-upload) {
|
width: 7rem;
|
height: 7rem;
|
border: 0.0625rem dashed var(--el-border-color);
|
border-radius: 0.0375rem;
|
cursor: pointer;
|
position: relative;
|
overflow: hidden;
|
transition: var(--el-transition-duration-fast);
|
}
|
:deep(.el-upload-list__item) {
|
width: 7rem;
|
height: 7rem;
|
}
|
.avatar-uploader .el-upload:hover {
|
border-color: var(--el-color-primary);
|
}
|
|
.el-icon .avatar-uploader-icon {
|
font-size: 0.5rem;
|
color: #8c939d;
|
width: 0.81rem;
|
height: 0.81rem;
|
text-align: center;
|
}
|
</style>
|
