pengwei
2025-03-12 18fcb8ad28f583e3e1b99b23e4f7d9e1833dcd83
ÏîÄ¿´úÂë/client/src/views/tts/CraftCenter/Craftcenter.vue
@@ -33,8 +33,12 @@
            >
              <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 ? electric.maxNodal : "0" }}</span
                >
                <span
                  >套筒数量:{{ electric ? electric.sumTorqueSum : "0" }}</span
                >
              </div>
            </div>
          </div>
@@ -59,7 +63,7 @@
              font-size: 0.88rem;
              cursor: pointer;
            "
            @click="addcraft()"
            @click="addcraft('电气')"
          >
            æ–°å¢žå·¥è‰º
          </div>
@@ -97,8 +101,14 @@
            >
              <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 ? mechanical.maxNodal : "0" }}</span
                >
                <span
                  >套筒数量:{{
                    mechanical ? mechanical.sumTorqueSum : "0"
                  }}</span
                >
              </div>
            </div>
          </div>
@@ -123,7 +133,7 @@
              font-size: 0.88rem;
              cursor: pointer;
            "
            @click="addcraft()"
            @click="addcraft('机械')"
          >
            æ–°å¢žå·¥è‰º
          </div>
@@ -161,8 +171,10 @@
            >
              <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 ? trench.maxNodal : "0" }}</span
                >
                <span>套筒数量:{{ trench ? trench.sumTorqueSum : "0" }}</span>
              </div>
            </div>
          </div>
@@ -187,7 +199,7 @@
              font-size: 0.88rem;
              cursor: pointer;
            "
            @click="addcraft()"
            @click="addcraft('地沟')"
          >
            æ–°å¢žå·¥è‰º
          </div>
@@ -243,29 +255,45 @@
                size="small"
              />
            </div>
            <div class="serch_box">
              <div class="serchb">全局搜索</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.selectName"
                v-model="queryForm.selectInput"
                placeholder="请输入关键词搜索"
                style="border-left: 0.06rem solid #e2e2e2"
              />
            </div>
            </div> -->
            <el-button
              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>
@@ -290,16 +318,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="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="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="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
@@ -321,8 +361,8 @@
      v-model="craftdialogVisible"
      title="工艺信息"
      width="50%"
      :before-close="handleClose"
      :show-close="false"
      @close="handleClose"
    >
      <template #header="{ titleId, titleClass }">
        <div class="my-craftheader">
@@ -340,10 +380,11 @@
        label-width="auto"
        label-position="top"
        :rules="rules"
        ref="ruleFormRef"
      >
        <el-row :gutter="10">
          <el-col :span="16"
            ><el-form-item prop="DeviceName">
            ><el-form-item prop="craftsStep">
              <template #label>
                <span style="font-size: 0.88rem; color: black"
                  >工艺顶点/步骤</span
@@ -351,7 +392,7 @@
              </template>
              <el-input
                size="small"
                v-model="form.DeviceName"
                v-model="form.craftsStep"
                placeholder="请输入"
                style="height: 2rem"
              /> </el-form-item
@@ -362,13 +403,17 @@
                <span style="font-size: 0.88rem; color: black">物料</span>
              </template>
              <el-select
                v-model="value"
                v-model="WLvalue"
                placeholder="请选择"
                multiple
                filterable
                :remote-method="remoteMethod"
                :loading="loading"
                size="small"
                style="width: 240px"
              >
                <el-option
                  v-for="item in options"
                  v-for="item in WLoptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
@@ -378,18 +423,18 @@
        </el-row>
        <el-row :gutter="10">
          <el-col :span="8"
            ><el-form-item prop="Unit">
            ><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"
@@ -397,35 +442,39 @@
              </el-select> </el-form-item
          ></el-col>
          <el-col :span="8"
            ><el-form-item prop="Description">
            ><el-form-item prop="sort">
              <template #label>
                <span style="font-size: 0.88rem; color: black">排序</span>
              </template>
              <el-select
                v-model="value"
                placeholder="请选择"
              <el-input
                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
                v-model="form.setpNum"
                placeholder="请输入"
                style="height: 2rem"
              /> </el-form-item
          ></el-col>
          <el-col :span="8"
            ><el-form-item prop="Description">
            ><el-form-item prop="tools">
              <template #label>
                <span style="font-size: 0.88rem; color: black">工具</span>
              </template>
              <el-cascader
              <el-select
                v-model="form.tools"
                placeholder="请选择"
                multiple
                filterable
                :remote-method="GJremoteMethod"
                :loading="GJloading"
                size="small"
                style="width: 240px"
                :options="options"
                :props="props"
                clearable /></el-form-item
                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>
@@ -490,18 +539,18 @@
        </el-row>
        <el-row>
          <el-col>
            <el-form-item prop="Unit">
            <el-form-item prop="craftContent">
              <template #label>
                <span style="font-size: 0.88rem; color: black">内容描述</span>
              </template>
              <el-input v-model="input" placeholder="请输入" />
              <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>
              <span style="font-size: 0.88rem; color: black">选择套筒</span>
            </template>
            <div
              style="
@@ -527,7 +576,7 @@
                  >
                    <span
                      style="color: rgba(28, 31, 35, 0.8); font-size: 0.75rem"
                      >共0项</span
                      >共{{ checkList.length }}项</span
                    ><span
                      style="
                        color: rgba(28, 31, 35, 0.8);
@@ -539,9 +588,17 @@
                  </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-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%">
@@ -549,7 +606,7 @@
                  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
                    >已选{{ checkList.length }}项</span
                  >
                  <span
                    style="
@@ -564,8 +621,29 @@
                  height="calc(25rem - 44.15px)"
                  style="padding-left: 0.88rem"
                >
                  <p v-for="item in 0" :key="item" class="scrollbar-demo-item">
                    {{ item }}
                  <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>
@@ -580,7 +658,7 @@
          >
          <el-button
            type="primary"
            @click="craftdialogVisible = false"
            @click="addprocess(ruleFormRef)"
            style="height: 2rem"
          >
            ä¿å­˜
@@ -592,75 +670,314 @@
</template>
<script setup>
import { ref, reactive, onMounted } from "vue";
import { GetSleeveandStep } from "@/api/newapi/Process";
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({});
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 = reactive({
  DeviceName: "",
  DeviceCode: "",
  Spec: "",
  Unit: "",
  Description: "",
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;
  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) => {
  type.value = "编辑";
  detailsDialogVisible.value = false;
  craftdialogVisible.value = true;
  console.log(row, type);
  form.value = row;
  console.log(row, form);
};
//图片上传
const dialogImageUrl = ref("");
const dialogVisible = ref(false);
const disabled = ref(false);
//规则
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 handleRemove = (file) => {
  console.log(file);
//保存
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 handlePictureCardPreview = (file) => {
  dialogImageUrl.value = file.url;
  dialogVisible.value = true;
//数据检索事件
const handleQuery = () => {
  pageQuery.value.page = 1;
  initData(title.value);
};
const resetQuery = () => {
  queryForm.value = { selectTime: [] };
  pageQuery.value.page = 1;
  initData(title.value);
};
const handleDownload = (file) => {
  console.log(file);
// const handleChange = () => {
//   console.log(checkList.value);
// };
const handleClose = () => {
  console.log(checkList.value);
};
onMounted(() => {
  GetSleeveandStep("电气").then((res) => {
    console.log("123", res);
    electric.value = res.data[0];
  });
  GetSleeveandStep("机械").then((res) => {
    console.log("123", res);
    mechanical.value = res.data[0];
  });
  GetSleeveandStep("地沟").then((res) => {
    console.log("123", res);
    trench.value = res.data[0];
  });
  user.value = JSON.parse(localStorage.getItem("user")).userName;
});
</script>
<style lang="scss" scoped>
@@ -741,8 +1058,7 @@
        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;