需求变更

src/views/menu/message/index.vue

@@ -48,6 +48,7 @@
           <div v-if="selected.fileList" class="file-box" >
             附件：
             <div v-for="(v,i) in selected.fileList">
+              <van-icon color="#1989fa" name="guide-o" />
               <span style="color: #1989fa;" @click="preview(v)"  :key="v.name">{{v.name}}</span>
             </div>
           </div>

src/views/menu/safetyBook/detail.vue

@@ -20,6 +20,7 @@
             <template #label>
               <div class="file-list">
                 <div class="file-item" v-for="(file,index) in v.files" :key="index">
+                  <van-icon color="#1989fa" name="guide-o" />
                   <span style="color: #1989fa;" @click="preview(file)"  :key="file.name">{{file.name}}</span>
                 </div>
               </div>

src/views/menu/safetyBook/index.vue

@@ -13,11 +13,11 @@
           :pullup="pullup">
           <empty v-if="!dataList.length" />
           <card class="list-item" v-else v-for="(v,i) in dataList" :key="i">
-            <p class="item-title">{{v.orgName}}</p>
+            <p class="item-title">{{getDictLabel(v.type,'safety_book_type')}}</p>
             <div :title="v.orgName" @click="clickItem(v)">
-              <van-cell class="item-cell" title="所属年度" :value="`${v.year} 年`" >
+              <van-cell class="item-cell" title="签署机构" :value="v.orgName" >
               </van-cell>
-              <van-cell class="item-cell" title="签署类型" :value="getDictLabel(v.type,'safety_book_type')" >
+              <van-cell class="item-cell" title="所属年度" :value="`${v.year} 年`" >
               </van-cell>
               <van-cell class="item-cell" title="添加时间" :value="dayjs(v.createTime).format('YYYY-MM-DD HH:mm')">
               </van-cell>
@@ -134,7 +134,7 @@ export default {
 .list-item{
   .item-title{
     font-size: 28px;
-    color: #333;
+    color: #1989fa;
     padding-bottom: 20px ;
     border-bottom: 1px solid #f4f4f4;
   }

src/views/menu/visitRegister/add.vue

@@ -76,8 +76,7 @@
             <van-cell required title="添加人员">
               <template #right-icon>
                 <div class="flex-box">
-                  <span style="color: #aaa;"></span>
-                  <van-switch size="20px" v-model="checked" />
+                  <van-button  type="info" size="mini" @click="openPicker">点击添加</van-button>
                 </div>
               </template>
             </van-cell>
@@ -108,49 +107,74 @@
         </van-swipe-cell>
       </div>
 
+      <div class="big-btn-box" >
+        <van-button  type="info" size="large" @click="onSubmit">提交申请</van-button>
+      </div>
+    </div>
+<!--    <van-calendar-->
+<!--      v-model="showCalendar"-->
+<!--      :allow-same-day="true"-->
+<!--      type="range"-->
+<!--      :show-confirm="false"-->
+<!--      @confirm="onConfirm"/>-->
+    <calendar-picker ref="CalendarPicker" @change="getDate"></calendar-picker>
+    <org-picker
+      :show="showPicker"
+      @cancel="cancelPicker"
+      @confirm="changeOrg">
+    </org-picker>
+
+    <!-- 添加人员弹窗 -->
+    <van-popup
+        class="add-picker"
+        v-model="showAddPicker"
+        :close-on-click-overlay="false"
+        position="top">
+
+
       <!--  添加人员信息    -->
-      <div class="card" v-show="checked">
-        <van-cell title="人员信息">
-          <template #right-icon>
-            <van-button type="info" v-if="isAdd" icon="plus" size="mini" @click="onAdd">添加</van-button>
-            <van-button type="info" v-else icon="edit" size="mini" @click="onEdit">确认</van-button>
-          </template>
-        </van-cell>
+      <div class="card" >
+<!--        <van-cell title="人员信息">-->
+<!--          <template #right-icon>-->
+<!--            <van-button type="info" v-if="isAdd" icon="plus" size="mini" @click="onAdd">添加</van-button>-->
+<!--            <van-button type="info" v-else icon="edit" size="mini" @click="onEdit">确认</van-button>-->
+<!--          </template>-->
+<!--        </van-cell>-->
         <div class="panel-box">
           <van-form validate-first @failed="onFailed">
             <van-field
-              required
-              v-model="personnel.companyName"
-              rows="1"
-              autosize
-              :maxlength="20"
-              label="来访单位"
-              :rules="[{ pattern:/^(.+)$/, message: '请输入' }]"
-              placeholder="请输入"/>
+                required
+                v-model="personnel.companyName"
+                rows="1"
+                autosize
+                :maxlength="20"
+                label="来访单位"
+                :rules="[{ pattern:/^(.+)$/, message: '请输入' }]"
+                placeholder="请输入"/>
             <van-field
-              required
-              v-model="personnel.userName"
-              rows="1"
-              autosize
-              :maxlength="20"
-              label="出入人员"
-              :rules="[{ pattern:/^(.+)$/, message: '请输入' }]"
-              placeholder="请输入"/>
+                required
+                v-model="personnel.userName"
+                rows="1"
+                autosize
+                :maxlength="20"
+                label="出入人员"
+                :rules="[{ pattern:/^(.+)$/, message: '请输入' }]"
+                placeholder="请输入"/>
             <select-cell
-              title="证件类型"
-              is-row
-              v-model="personnel.idType"
-              :data-list="getDictItem('letter_id_type')"
-              required>
+                title="证件类型"
+                is-row
+                v-model="personnel.idType"
+                :data-list="getDictItem('letter_id_type')"
+                required>
             </select-cell>
             <van-field
-              required
-              v-model="personnel.idCard"
-              rows="1"
-              autosize
-              :maxlength="20"
-              label="证件号码"
-              placeholder="请输入"/>
+                required
+                v-model="personnel.idCard"
+                rows="1"
+                autosize
+                :maxlength="20"
+                label="证件号码"
+                placeholder="请输入"/>
           </van-form>
           <div class="upload-box" >
             <span class="required">上传证件照</span>
@@ -160,23 +184,18 @@
           </div>
           <p class="tip-text" >注：证件号码将作为唯一识别码</p>
         </div>
+
+        <div class="header-line">
+          <div class="cancel" @click="onCancel">取消</div>
+<!--          <div class="title">添加人员</div>-->
+          <div v-if="isAdd" class="sure" @click="onAdd">添加</div>
+          <div v-else class="sure" @click="onEdit">确定</div>
+        </div>
+
       </div>
-      <div class="big-btn-box" >
-        <van-button  type="info" size="large" @click="onSubmit">提交申请</van-button>
-      </div>
-    </div>
-<!--    <van-calendar-->
-<!--      v-model="showCalendar"-->
-<!--      :allow-same-day="true"-->
-<!--      type="range"-->
-<!--      :show-confirm="false"-->
-<!--      @confirm="onConfirm"/>-->
-    <calendar-picker ref="CalendarPicker" @change="getDate"></calendar-picker>
-    <org-picker
-      :show="showPicker"
-      @cancel="cancelPicker"
-      @confirm="changeOrg">
-    </org-picker>
+
+
+    </van-popup>
   </div>
 </template>
 
@@ -234,7 +253,8 @@ export default {
           value:3
         }
       ],
-      dicts:['letter_id_type']
+      dicts:['letter_id_type'],
+      showAddPicker:false,
     }
   },
   computed:{
@@ -242,6 +262,19 @@ export default {
   },
   methods:{
     imgUrl,formatDate,
+    onCancel() {
+      this.showAddPicker = false;
+    },
+    onConfirm() {
+      if(!this.selected.length){
+        this.$toast('请选择')
+        return;
+      }
+      this.showAddPicker = false;
+    },
+    openPicker(){
+      this.showAddPicker = true;
+    },
     changeType(){
       this.formData.startTime = dayjs(new Date()).format('YYYY-MM-DD');
       this.formData.effectiveDays = 1;
@@ -346,7 +379,7 @@ export default {
       this.$refs.CalendarPicker.show = true;
     },
     editPerson(v,i){
-      this.checked = true;
+      this.showAddPicker = true;
       this.isAdd = false;
       this.personnel = JSON.parse(JSON.stringify(v));
     },
@@ -369,6 +402,7 @@ export default {
         imgFile:[],
       };
       this.isAdd = true;
+      this.showAddPicker = false;
     },
     onAdd(){
       //测试模拟
@@ -408,6 +442,7 @@ export default {
         idCard:null,
         imgFile:[],
       };
+      this.showAddPicker = false;
     },
     showOrg(){
       this.showPicker = true;
@@ -540,4 +575,41 @@ export default {
 .big-btn-box{
   padding-bottom: 20px;
 }
+.add-picker{
+  .header-line {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 90px;
+  }
+  .header-line .cancel {
+    padding: 0 30px;
+    font-size: 28px;
+    color: #969799;
+  }
+  .header-line .title {
+    font-weight: 500;
+    font-size: 30px;
+    color: #343434;
+  }
+  .header-line .sure {
+    padding: 0 30px;
+    font-size: 28px;
+    color: #1989fa;
+  }
+  .lists {
+    padding: 10px 20px 20px 20px;
+    min-height: 300px;
+    max-height: 700px;
+    overflow: auto;
+    touch-action: pan-y;
+  }
+  .tip {
+    color: #666;
+    padding-bottom: 5px;
+  }
+  .van-empty{
+    padding: 0;
+  }
+}
 </style>