春风项目四线(合箱线、总装线)
yyt
2024-05-23 04b8eff075a04db23e6f908855699b4d2954588c
jcdm-ui/src/views/main/bs/formulaChild/index.vue
@@ -107,7 +107,7 @@
          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>
        <el-descriptions class="margin-top" :column="4" :size="size" border>
        <el-descriptions class="margin-top" :column="4" border>
          <el-descriptions-item :span="1">
            <template slot="label">
              <i class="el-icon-user"></i>
@@ -148,34 +148,36 @@
          </el-table-column>
          <el-table-column label="产品编号" width="150" align="center" prop="productCode">
          </el-table-column>
          <el-table-column label="操作内容" :show-overflow-tooltip='true' width="150" align="center" prop="operationSteps">
<!--          <el-table-column label="操作内容" :show-overflow-tooltip='true' width="150" align="center" prop="operationSteps">
          </el-table-column>-->
          <el-table-column label="排序" width="90" align="center" prop="stepSort">
          </el-table-column>
          <el-table-column label="技术要求" width="150" :show-overflow-tooltip='true' align="center" prop="techRequirement">
          <el-table-column label="技术要求" width="380" :show-overflow-tooltip='true' align="center" prop="techRequirement">
          </el-table-column>
          <el-table-column label="图片" :show-overflow-tooltip='true' width="130" align="center" prop="picture">
            <!--            <template slot-scope="scope">-->
            <!--              <el-image-->
            <!--                style="width: 100px; height: 100px"-->
            <!--                :src="pjtUrl+scope.row.picture"-->
            <!--                :fit="fit">-->
            <!--              </el-image>-->
            <!--            </template>-->
          </el-table-column>
          <el-table-column label="类型" width="90" align="center" prop="operationType">
          </el-table-column>
          <el-table-column label="排序" width="90" align="center" prop="stepSort">
          </el-table-column>
          <el-table-column label="参数编码" width="130" align="center" prop="paramCode">
          </el-table-column>
          <el-table-column label="物料编码" width="130" align="center" prop="materialCode">
          </el-table-column>
          <el-table-column label="配方编码" width="130" align="center" prop="formulaCode">
          </el-table-column>
          <el-table-column label="图片" :show-overflow-tooltip='true' width="130" align="center" prop="picture">
            <template slot-scope="scope">
              <el-image
                style="width: 100px; height: 100px"
                :src="pjtUrl+scope.row.picture"
                :fit="fit">
              </el-image>
            </template>
          </el-table-column>
          <el-table-column label="备注" width="130" align="center" prop="remarks">
          </el-table-column>
          <el-table-column label="创建用户" width="130" align="center" prop="createUser">
          </el-table-column>
          <el-table-column label="创建时间" width="150" align="center" prop="createTime">
          <el-table-column label="创建时间" width="160" align="center" prop="createTime">
          </el-table-column>
          <el-table-column label="更改用户" width="130" align="center" prop="updateUser">
          </el-table-column>
@@ -234,7 +236,7 @@
          <el-input v-model="form.processesCode" placeholder="请输入工序" />
        </el-form-item>
        <el-form-item label="产品编号" prop="productCode">
          <el-input v-model="form.productCode" placeholder="请输入产品编号" />
          <el-input v-model="headerInformationData.productCode" :disabled="true" placeholder="请输入产品编号" />
        </el-form-item>
        <el-form-item label="操作内容" prop="operationSteps">
          <el-input v-model="form.operationSteps" placeholder="请输入操作内容" />
@@ -265,7 +267,22 @@
<!--          <el-input v-model="form.formulaCode" placeholder="请输入配方编码" />-->
<!--        </el-form-item>-->
        <el-form-item label="图片" prop="picture">
          <el-input v-model="form.picture" placeholder="请输入图片" />
<!--          <el-input v-model="form.picture" placeholder="请输入图片" />-->
          <el-upload
            ref="upload"
            :limit="1"
            accept=".jpg, .png"
            :action="upload.url"
            :headers="upload.headers"
            :on-remove="removes"
            :file-list="upload.fileList"
            :on-progress="handleFileUploadProgress"
            :on-success="handleFileSuccess"
            :auto-upload="false">
            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
            <el-button style="margin-left: 10px;" size="small" type="success" :loading="upload.isUploading" @click="submitUpload">上传到服务器</el-button>
            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
          </el-upload>
        </el-form-item>
        <el-form-item label="备注" prop="remarks">
          <el-input v-model="form.remarks" placeholder="请输入备注" />
@@ -280,6 +297,7 @@
</template>
<script>
import { getToken } from "@/utils/auth";
import { listFormula} from "@/api/main/bs/formula/formula";
import { listFormulaChild, getFormulaChild, delFormulaChild, addFormulaChild, updateFormulaChild } from "@/api/main/bs/formulaChild/formulaChild";
@@ -287,6 +305,17 @@
  name: "FormulaChild",
  data() {
    return {
      // 上传参数
      upload: {
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/common/upload",
        // 上传的文件列表
        fileList: []
      },
      pjtUrl: process.env.VUE_APP_BASE_API,
      headerInformationData:{
        formulaCode: "",
@@ -308,6 +337,7 @@
      // 总条数
      total: 0,
      formulaCode:  "",
      productCode:   "",
      // 配方配置子信息表格数据
      formulaChildList: [],
      // 弹出层标题
@@ -336,13 +366,16 @@
    };
  },
  created() {
    const formulaCode = this.$route.params && this.$route.params.formulaCode;
    let formulaCode = this.$route.query.formulaCode;
    this.queryParams.formulaCode = formulaCode;
    this.formulaCode = formulaCode;
    this.form.formulaCode = formulaCode;
    this.headerInformation();
    this.getList();
  },
  methods: {
    /** 工艺流程表头信息 */
    headerInformation() {
      listFormula(this.queryParams).then(response => {
@@ -416,18 +449,45 @@
    handleAdd() {
      this.reset();
      this.open = true;
      this.upload.fileList = [];
      this.titleName = "添加配方配置子信息";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.upload.fileList = []
      console.log(row)
      if(row.picture!==null && row.picture!==""){
        this.upload.fileList = [{ name: row.spareField1, url: row.picture }];
      }
      this.reset();
      const id = row.id || this.ids
      getFormulaChild(id).then(response => {
        console.log(response.data)
        this.form = response.data;
        this.open = true;
        this.titleName = "修改配方配置子信息";
      });
    },
    // 文件提交处理
    submitUpload() {
      this.$refs.upload.submit();
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      console.log(response)
      this.upload.isUploading = false;
      this.form.picture = response.url;
      this.form.spareField1 = response.originalFilename;
      this.msgSuccess(response.msg);
    },
    removes(){
      this.form.spareField1 = '';
      this.form.picture = '';
    },
    /** 提交按钮 */
    submitForm() {
      this.form.formulaCode = this.formulaCode;