380新产品,优化

yyt

2024-05-23 04b8eff075a04db23e6f908855699b4d2954588c

 jcdm-ui/src/views/main/cfkb/Instructions/index.vue

@@ -2,26 +2,29 @@
  <div class="app-container">
    <el-row :gutter="3">
      <el-col :span="6">
        <el-card shadow="always">
          <img style="width: 200px;height: 50px; margin-left: 40px; margin-top: 0px" src="@/assets/logo/jcdm2.png" alt="dark">
          <span style="margin-left: 66px; font-weight: bold">{{currentTime}}</span>
        <el-card shadow="always" class="boxSize">
          <div class="centerImg">
            <img style="width: 140px;height: 30px;" src="@/assets/logo/jcdm2.png" alt="dark">
<!--            <span class="nextLine" style="font-weight: bold">{{currentTime}}</span>-->
          </div>

        </el-card>
      </el-col>
      <el-col :span="3">
        <el-card shadow="always">
          <span class="centerText" style="margin-top: 26px">{{locationCode}}</span>
        <el-card shadow="always" class="boxSize">
          <span class="centerText" style="height: 60px">{{locationCode}}</span>
        </el-card>
      </el-col>
      <el-col :span="15">
        <el-card shadow="always">
          <span class="centerText">{{locationName}}</span>
        <el-card shadow="always" class="boxSize">
          <span class="centerText" >{{locationName}}</span>
        </el-card>
      </el-col>
    </el-row>
    <el-row :gutter="3" style="margin-top: 5px">
      <el-col :span="6">
        <div style="height: 600px;overflow: auto;">
          <div  class="container" style="height: 50px;background-color: #00afff;margin-bottom: 10px">
        <div style="height: 550px;overflow: auto;">
          <div  class="container" style="height: 50px;background-color: #00afff;margin-bottom: 5px">
            <span class="centered">作业流程</span>
          </div>
          <div v-for="(item,index) in tableData" :key="item.index" class="outerDiv" :id="'outerDiv'+index">
@@ -35,34 +38,40 @@
        </div>
      </el-col>
      <el-col :span="18">
        <el-col :span="20">
          <el-card style="height: 600px" shadow="always">
            <el-row style="height: 100px">
              <span style="color: #31b431;font-size: 30px;font-weight: bold">{{address}}</span>
        <el-col :span="18">
          <el-card style="height: 550px" shadow="always">
            <el-row style="height: 60px">
              <span style="color: #31b431;font-size: 20px;font-weight: bold">{{address}}</span>
            </el-row>
            <el-row style="height: 400px">
              <el-image style="height: 390px;width: 960px" :src="src"></el-image>
            <el-row style="height: 420px">
              <div class="centerImg">
                <el-image style="height: 400px;width: 400px;" :src="src"></el-image>
              </div>

<!--              {{src}}-->
            </el-row>
            <el-row style="height: 100px">
              <el-button type="primary" @click="backClick()" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-d-arrow-left">上一步</el-button>
              <el-button type="primary" @click="nextStep()" style="height: 50px; width: 130px; font-size: 20px; float: right">下一步<i class="el-icon-d-arrow-right"></i></el-button>
            <el-row style="height: 100%;width: 100%">
              <el-button type="primary" @click="backClick()" style="height: 50%; width: 20%; font-size: 20%; float: left" icon="el-icon-d-arrow-left">上一步</el-button>
              <el-button type="primary" @click="nextStep()" style="height: 50%; width: 20%; font-size: 20%; float: right">下一步<i class="el-icon-d-arrow-right"></i></el-button>
            </el-row>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card style="height: 600px" shadow="always">
            <el-row style="height: 100px;margin-top: 100px">
              <el-button type="primary" @click="processDocuments()" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-folder-opened">工艺文件</el-button>
        <el-col :span="6">
          <el-card style="height: 550px;width: 100%" shadow="always">
            <el-row >
              <div class="centerImg" style="height: 30%; margin-top: 60%">
                <el-button type="primary" @click="processDocuments()" style="height: 40%; width: 90%; font-size: 70%; float: left" icon="el-icon-folder-opened">工艺文件</el-button>
              </div>

            </el-row>
            <el-row style="height: 80px;margin-top: 5px">
              <el-button type="info" @click="changeProducts('2V91')" :class="{ 'active': isClickd === '2V91' }" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-s-unfold">2V91</el-button>
            <el-row style="height: 30%;margin-top: 40%" class="centerImg">
              <el-button type="info" @click="changeProducts('2V91')" :class="{ 'active': isClickd === '2V91' }" style="height: 40%; width: 80%; font-size: 70%; float: left" icon="el-icon-s-unfold">2V91</el-button>
            </el-row>
            <el-row style="height: 80px;">
              <el-button type="info" @click="changeProducts('191')" :class="{ 'active': isClickd === '191' }" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-s-unfold">191</el-button>
            <el-row style="height: 30%;margin-top: 5%" class="centerImg">
              <el-button type="info" @click="changeProducts('191')" :class="{ 'active': isClickd === '191' }" style="height: 40%; width: 80%; font-size: 70%; float: left" icon="el-icon-s-unfold">191</el-button>
            </el-row>
            <el-row style="height: 80px;">
              <el-button type="info" @click="changeProducts('0JWF')" :class="{ 'active': isClickd === '0JWF' }" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-s-unfold">0JWF</el-button>
            <el-row style="height: 30%;margin-top: 5%" class="centerImg">
              <el-button type="info" @click="changeProducts('0JWF')" :class="{ 'active': isClickd === '0JWF' }" style="height: 40%; width: 80%; font-size: 70%; float: left" icon="el-icon-s-unfold">0JWF</el-button>
            </el-row>
          </el-card>
        </el-col>
@@ -74,13 +83,12 @@
        title="工艺文件"
        :visible.sync="dialogVisible"
        width="70%"
        lock-scroll="false"
        @close="closeMethod"

      >
        <div><el-image style="height: 1090px;width: 960px;margin-left: 33px" :src="mainProcessSrc"></el-image></div>
        <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
    <el-button type="primary" @click="dialogVisible = false" style="margin-right: 80px">确 定</el-button>
  </span>
      </el-dialog>
    </div>
@@ -311,8 +319,8 @@
  width: fit-content;
  min-width: 102%;
  /*width: 300px;*/
  height: 50px;
  margin-bottom: 10px;
  height: 30px;
  margin-bottom: 5px;
}

.innerDiv1 {
@@ -340,6 +348,7 @@
  white-space: nowrap;
  padding-left: 5px;
  padding-right: 5px;
  font-size: 20px;
}
.container {
  display: flex;
@@ -357,13 +366,10 @@
.centerText{
  color: black;
  font-weight: bold;
  font-size: 40px;
  font-size: 20px;
  display: flex;
  justify-content: center;
  margin-top: 20px
}
::v-deep .el-card__body{
  height: 100px;
  margin-top: 5px
}
.active {
  background-color: #31b431; /* 点击后的背景色 */
@@ -375,5 +381,19 @@
::v-deep .el-dialog__footer{
  margin-top: 10px;
}
::v-deep .el-card .is-always-shadow{
  height: 60px;
}
.boxSize{
  height: 60px;
}
.nextLine{
  display: block;
}
.centerImg{
  display: flex;
  justify-content: center;
  align-items: center;
}

</style>