优化

pengwei

2025-04-10 d49c469a63ebb84623a2377e2c666307a2689025

 ÏîÄ¿´úÂë/client/src/views/tts/CraftCenter/Craftcenter.vue

@@ -33,8 +33,16 @@
            >
              <span>此为任务作用中电气的的详情步骤工艺。</span>
              <div style="display: flex; margin-top: 0.81rem">
                <span style="margin-right: 1.25rem">步骤：12</span>
                <span>套筒数量：34</span>
                <span style="margin-right: 1.25rem"
                  >步骤：{{
                    electric.length != 0 ? electric[0].maxNodal : "0"
                  }}</span
                >
                <span
                  >套筒数量：{{
                    electric != 0 ? electric[0].sumTorqueSum : "0"
                  }}</span
                >
              </div>
            </div>
          </div>
@@ -59,7 +67,7 @@
              font-size: 0.88rem;
              cursor: pointer;
            "
            @click="addcraft()"
            @click="addcraft('电气')"
          >
            æ–°å¢žå·¥è‰º
          </div>
@@ -97,8 +105,16 @@
            >
              <span>此为任务作用中机械的的详情步骤工艺。</span>
              <div style="display: flex; margin-top: 0.81rem">
                <span style="margin-right: 1.25rem">步骤：12</span>
                <span>套筒数量：34</span>
                <span style="margin-right: 1.25rem"
                  >步骤：{{
                    mechanical != 0 ? mechanical[0].maxNodal : "0"
                  }}</span
                >
                <span
                  >套筒数量：{{
                    mechanical.length != 0 ? mechanical[0].sumTorqueSum : "0"
                  }}</span
                >
              </div>
            </div>
          </div>
@@ -123,7 +139,7 @@
              font-size: 0.88rem;
              cursor: pointer;
            "
            @click="addcraft()"
            @click="addcraft('机械')"
          >
            æ–°å¢žå·¥è‰º
          </div>
@@ -161,8 +177,16 @@
            >
              <span>此为任务作用中地沟的的详情步骤工艺。</span>
              <div style="display: flex; margin-top: 0.81rem">
                <span style="margin-right: 1.25rem">步骤：12</span>
                <span>套筒数量：34</span>
                <span style="margin-right: 1.25rem"
                  >步骤：{{
                    trench.length != 0 ? trench[0].maxNodal : "0"
                  }}</span
                >
                <span
                  >套筒数量：{{
                    trench.length != 0 ? trench[0].sumTorqueSum : "0"
                  }}</span
                >
              </div>
            </div>
          </div>
@@ -187,7 +211,7 @@
              font-size: 0.88rem;
              cursor: pointer;
            "
            @click="addcraft()"
            @click="addcraft('地沟')"
          >
            æ–°å¢žå·¥è‰º
          </div>
@@ -213,9 +237,12 @@
          >
            {{ title }}
          </h4>
          <el-icon size="25" @click="close"><CloseBold /></el-icon>
          <el-icon size="25" @click="close">
            <CloseBold />
          </el-icon>
        </div>
      </template>

      <div>
        <div class="head">
          <div class="serch">
@@ -244,9 +271,23 @@
              />
            </div>
            <div class="serch_box">
              <div class="serchb">全局搜索</div>
              <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.selectName"
                v-model="queryForm.selectInput"
                placeholder="请输入关键词搜索"
                style="border-left: 0.06rem solid #e2e2e2"
              />
@@ -255,21 +296,24 @@
              type="primary"
              size="small"
              style="height: 2rem; margin-left: 0.98rem"
              @click="clicksearch"
              @click="handleQuery"
              >查询</el-button
            >
            <el-button
              size="small"
              @click="clickreset"
              @click="resetQuery"
              style="height: 2rem; font-size: 0.88rem"
              >重置</el-button
            >
          </div>
          <el-button style="width: 5rem; height: 2rem; margin-top: 1.13rem"
          <el-button
            style="width: 5rem; height: 2rem; margin-top: 1.13rem"
            @click="printExcel"
            >批量导出</el-button
          >
        </div>
        <el-table
          empty-text="暂无数据"
          style="margin-top: 1.13rem"
          :data="gridData"
          height="430"
@@ -290,16 +334,28 @@
            border: '0.01rem solid #eee',
          }"
        >
          <el-table-column prop="date" label="序号" min-width="2%" />
          <el-table-column prop="date" label="工艺顶点/步骤" min-width="3%" />
          <el-table-column prop="date" label="工艺内容" min-width="5%" />
          <el-table-column prop="date" 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="date" label="是否涉及" min-width="2%" />
          <el-table-column prop="date" label="排序" min-width="1%" />
          <el-table-column prop="date" label="创建人" min-width="1%" />
          <el-table-column prop="date" label="创建日期" min-width="2%" />
          <el-table-column prop="nodal" 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="material" 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="setpNum" 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
@@ -308,7 +364,9 @@
                @click="Editcraft(scope.row, '编辑')"
                >编辑</el-button
              >
              <el-button type="text" size="small">删除</el-button>
              <el-button type="text" size="small" @click="delProcess(scope.row)"
                >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
@@ -321,8 +379,8 @@
      v-model="craftdialogVisible"
      title="工艺信息"
      width="50%"
      :before-close="handleClose"
      :show-close="false"
      @close="resetForm(ruleFormRef)"
    >
      <template #header="{ titleId, titleClass }">
        <div class="my-craftheader">
@@ -335,100 +393,189 @@
          </h4>
        </div>
      </template>
      <el-form
        :model="form"
        label-width="auto"
        label-position="top"
        :rules="rules"
      >
        <el-row :gutter="10">
          <el-col :span="16"
            ><el-form-item prop="DeviceName">
              <template #label>
                <span style="font-size: 0.88rem; color: black"
                  >工艺顶点/步骤</span
                >
              </template>
              <el-input
                size="small"
                v-model="form.DeviceName"
                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="value"
                placeholder="请选择"
                size="small"
                style="width: 240px"
              >
                <el-option
                  v-for="item in options"
                  :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="Unit">
      <el-scrollbar height="44rem">
        <el-form
          :model="form"
          label-width="auto"
          label-position="top"
          :rules="rules"
          ref="ruleFormRef"
        >
          <el-row :gutter="10">
            <el-col :span="8"
              ><el-form-item prop="nodal">
                <template #label>
                  <span style="font-size: 0.88rem; color: black">序号</span>
                </template>
                <el-input
                  size="small"
                  v-model.number="form.nodal"
                  placeholder="请输入"
                  style="height: 2rem"
                /> </el-form-item
            ></el-col>

            <el-col :span="8"
              ><el-form-item prop="setpNum">
                <template #label>
                  <span style="font-size: 0.88rem; color: black">排序</span>
                </template>
                <el-input
                  size="small"
                  v-model.number="form.setpNum"
                  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-input
                  v-model="form.material"
                  style="height: 2rem"
                  placeholder="请输入"
                /> </el-form-item
            ></el-col>
          </el-row>

          <el-row :gutter="10">
            <el-col
              ><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-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="value"
                v-model="form.isinvolved"
                placeholder="请选择"
                size="small"
                style="width: 240px"
              >
                <el-option
                  v-for="item in options"
                  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="Description">
              <template #label>
                <span style="font-size: 0.88rem; color: black">排序</span>
              </template>
              <el-select
                v-model="value"
                placeholder="请选择"
                size="small"
                style="width: 240px"
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select> </el-form-item
          ></el-col>
          <el-col :span="8"
            ><el-form-item prop="Description">
              <template #label>
                <span style="font-size: 0.88rem; color: black">工具</span>
              </template>
              <el-cascader
                size="small"
                style="width: 240px"
                :options="options"
                :props="props"
                clearable /></el-form-item
          ></el-col>
        </el-row>
        <!-- <el-row>
          ></el-col> -->
            <el-col :span="8"
              ><el-form-item prop="tools">
                <template #label>
                  <div style="display: flex; align-items: center">
                    <span style="font-size: 0.88rem; color: black">工具</span>
                  </div>
                </template>
                <el-select
                  style="height: 2rem"
                  v-model="tools"
                  placeholder="请选择"
                  multiple
                  filterable
                  :remote-method="GJremoteMethod"
                  :loading="GJloading"
                  size="small"
                  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-col :span="4"
              ><el-form-item prop="tools">
                <template #label>
                  <div style="display: flex; align-items: center">
                    <span style="font-size: 0.88rem; color: black"
                      >第一次扭力的值</span
                    >
                  </div>
                </template>
                <el-input
                  size="small"
                  v-model="form.torqueOne"
                  placeholder="请输入"
                  style="height: 2rem"
                >
                  <template #suffix>
                    <span style="font-size: 0.88rem; color: black">N*m</span>
                  </template>
                </el-input>
              </el-form-item></el-col
            >

            <el-col :span="4"
              ><el-form-item prop="tools">
                <template #label>
                  <div style="display: flex; align-items: center">
                    <span style="font-size: 0.88rem; color: black">数量</span>
                  </div>
                </template>
                <el-input
                  size="small"
                  v-model="form.torqueOneQuantity"
                  placeholder="请输入"
                  style="height: 2rem" /></el-form-item
            ></el-col>

            <el-col :span="4"
              ><el-form-item prop="tools">
                <template #label>
                  <div style="display: flex; align-items: center">
                    <span style="font-size: 0.88rem; color: black"
                      >第二次扭力的值</span
                    >
                  </div>
                </template>
                <el-input
                  size="small"
                  v-model="form.torqueTwo"
                  placeholder="请输入"
                  style="height: 2rem"
                >
                  <template #suffix>
                    <span style="font-size: 0.88rem; color: black">N*m</span>
                  </template>
                </el-input></el-form-item
              ></el-col
            >

            <el-col :span="4"
              ><el-form-item prop="tools">
                <template #label>
                  <div style="display: flex; align-items: center">
                    <span style="font-size: 0.88rem; color: black">数量</span>
                  </div>
                </template>
                <el-input
                  size="small"
                  v-model="form.torqueTwoQuantity"
                  placeholder="请输入"
                  style="height: 2rem" /></el-form-item
            ></el-col>
          </el-row>
          <!-- <el-row>
          <el-form-item prop="Unit">
            <template #label
              ><span style="font-size: 0.88rem; color: black"
@@ -477,102 +624,154 @@
            </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="Unit">
              <template #label>
                <span style="font-size: 0.88rem; color: black">内容描述</span>
              </template>
              <el-input v-model="input" 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
          <el-row>
            <h4
              style="
                display: flex;
                justify-content: space-between;
                width: 32.5rem;
                height: 25rem;
                color: rgba(16, 16, 16, 1);
                font-size: 1.13rem;
                font-weight: bold;
              "
            >
              <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>
              å·¥è‰ºå†…容
            </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
                  type="textarea"
                  :rows="3"
                  v-model="form.craftContent"
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-form-item prop="checkList">
              <template #label>
                <div style="display: flex; align-items: center">
                  <span style="font-size: 0.88rem; color: black">选择套筒</span>
                </div>
              </template>
              <div
                style="
                  display: flex;
                  justify-content: space-between;
                  width: 32.5rem;
                  height: 25rem;
                "
              >
                <div style="width: 50%; height: 100%; background: #f5f5f5">
                  <div
                    style="height: 1.25rem; display: flex; align-items: center"
                    style="
                      padding: 0.88rem 0.88rem 0 0.88rem;
                      box-sizing: border-box;
                    "
                  >
                    <span
                      style="color: rgba(28, 31, 35, 0.8); font-size: 0.75rem"
                      >共0项</span
                    ><span
                    <!-- <el-input
                    placeholder="搜索"
                    style="height: 2rem; background: #f5f5f5; border: none"
                    :prefix-icon="Search"
                    v-model="value"
                  ></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
                      @click="handleCheckAllChange"
                      style="
                        color: rgba(28, 31, 35, 0.8);
                        font-size: 0.75rem;
                        margin-left: 0.38rem;
                        cursor: pointer;
                      "
                      >全选</span
                    > -->
                    </div>
                  </div>
                  <el-scrollbar height="20rem" style="padding-left: 0.88rem">
                    <el-checkbox-group
                      :indeterminate="isIndeterminate"
                      @change="checkChange"
                      v-model="checkboxId"
                      style="display: flex; flex-direction: column"
                    >
                      <el-checkbox
                        :max="2"
                        v-for="item in sleeveData"
                        :key="item.id"
                        :label="item.articleName"
                        :value="item.id"
                      />
                    </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
                      @click="clear"
                      style="
                        color: rgb(65, 70, 76);
                        font-size: 0.88rem;
                        margin-left: 1rem;
                        cursor: pointer;
                      "
                      >清空</span
                    >
                  </div>
                </div>
                <el-scrollbar height="20rem" style="padding-left: 0.88rem">
                  <p v-for="item in 0" :key="item" class="scrollbar-demo-item">
                    {{ item }}
                  </p>
                </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"
                    >已选0项</span
                  <el-scrollbar
                    height="calc(25rem - 44.15px)"
                    style="padding-left: 0.88rem"
                  >
                  <span
                    style="
                      color: rgb(65, 70, 76);
                      font-size: 0.88rem;
                      margin-left: 1rem;
                    "
                    >清空</span
                  >
                    <p
                      style="
                        display: flex;
                        justify-content: space-between;
                        margin: 0.5rem 0;
                      "
                      v-for="item in checkList"
                      :key="item ? item.id : ''"
                      class="scrollbar-demo-item"
                    >
                      <span>
                        {{ item ? 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>
                <el-scrollbar
                  height="calc(25rem - 44.15px)"
                  style="padding-left: 0.88rem"
                >
                  <p v-for="item in 0" :key="item" class="scrollbar-demo-item">
                    {{ item }}
                  </p>
                </el-scrollbar>
              </div>
            </div>
          </el-form-item>
        </el-row>
      </el-form>
            </el-form-item>
          </el-row>
        </el-form>
      </el-scrollbar>

      <template #footer>
        <div class="dialog-footer" style="text-align: center">
          <el-button @click="craftdialogVisible = false" style="height: 2rem"
@@ -580,7 +779,7 @@
          >
          <el-button
            type="primary"
            @click="craftdialogVisible = false"
            @click="addprocess(ruleFormRef)"
            style="height: 2rem"
          >
            ä¿å­˜
@@ -591,76 +790,502 @@
  </div>
</template>
<script setup>
import { ref, reactive, onMounted } from "vue";
import { GetSleeveandStep } from "@/api/newapi/Process";
//工艺明细弹出框
const detailsDialogVisible = ref(false);
//
const gridData = ref([]);
//电气数量
// const 
//搜索
const queryForm = reactive({
import { ref, reactive, onMounted, toRef, computed } from "vue";
import { Search } from "@element-plus/icons-vue";
import {
  GetSleeveandStep,
  GetProcess,
  AddProcess,
  GetPageData,
  ArticleInfom,
  GetTool,
  ExportApi,
  DelProcess,
  AddOrUpdateProcess,
} from "@/api/newapi/Process";
import { ElMessage } from "element-plus";
import { formatTime } from "@/utils/index.js";

// åˆå§‹åŒ–数据
const obj = {
  selectName: "",
  selectTime: [], // æ—¶é—´èŒƒå›´
});
const title = ref("电气");
const showdetails = (val) => {
  detailsDialogVisible.value = true;
  title.value = val;
  selectType: "", //选择的类型
  selectInput: "", //输入的数据
};
//工艺明细数据
const gridData = ref([]);
//套筒数据
const sleeveData = ref([]);
//选择的套筒数据
const checkList = ref([]);
//电气数量
const electric = ref([]);
//机械数量
const mechanical = ref([]);
//地沟
const trench = ref([]);
//新增工艺/编辑工艺
const craftdialogVisible = ref(false);
const type = ref("新增");
const form = reactive({
  DeviceName: "",
  DeviceCode: "",
  Spec: "",
  Unit: "",
  Description: "",
//获取数据
const title = ref("电气");
//表单ref值
const ruleFormRef = ref();
//用户数据
const user = ref(null);

const tools = ref([]);
//搜索
const queryForm = toRef({ ...obj });
const isIndeterminate = ref(true);
//工艺明细弹出框
const detailsDialogVisible = ref(false);
//新增工艺弹出框
const craftdialogVisible = ref(false);
//搜索字段选择
const selectoptions = ref([
  {
    value: "setpNum",
    label: "排序",
  },
  {
    value: "tools",
    label: "工具",
  },
]);
//是否涉及
const isoptions = reactive([
  { label: "是", value: "是" },
  { label: "否", value: "否" },
]);

//表单规则
const rules = reactive({
  craftstype: [
    { required: true, message: "请选择工艺类型", trigger: "change" },
  ],
  craftsStep: [{ required: true, message: "请输入工艺步骤", trigger: "blur" }],
  craftContent: [
    { required: true, message: "请输入工艺内容", trigger: "blur" },
  ],
  nodal: [{ required: true, message: "请输入序号", trigger: "blur" }],
  setpNum: [{ required: true, message: "请输入排序号", trigger: "blur" }],
});

// isinvolved: "", //是否涉及
//新增工艺/编辑工艺表单数据
const form = ref({
  id: 0,
  craftstype: "", //工艺类型（组）
  nodal: null, //节点
  craftsStep: "", //工艺步骤
  craftContent: "", //工艺内容
  sleeveNum: "", //套筒数量
  tools: "", //工具
  setpNum: null,
  torqueOne: 0,
  torqueOneQuantity: 0,
  articleone: "",
  aritcleoneid: "",
  aritcletowid: "",
  articletwo: "",
  torqueSum: 0,
  torqueTwo: 0,
  torqueTwoQuantity: 0,
  material: "",
  creater: localStorage.getItem("user")
    ? JSON.parse(localStorage.getItem("user")).userName
    : "",
  createDate: formatTime(new Date()),
});

const props = { multiple: true };
const userName = ref("");

//新增工艺
const addcraft = (row) => {
  type.value = "新增";
  title.value = row;
  craftdialogVisible.value = true;
  console.log(row, type);
  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) => {
  let data = Object.assign({}, row);
  type.value = "编辑";
  detailsDialogVisible.value = false;
  craftdialogVisible.value = true;
  console.log(row, type);
};
//图片上传
const dialogImageUrl = ref("");
const dialogVisible = ref(false);
const disabled = ref(false);
  form.value = data;
  tools.value = data.tools ? data.tools.split(",") : "";
  console.log("tools", tools.value);

const handleRemove = (file) => {
  console.log(file);
  checkboxId.value = [Number(row.articleOneid), Number(row.articleTowid)];
  ArticleInfom({
    page: 1,
    rows: 100,
    total: 0,
    tableName: "",
    sort: "",
    order: "",
    wheres: "",
    export: true,
    value: "",
    filter: [
      {
        name: "",
        value: "",
        displayType: "",
      },
    ],
  }).then((res) => {
    sleeveData.value = res.rows;
    checkList.value = res.rows.map((item) => {
      if (Number(row.articleOneid) == item.id) {
        return {
          ...item,
          num: row.articleOne,
        };
      } else if (item.id == row.articleTowid) {
        return {
          ...item,
          num: row.articleTwo,
        };
      } else {
        return {};
      }
    });
    checkList.value = checkList.value.filter((item) => {
      return Object.keys(item).length > 0;
    });
  });

  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 handlePictureCardPreview = (file) => {
  dialogImageUrl.value = file.url;
  dialogVisible.value = true;
const showdetails = (val) => {
  detailsDialogVisible.value = true;
  title.value = val;
  initData(title.value);
  // GetProcess(val).then((res) => {
  //   gridData.value = res.data;
  // });
};
//保存
const addprocess = async (formEl) => {
  console.log(checkboxId.value);
  userName.value = JSON.parse(localStorage.getItem("user")).userName;
  let string = "";
  if (tools.value.length > 0) {
    string = tools.value
      .map((item) => {
        return typeof item == "string" ? item : item.toolName;
      })
      .join(",");
  }
  if (form.value.nodal == 0) {
    ElMessage({
      message: "序号最小为1",
      type: "warning",
    });
    return;
  }
  console.log(checkList.value);

  form.value.aritcleoneid =
    checkList.value.length != 0 ? checkList.value[0].id : "";
  form.value.articleone =
    checkList.value.length != 0 ? checkList.value[0].num : "";
  form.value.aritcletowid =
    checkList.value.length != 0 && checkList.value.length > 1
      ? checkList.value[1].id
      : "";
  form.value.articletwo =
    checkList.value.length != 0 && checkList.value.length > 1
      ? checkList.value[1].num
      : "";
  form.value.creater = userName.value;
  form.value.tools = string;
  form.value.craftstype = title.value;
  form.value.id = form.value.craftID ? form.value.craftID : 0;
  form.value.torqueSum = computed(() => {
    if (form.value.torqueOne > 1 && form.value.torqueTwo > 1) {
      return 2;
    } else if (form.value.torqueOne > 1 || form.value.torqueTwo > 1) {
      return 1;
    } else {
      return 0;
    }
  });
  if (!formEl) return;
  await formEl.validate((valid, fields) => {
    if (valid) {
      AddOrUpdateProcess(form.value).then((res) => {
        ElMessage({
          message: form.value.craftID ? "修改成功" : "创建成功",
          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 handleDownload = (file) => {
  console.log(file);
//分页请求参数
const pageQuery = ref({
  page: 1, //当前页面
  rows: 100, //每页显示条数
  order: "desc", //排序方式
  sort: "", //排序字段
  wheres: "", //条件查询
});
//页面初始化数据
const initData = (val) => {
  // æŸ¥è¯¢æ¡ä»¶
  const startTime = formatTime(queryForm.value.selectTime[0]);
  const endTime = formatTime(queryForm.value.selectTime[1]);
  const filter = [
    {
      name: "CraftType",
      value: val,
      displayType: "String",
    },
    {
      name: queryForm.value.selectType,
      value: queryForm.value.selectInput,
      displayType: "like",
    },
    {
      name: "pustatus",
      value: queryForm.value.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 handleQuery = () => {
  pageQuery.value.page = 1;
  initData(title.value);
};
// é‡ç½®æ–¹æ³•
const resetQuery = () => {
  queryForm.value = Object.assign({}, obj);
  pageQuery.value.page = 1;
  initData(title.value);
};
//重置表单
const resetForm = (formEl) => {
  if (!formEl) return;
  formEl.resetFields();
  form.value = Object.assign(
    {},
    {
      craftstype: "", //工艺类型（组）
      nodal: "", //节点
      craftsStep: "", //工艺步骤
      craftContent: "", //工艺内容
      sleeveNum: "", //套筒数量
      tools: "", //工具
      isinvolved: "", //是否涉及
      setpNum: "",
      torqueOne: 0,
      torqueOneQuantity: 0,
      articleone: "",
      articleoneid: "",
      articletowid: "",
      articletwo: "",
      torqueSum: 0,
      torqueTwo: 0,
      torqueTwoQuantity: 0,
      creater: "",
      createDate: formatTime(new Date()),
    }
  );
  tools.value = [];
  checkList.value = [];
  checkboxId.value = [];
};
//导出方法
const printExcel = () => {
  // æŸ¥è¯¢æ¡ä»¶
  const startTime = formatTime(queryForm.value.selectTime[0]);
  const endTime = formatTime(queryForm.value.selectTime[1]);
  const filter = [
    {
      name: "gruop",
      value: title.value,
      displayType: "String",
    },
    {
      name: queryForm.value.selectType,
      value: queryForm.value.selectInput,
      displayType: "String",
    },
    {
      name: "pustatus",
      value: queryForm.value.selectName,
      displayType: "String",
    },
    { name: "createTime", value: startTime, displayType: "ThanOrEqual" },
    { name: "createTime", value: endTime, displayType: "LessOrEqual" },
  ];
  ExportApi({
    ...pageQuery.value,
    filter,
  });
};
//清空
const clear = () => {
  checkList.value = [];
};
const checkboxId = ref([]); //复选框选中事件
const checkChange = (e) => {
  checkList.value = [];
  sleeveData.value.forEach((item, index) => {
    if (checkboxId.value.includes(item.id)) {
      checkList.value.push({
        ...item,
        num: 1,
      });
    }
  });
};
const handleChange = () => {
  console.log(checkList.value);
};
const handleCheckAllChange = (val) => {
  checkList.value = val ? sleeveData.value : [];
  isIndeterminate.value = false;
};
// åˆ é™¤å·¥è‰º
const delProcess = (val) => {
  console.log(val);

  DelProcess([val.craftID]).then((res) => {
    ElMessage({
      message: "删除成功",
      type: "success",
    });
    initData(title.value);
  });
};

onMounted(() => {
  GetSleeveandStep("电气").then((res) => {
    console.log("123", res);
  GetSleeveandStep().then((res) => {
    electric.value = res.data.filter((item) => {
      return item.craftType == "电气";
    });
    mechanical.value = res.data.filter((item) => {
      return item.craftType == "机械";
    });
    trench.value = res.data.filter((item) => {
      return item.craftType == "地沟";
    });
    console.log(electric.value);
  });
  GetSleeveandStep("机械").then((res) => {
    console.log("123", res);
  });
  GetSleeveandStep("地沟").then((res) => {
    console.log("123", res);
  });
  user.value = JSON.parse(localStorage.getItem("user")).userName;
});
</script>
<style lang="scss" scoped>
@@ -668,12 +1293,14 @@
  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;
@@ -681,14 +1308,17 @@
      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;
@@ -700,6 +1330,7 @@
      }
    }
  }

  .my-header {
    height: 3.94rem;
    display: flex;
@@ -709,9 +1340,11 @@
    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;
@@ -730,24 +1363,26 @@
        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;
        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;
      }

      input {
        box-sizing: border-box;
        outline: none;
@@ -760,6 +1395,7 @@
      }
    }
  }

  .my-craftheader {
    height: 3.94rem;
    display: flex;
@@ -769,11 +1405,13 @@
    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;
@@ -784,10 +1422,12 @@
  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);
}