licp
2024-03-04 f7bd30c0b016c3766bdbd931e28ff90a8e05c7ba
完成设备工具明细弹框
已修改3个文件
321 ■■■■ 文件已修改
src/components/tool/value-table.vue 2 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/view/a6-device-management.vue 315 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/main.js 4 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/tool/value-table.vue
@@ -66,7 +66,7 @@
                        <span v-else>{{scope.row[a.label]}}</span>
                    </template>
                </el-table-column>
                <el-table-column fixed="right" align="center" label="操作" :width="50 + data.do.length * 30"
                <el-table-column fixed="right" align="center" label="操作" :width="60 + data.do.length * 35"
                    v-if="data.do.length > 0">
                    <template slot-scope="scope">
                        <el-button v-for="(a, ai) in data.do" :key="ai" :type="a.type"
src/components/view/a6-device-management.vue
@@ -19,7 +19,7 @@
    .search_label {
        width: 110px;
        font-size: 14px;
        text-align: right;
    }
@@ -35,6 +35,10 @@
        height: calc(100% - 60px - 80px - 10px - 40px);
        padding: 20px;
    }
  .el-form-item{
    margin-bottom: 16px;
  }
</style>
<template>
@@ -88,86 +92,212 @@
            <!-- 语法 子组件通过 this.$emit +传入方法名 调用父组件方法 例如  this.$emit(selectAllByOne) 就需在父组件声明并传入  @selectAllByOne="selectAllByOne"-->
            <ValueTable @selectAllByOne="selectAllByOne" @isUpdate="isUpdate" ref="ValueTable" :url="$api.deviceScope.selectDeviceParameter" :upUrl="$api.deviceScope.upDeviceParameter" :delUrl="$api.deviceScope.delDeviceParameter" :componentData="componentData" :key="upIndex"/>
        </div>
            <div>
            <el-dialog
                title="设备详情"
                :visible.sync="dialogVisible"
                width="70%"
                :before-close="handleClose">
                <el-row style="display:flex;justify-content: space-around;">
                    <!-- 左边布局 -->
                    <el-col  :span="7" >
                        <el-col>
                            <!-- 图片 -->
                            <img src="https://www.baidu.com/img/bd_logo1.png" alt="" style="width:100%;height: 30vh;">
                            <!-- 表单 -->
                            <el-form :label-position="labelPosition" :model="formData">
                                <el-form-item label="大类:" >
                                  <el-input style="width:75%" :disabled="isUp" v-model="formData.largeCategory"></el-input>
                                </el-form-item>
                                <el-form-item label="出厂日期">
                                  <el-input style="width:75%" :disabled="isUp" v-model="formData.dateProduction"></el-input>
                                </el-form-item>
                                <el-form-item label="设备负责人" >
                                  <el-input style="width:75%" :disabled="isUp" v-model="formData.equipmentManager"></el-input>
                                </el-form-item>
                                <el-form-item label="被授权人" >
                                    <el-input style="width:75%" :disabled="isUp" v-model="formData.authorizedPerson"></el-input>
                                  </el-form-item>
                                  <el-form-item v-if="!isUp" label="图片" >
                                    <div style="width:75%;border: 1px solid #DCDFE6;border-radius:4px;margin-left: 22%;display:flex;justify-content: space-around;">
                                            <div>{{formData.largeCategory}}</div>
                                            <div style="width: 40%;"></div>
                                            <div><el-button type="text">预览</el-button></div>
                                    </div>
                                  </el-form-item>
                              </el-form>
                        </el-col>
                    </el-col>
                    <!-- 中间布局 -->
                    <el-col  :span="7">
                        <el-form :label-position="labelPosition" :model="formData">
                            <el-form-item label="设备名称" >
                              <el-input style="width:75%" :disabled="isUp" v-model="formData.deviceName"></el-input>
                            </el-form-item>
                            <el-form-item label="内部编码">
                              <el-input style="width:75%" :disabled="isUp" v-model="formData.internalCode"></el-input>
                            </el-form-item>
                            <el-form-item label="资产编码" >
                              <el-input style="width:75%" :disabled="isUp" v-model="formData.assetCode"></el-input>
                            </el-form-item>
                            <el-form-item label="校准日期(月)" >
                                <el-input style="width:75%" :disabled="isUp" v-model="formData.calibrationDate"></el-input>
                              </el-form-item>
                          </el-form>
                    </el-col>
                    <!-- 右边布局 -->
                    <el-col  :span="7">
                        <el-form :label-position="labelPosition" :model="formData">
                            <el-form-item label="活动区域" >
                              <el-input style="width:75%" :disabled="isUp" v-model="formData.largeCategory"></el-input>
                            </el-form-item>
                            <el-form-item label="活动区域">
                              <el-input style="width:75%" :disabled="isUp" v-model="formData.latestTraceability"></el-input>
                            </el-form-item>
                            <el-form-item label="活动形式" >
                              <el-input style="width:75%" :disabled="isUp" v-model="formData.largeCategory"></el-input>
                            </el-form-item>
                            <el-form-item label="活动形式" >
                                <el-input style="width:75%" :disabled="isUp" v-model="formData.largeCategory"></el-input>
                              </el-form-item>
                          </el-form>
                    </el-col>
                </el-row>
                <span slot="footer" class="dialog-footer">
                    <el-row v-if="!isUp">
                        <el-button @click="dialogVisible = false">取 消</el-button>
                    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
                    </el-row>
                </span>
            </el-dialog>
        </div>
    <el-dialog
      :title="isUp?'设备详情':'档案修订'"
      :visible.sync="dialogVisible"
      width="70%"
      :before-close="handleClose">
      <el-row style="display:flex;justify-content: space-around;">
        <!-- 左边布局 -->
        <el-col  :span="7" >
          <el-col>
            <!-- 图片 -->
            <img src="https://www.baidu.com/img/bd_logo1.png" alt="" style="width:100%;height: 320px;marginBottom:16px">
            <!-- 表单 -->
            <el-form :label-position="labelPosition" :model="formData" label-width="90px">
              <el-form-item label="设备分类:" >
                <!-- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input> -->
                <el-select :disabled="isUp" v-model="formData.largeCategory" placeholder="请选择" size="small" style="width:100%">
                  <el-option
                    v-for="item in equipmentList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                    >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="出厂日期:">
                <el-date-picker
                style="width:100%"
                  :disabled="isUp"
                  v-model="formData.dateProduction"
                  type="datetime"
                  size="small"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="设备负责人:" >
                <!-- <el-input :disabled="isUp" v-model="formData.equipmentManager" size="small"></el-input> -->
                <el-select :disabled="isUp" v-model="formData.equipmentManager" placeholder="请选择" size="small" style="width:100%">
                  <el-option
                    v-for="item in responsiblePersonList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                    >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="被授权人:" >
                <!-- <el-input :disabled="isUp" v-model="formData.authorizedPerson" size="small"></el-input> -->
                <el-select :disabled="isUp" v-model="formData.authorizedPerson" size="small" multiple placeholder="请选择" style="width:100%">
                  <el-option
                    v-for="item in authorizerList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
                </el-form-item>
              </el-form>
          </el-col>
        </el-col>
        <!-- 中间布局 -->
        <el-col  :span="7">
          <el-form :label-position="labelPosition" :model="formData" label-width="116px">
            <el-form-item label="设备名称:" >
              <el-input :disabled="isUp" v-model="formData.deviceName" size="small"></el-input>
            </el-form-item>
            <el-form-item label="内部编码:">
              <el-input :disabled="isUp" v-model="formData.internalCode" size="small"></el-input>
            </el-form-item>
            <el-form-item label="资产编码:" >
              <el-input :disabled="isUp" v-model="formData.assetCode" size="small"></el-input>
            </el-form-item>
            <el-form-item label="校准日期(月):" >
              <el-date-picker
                :disabled="isUp"
                v-model="formData.calibrationDate"
                type="month"
                size="small"
                style="width:100%"
                placeholder="选择月">
              </el-date-picker>
              <!-- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input> -->
              </el-form-item>
              <el-form-item label="报废时间:" >
                <el-date-picker
                style="width:100%"
                  :disabled="isUp"
                  v-model="formData.calibrationDate"
                  type="datetime"
                  size="small"
                  placeholder="选择时间">
                </el-date-picker>
              <!-- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input> -->
              </el-form-item>
              <el-form-item label="验收记录:" >
              <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
              </el-form-item>
              <!-- 跟李经理确认不要这个字段 -->
              <!-- <el-form-item label="细类:" >
              <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
              </el-form-item> -->
              <el-form-item label="出厂编号:" >
              <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
              </el-form-item>
              <el-form-item label="购置日期:" >
                <el-date-picker
                style="width:100%"
                  :disabled="isUp"
                  v-model="formData.calibrationDate"
                  type="datetime"
                  size="small"
                  placeholder="选择日期">
                </el-date-picker>
              <!-- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input> -->
              </el-form-item>
              <el-form-item label="准确度量值:" >
              <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
              </el-form-item>
              <el-form-item label="备注:" >
              <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
              </el-form-item>
            </el-form>
        </el-col>
        <!-- 右边布局 -->
        <el-col  :span="7">
          <el-form :label-position="labelPosition" :model="formData" label-width="110px" ref="ruleForm">
            <el-form-item label="规格型号:" >
              <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
            </el-form-item>
            <el-form-item label="设备状态:">
              <!-- <el-input :disabled="isUp" v-model="formData.latestTraceability" size="small"></el-input> -->
              <el-select :disabled="isUp" v-model="formData.latestTraceability" placeholder="请选择" size="small" style="width:100%">
                  <el-option
                    v-for="item in deviceStatusList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                    >
                  </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="存放点:" >
              <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
            </el-form-item>
            <el-form-item label="最近追溯日期:" >
              <!-- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input> -->
              <el-date-picker
                style="width:100%"
                  :disabled="isUp"
                  v-model="formData.largeCategory"
                  type="datetime"
                  size="small"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="停用时间:" >
                <el-date-picker
                style="width:100%"
                  :disabled="isUp"
                  v-model="formData.largeCategory"
                  type="datetime"
                  size="small"
                  placeholder="选择时间">
                </el-date-picker>
              <!-- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input> -->
              </el-form-item>
              <el-form-item label="维修记录:" >
              <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
              </el-form-item>
              <el-form-item label="生产厂家:" >
              <el-input :disabled="isUp" v-model="formData.largeCategory" size="small" ></el-input>
              </el-form-item>
              <!-- 跟李经理确认不要这个字段 -->
              <!-- <el-form-item label="检测类型:" >
              <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
              </el-form-item> -->
              <el-form-item label="采购费用:" >
              <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
              </el-form-item>
              <el-form-item label="校准证书:" >
              <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
              </el-form-item>
              <el-form-item v-if="!isUp" label="图片:" >
                <div style="border: 1px solid #DCDFE6;border-radius:4px;height:32px;lineHeight:32px;display:flex;justify-content: space-around;font-size: 13px;">
                  <div v-if="formData.largeCategory">{{formData.largeCategory}}</div>
                  <el-upload
                      action="https://jsonplaceholder.typicode.com/posts/"
                      :on-success="handleSuccessUpImg"
                      :show-file-list="false"
                      accept='image/jpg,image/jpeg,image/png'
                      >
                      <el-button type="text" style="height:30px;paddingTop:8px">上传</el-button>
                    </el-upload>
                </div>
                </el-form-item>
            </el-form>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-row v-if="!isUp">
          <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" @click="submitForm">确 定</el-button>
        </el-row>
      </span>
    </el-dialog>
    </div>
</template>
@@ -226,7 +356,15 @@
                entityCopy: {},
                upIndex: 0,
                addDia: true,
                addPower: true
                addPower: true,
        //设备列表
        equipmentList:[],
        // 负责人列表
        responsiblePersonList:[],
        // 授权人列表
        authorizerList:[],
        // 设备状态列表
        deviceStatusList:[],
            }
        },
        mounted() {
@@ -241,7 +379,7 @@
                this.componentData.entity = this.HaveJson(this.entityCopy)
                this.upIndex++
            },
            // 权限分配
            getPower(radio) {
                let power = JSON.parse(sessionStorage.getItem('power'))
@@ -286,7 +424,14 @@
                //row = 点击对应行值一行值
                //复制给formData
                this.formData=row;
            }
            },
      // 上传图片成功
      handleSuccessUpImg(response, file, fileList){
        console.log(response, file, fileList)
      },
      submitForm(){
        this.dialogVisible = false
      }
            }
        }
</script>
</script>
src/main.js
@@ -12,8 +12,8 @@
import swal from 'sweetalert'
//本地
Vue.prototype.LOCATIONVUE = "http://127.0.0.1:80";
const javaApi = 'http://localhost:8001';
Vue.prototype.LOCATIONVUE = "http://127.0.0.1:80";
const javaApi = 'http://192.168.0.133:8001';
//胜云服务器
// Vue.prototype.LOCATIONVUE = "http://syxt.shxiao2.cn";
// const javaApi = 'http://122.114.52.69:8001';