对接手机端

jero-web/src/views/phoneView/preHomoMangement.vue

@@ -6,6 +6,125 @@
            EDS1.2 EVO-G1.1-中国-03 Pre-Homo流程
         </span>
     </div>
+
+    <van-collapse class="collapse" v-model="activeNames">
+      <van-collapse-item :title="$t('essentialInformation')" name="1">
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('category')}}</span>
+          <span class="content-box-text">{{queryForm.category || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('inspectionItems')}}</span>
+          <span class="content-box-text">{{queryForm.inspectionItem || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('configurationItem')}}</span>
+          <span class="content-box-text">{{queryForm.configItem || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">WVTA ID</span>
+          <span class="content-box-text">{{queryForm.wvtaId || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('standardNo')}}</span>
+          <span class="content-box-text">{{queryForm.serialNumber || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('areaOfResponsibility')}}</span>
+          <span class="content-box-text">{{queryForm.dutyTerritoryName || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('engineeringInterfacePerson')}}</span>
+          <span class="content-box-text">{{queryForm.sdtName || '--'}}</span>
+        </div>
+      </van-collapse-item>
+
+      <van-collapse-item :title="$t('TaskRequirements')" name="2">
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('personLiable')}}</span>
+          <span class="content-box-text">{{queryForm.dutyPersonName || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('cutoffTime')}}</span>
+          <span class="content-box-text">{{queryForm.endTime || '--'}}</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">{{$t('typeOfDeliverables')}}</span>
+          <span class="content-box-text">{{queryForm.typeOfDeliverables || '--'}}</span>
+        </div>
+        <div class="content-box-type-text">
+          {{$t('deliverableTemplate')}}
+        </div>
+        <div class="content-box-type-text-one" v-if="dataSourceFile && dataSourceFile.length == 0">
+          --
+        </div>
+        <div class="content-box-type-text-one"
+             v-else
+             @click="dataSourceFileClick(item)"
+             v-for="item in dataSourceFile">
+          {{item.fileName}}
+        </div>
+        <!--        <div class="content-box-type-text">-->
+        <!--          {{$t('descriptionDeliverables')}}-->
+        <!--        </div>-->
+        <!--        <div class="content-box-type-text-Two">-->
+        <!--          {{queryProject[queryData.remarks] || '&#45;&#45;'}}-->
+        <!--        </div>-->
+      </van-collapse-item>
+      <van-collapse-item :title="$t('DeliverablesResult')" name="3">
+        <!--        v-for="item in deliverablesResultFile"-->
+        <!--        {{item.fileName}}-->
+        <div class="content-box-type-text-one"
+             @click="deliverablesResultFileClick(item)">
+          客户收到付款就的航空技术的发货的收费但是.pdf
+        </div>
+        <div class="content-box-type-text-one"
+             @click="deliverablesResultFileClick(item)">
+          客户收到付款就的航空技术的发货的收费但是.pdf
+        </div>
+      </van-collapse-item>
+      <van-collapse-item :title="$t('sponsorReview')" name="4" v-if="!queryData.isDisplay">
+        <van-form @submit="onSubmit" ref="form">
+          <van-field name="disposeResult"
+                     class="uploader"
+                     :rules="[{ required: true, message: $t('resultofhandling') + $t('cannotEmpty') }]"
+                     :label="$t('resultofhandling')">
+            <template #input>
+              <van-radio-group v-model="form.disposeResult" direction="horizontal">
+                <van-radio name="Accepted">
+                  {{$t('reviewAndPass')}}
+                </van-radio>
+                <van-radio name="Rejected">
+                  {{$t('reviewAndReturn')}}
+                </van-radio>
+              </van-radio-group>
+            </template>
+          </van-field>
+
+          <van-field
+            v-model.trim="form.approvalOpinion"
+            rows="4"
+            class="textarea"
+            autosize
+            :show-error="false"
+            :rules="[{ required: true, message: $t('feedbackMessage') + $t('cannotEmpty') }]"
+            :label="$t('feedback')"
+            maxlength="200"
+            type="textarea"
+            :placeholder="$t('pleaseEnter')+$t('feedbackMessage')"
+          />
+          <van-button class="submitButton"
+                      round
+                      block
+                      type="info"
+                      native-type="submit">{{$t('submit')}}
+          </van-button>
+        </van-form>
+      </van-collapse-item>
+    </van-collapse>
+    <van-overlay :show="show">
+      <van-loading type="spinner">{{textLoading}}</van-loading>
+    </van-overlay>
   </div>
 </template>
 
@@ -13,7 +132,17 @@
   export default {
     name: 'phonePreHomoMangement',
     data() {
-      return {}
+      return {
+        activeNames: ['1', '2', '3', '4'],
+        show: false,
+        textLoading: this.$t('loading'),
+        queryForm: {},
+        queryData: {},
+        form: {},
+        queryProject: {},
+        dataSourceFile: [],
+        deliverablesResultFile: []
+      }
     },
     mounted() {
       document.title = 'NIO GRP'
@@ -21,6 +150,9 @@
     methods: {
       iconClick() {
         this.$router.go(-1)
+      },
+      onSubmit() {
+
       }
     }
   }
@@ -33,6 +165,8 @@
   }
 
   .header-search {
+    /*padding-left: 0.4rem;*/
+    /*padding-right: 0.4rem;*/
     width: 100%;
     display: flex;
     position: sticky;
@@ -42,6 +176,7 @@
     z-index: 1000;
   }
 
+
   .icon {
     font-size: 0.66rem;
     width: 0.7rem;
@@ -63,4 +198,380 @@
     /*! autoprefixer: on;*/
     text-justify: inter-ideograph;
   }
+
+  .collapse {
+    margin-top: 0.6rem;
+  }
+
+  ::v-deep .van-cell {
+    padding: 0;
+  }
+
+  ::v-deep .van-cell::after {
+    border-bottom: none;
+  }
+
+  ::v-deep .van-collapse-item--border::after {
+    border-top: none;
+  }
+
+  ::v-deep .van-hairline--top-bottom::after, .van-hairline-unset--top-bottom::after {
+    border-width: 0;
+  }
+
+  ::v-deep .van-cell--clickable .van-cell__title span {
+    font-size: 0.44rem;
+    font-family: PingFang SC-Medium, PingFang SC;
+    font-weight: 600;
+    color: #040B29;
+  }
+
+  ::v-deep .collapse .van-cell--clickable .van-icon {
+    font-size: 0.44rem;
+    color: #040B29;
+  }
+
+  ::v-deep .van-collapse-item {
+    margin-bottom: 0.6rem;
+  }
+
+  .content-box-type {
+    display: flex;
+    margin-top: 0.08rem;
+    margin-bottom: 0.4rem;
+  }
+
+  .content-box-type:last-child {
+    margin-bottom: 0.1rem;
+  }
+
+  .content-box-left {
+    display: inline-block;
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #6F7385;
+    flex: auto;
+    min-width: 2rem;
+  }
+
+  .content-box-type-text {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #6F7385;
+    margin-bottom: 0.4rem;
+  }
+
+  .content-box-type-text-one {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 500;
+    color: #01A0AC;
+    margin-bottom: 0.4rem;
+    word-break: break-all;
+  }
+
+  .content-box-type-text-one:last-child {
+    margin-bottom: 0.1rem;
+  }
+
+  .content-box-type-text-Two {
+    display: inline-block;
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 500;
+    color: #040B29;
+    word-break: break-all;
+  }
+
+  .content-box-text {
+    text-align: right;
+    margin-left: 0.3rem;
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 500;
+    color: #040B29;
+    word-break: break-all;
+  }
+
+  ::v-deep .van-collapse-item__content {
+    padding: 0.5rem 0;
+  }
+
+  ::v-deep .van-step__circle-container .van-icon {
+    font-size: 0.55rem;
+    background: #fff;
+  }
+
+  ::v-deep .van-step--finish {
+    color: #00BEBE;
+  }
+
+  ::v-deep .van-step--vertical {
+    padding: 0.26rem 0 0.46rem 0;
+  }
+
+  ::v-deep .van-step--vertical:not(:last-child)::after {
+    border-bottom-width: 0;
+  }
+
+  .vanStepBox {
+    margin-left: 0.2rem;
+  }
+
+  .van-text {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 500;
+    color: #040B29;
+  }
+
+  .van-text-color {
+    padding: 0.19rem 0.3rem;
+    color: #26BD4B;
+    font-size: 0.34rem;
+    background: rgba(38, 189, 75, 0.12);
+    border-radius: 0.1rem;
+  }
+
+  .van-time {
+    font-size: 0.34rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #868A9A;
+    margin-top: 0.3rem;
+  }
+
+  .van-name {
+    color: #868A9A;
+    margin-right: 0.1rem;
+    font-size: 0.34rem;
+  }
+
+  .van-name-time {
+    color: #868A9A;
+    margin-left: 0.1rem;
+    font-size: 0.34rem;
+  }
+
+  .van-desgin {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #41475E;
+    margin-top: 0.3rem;
+    word-break: break-all;
+  }
+
+  .van-file {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #01A0AC;
+    margin-top: 0.3rem;
+    word-break: break-all;
+  }
+
+  ::v-deep .van-form .van-cell__title {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 500;
+    color: #595E72;
+    width: 100%;
+  }
+
+  ::v-deep .van-form .van-cell__value {
+    margin-top: 0.1rem;
+  }
+
+  ::v-deep .van-form .van-radio__icon .van-icon {
+    width: 0.45rem;
+    height: 0.45rem;
+    line-height: 0.38rem;
+  }
+
+  ::v-deep .van-form .van-radio__icon--checked .van-icon {
+    background-color: #00BEBE;
+    border-color: #00BEBE;
+  }
+
+  ::v-deep .van-form .van-radio__icon {
+    height: 0.45rem;
+  }
+
+  ::v-deep .van-form .van-radio__label {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 500;
+    color: #040B29;
+  }
+
+  ::v-deep .van-form .van-cell {
+    margin-bottom: 0.3rem;
+  }
+
+  .textarea {
+    display: block;
+  }
+
+  ::v-deep .van-form .textarea .van-field__control {
+    background: #F5F6F7;
+    border-radius: 0.12rem;
+    padding: 0.2rem;
+    margin-top: 0.1rem;
+  }
+
+  .uploader {
+    display: block;
+  }
+
+  .uploader-button {
+    margin-top: 0.2rem;
+  }
+
+  .uploader-button .van-button--primary {
+    background-color: #fff;
+    border: 0.03rem solid #00BEBE;
+    color: #01A0AC;
+    font-size: 0.38rem;
+    font-family: PingFang SC-Medium, PingFang SC;
+    font-weight: 500;
+  }
+
+  .uploader-button .van-button {
+    height: 0.9rem;
+    border-radius: 0.12rem;
+  }
+
+  .uploader-button .van-button .van-icon {
+    font-size: 0.42rem;
+    font-weight: 500;
+  }
+
+  ::v-deep .van-loading {
+    color: #fff;
+    font-size: 0.36rem;
+  }
+
+  ::v-deep .van-loading__text {
+    color: #fff;
+    font-size: 0.46rem;
+  }
+
+  ::v-deep .van-overlay {
+    z-index: 1001;
+    text-align: center;
+    line-height: 30;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .submitButton {
+    border-radius: 0.2rem;
+    background: #00B3BE;
+    border: none;
+    margin-top: 1.2rem;
+  }
+
+  ::v-deep .van-icon-success:before {
+    font-size: 0.34rem;
+    text-align: center;
+  }
+
+  ::v-deep .van-radio {
+    margin-bottom: 0.1rem;
+  }
+
+  .file-list {
+    width: 100%;
+    background: #FFFFFF;
+    border-radius: 0.2rem;
+    border: 0.02rem solid #E6E7EC;
+    padding: 0.26rem 0.4rem;
+    font-size: 0.38rem;
+    font-weight: 400;
+    color: #040B29;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 0.2rem;
+  }
+
+  .file-text {
+    display: inline-block;
+    margin-right: 0.3rem;
+    word-break: break-all;
+  }
+
+  .file-text-icon {
+    font-size: 0.41rem;
+    margin-left: 0.2rem;
+    color: #26BD4B;
+    font-weight: 600;
+  }
+
+  .icon-text {
+    font-size: 0.4rem;
+    color: #040B29;
+  }
+
+  ::v-deep .van-field--error .van-field__control::placeholder {
+    color: #BBBDC7;
+  }
+
+  .van-text-status {
+    margin-bottom: 0.3rem;
+    margin-top: 0.3rem;
+  }
+
+  .van-collapse-item:last-child {
+    margin-bottom: 0;
+  }
+
+  .AcceptedClass {
+    background: #e9f8ed;
+    color: #26BD4B;
+  }
+
+  .RejectedClass {
+    background: #fdeaea;
+    color: #E83030;
+  }
+
+  .TransferClass {
+    background: #fff6e8;
+    color: #FDA71C;
+  }
+
+  .ReturnedClass {
+    background: #fff6e8;
+    color: #FDA71C;
+  }
+
+  .AdoptClass {
+    background: #e9f8ed;
+    color: #26BD4B;
+  }
+
+  .ComplianceClass {
+    background: #e9f8ed;
+    color: #26BD4B;
+  }
+
+  .NonComplianceClass {
+    background: #fdeaea;
+    color: #E83030;
+  }
+
+  .trackedClass {
+    background: #fff6e8;
+    color: #FDA71C;
+  }
+
+  .NAClass {
+    background: #f1f1f3;
+    color: #707486;
+  }
 </style>