From f63ace3b70fe8b581099da20926f8233439de7aa Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Tue, 23 Nov 2021 17:16:13 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E9=94=99=E8=AF=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/apps/AppAskForm/components/AddForm.vue | 1144 ++++++++++----------
 src/apps/AppAskForm/components/List.vue    |   14 +-
 src/apps/AppAskForm/components/Tabbar.vue  |   22 +-
 src/components/AiEmpty.vue                 |   60 +-
 4 files changed, 620 insertions(+), 620 deletions(-)

diff --git a/src/apps/AppAskForm/components/AddForm.vue b/src/apps/AppAskForm/components/AddForm.vue
index 6363c854..129eed68 100644
--- a/src/apps/AppAskForm/components/AddForm.vue
+++ b/src/apps/AppAskForm/components/AddForm.vue
@@ -2,45 +2,47 @@
   <div class="add-form" v-if="pageShow">
     <div v-show="!isShowConfig">
       <div class="header-pic">
-        <image v-if="form.headPicture" :src="form.headPicture" />
+        <image v-if="form.headPicture" :src="form.headPicture"/>
         <span @click="upload">更换图片</span>
       </div>
       <div class="form-info">
         <h2>文本选项</h2>
         <div class="form-info__wrapper">
-          <textarea class="title" placeholder="请输入标题 (必填）" :maxlength="30" :auto-height="true" v-model="form.title"></textarea>
+          <textarea class="title" placeholder="请输入标题 (必填）" :maxlength="30" :auto-height="true"
+                    v-model="form.title"></textarea>
           <textarea
-            style="wdith: 100%"
-            class="content"
-            border="none"
-            :clearable="false"
-            type="textarea"
-            v-model="form.tableExplain"
-            placeholder="请输入表单描述 (选填）"
-            :maxlength="255">
+              class="content"
+              border="none"
+              :clearable="false"
+              type="textarea"
+              v-model="form.tableExplain"
+              placeholder="请输入表单描述 (选填）"
+              :maxlength="255">
           </textarea>
         </div>
       </div>
       <draggable
-        class="components-list"
-        v-model="targetList"
-        :animation="340"
-        scroll
-        element="div"
-        :options="{
+          class="components-list"
+          v-model="targetList"
+          :animation="340"
+          scroll
+          element="div"
+          :options="{
           animation: 340,
           handle: '.components-item__title'
         }"
-        draggable=".components-item"
-        :sort="true">
-        <div class="components-item" v-for="(item, index) in targetList" :key="index" @click="toFiledSetting(item, index)">
+          draggable=".components-item"
+          :sort="true">
+        <div class="components-item" v-for="(item, index) in targetList" :key="index"
+             @click="toFiledSetting(item, index)">
           <div class="components-item__title">
             <div class="components-item__title--left">
               <em :style="{opacity: item.required ? 1 : 0}">*</em>
               <i>{{ index + 1 }}.</i>
               <h2>{{ item.label }}</h2>
             </div>
-            <image :src="`${$cdn}askform/sc1.png`" @click.stop="removeComponent(index)" @touchstart.stop="removeComponent(index)" />
+            <image :src="`${$cdn}askform/sc1.png`" @click.stop="removeComponent(index)"
+                   @touchstart.stop="removeComponent(index)"/>
           </div>
           <div class="components-item__filed">
             <template v-if="(item.type === 'radio')">
@@ -62,12 +64,12 @@
             <template v-if="(item.type === 'select')">
               <div class="components-item__select">
                 <span>{{ item.placeholder }}</span>
-                <u-icon name="arrow-down" color="#DEDFDF" />
+                <u-icon name="arrow-down" color="#DEDFDF"/>
               </div>
             </template>
             <template v-if="(item.type === 'upload')">
               <div class="components-item__select components-item__textarea components-item__upload">
-                <image :src="`${$cdn}askform/upload.png`" />
+                <image :src="`${$cdn}askform/upload.png`"/>
                 <span>选择图片（2M以内）</span>
               </div>
             </template>
@@ -85,7 +87,7 @@
         </div>
       </draggable>
       <div class="add-form__btn" @click="isShow = true">
-        <image :src="`${$cdn}askform/add.png`" />
+        <image :src="`${$cdn}askform/add.png`"/>
         <span>添加问题</span>
       </div>
       <div class="add-form__footer">
@@ -99,7 +101,7 @@
         <div class="add-popup">
           <div class="add-popup__title">
             <h2>添加问题</h2>
-            <image :src="`${$cdn}askform/zk.png`" mode="aspectFit" @click="isShow = false" />
+            <image :src="`${$cdn}askform/zk.png`" mode="aspectFit" @click="isShow = false"/>
           </div>
           <div class="add-popup__list">
             <span @click="toFiledSetting('radio')">单选题</span>
@@ -111,636 +113,638 @@
           </div>
         </div>
       </u-popup>
-      <AiBack custom @back="back"></AiBack>
+      <AiBack custom @back="back"/>
     </div>
     <div class="detail" v-if="isShowConfig">
       <component
-        :is="component"
-        :index="filedIndex"
-        :filed="filed"
-        @change="onChange"
-        :targetListData="targetList"
-        :formData="form"
-        :filedType="filedType"
-        @back="isShowConfig = false"
-        :id="id"
-        :formConfig="formConfig">
+          :is="component"
+          :index="filedIndex"
+          :filed="filed"
+          @change="onChange"
+          :targetListData="targetList"
+          :formData="form"
+          :filedType="filedType"
+          @back="isShowConfig = false"
+          :id="id"
+          :formConfig="formConfig">
       </component>
     </div>
   </div>
 </template>
 
 <script>
-  import AiBack from "@/components/AiBack";
-  import draggable from 'vuedraggable'
-  import FiledConfig from './FiledConfig'
-  import FormSetting from './FormSetting'
-  import PreviewForm from './PreviewForm'
+import draggable from 'vuedraggable'
+import FiledConfig from './FiledConfig'
+import FormSetting from './FormSetting'
+import PreviewForm from './PreviewForm'
+import AiBack from "../../../components/AiBack";
 
-  export default {
-    props: ['params'],
+export default {
+  props: ['params'],
 
-    data () {
-      return {
-        pageShow: false,
-        isShowConfig: false,
-        form: {
-          tableExplain: '详细描述',
-          title: '问卷调查',
-          isShowheadPicture: true,
-          isShowTableExplain: true,
-          isShowBtn: true,
-          headPicture: '',
-          commitType: '1',
-          periodValidityType: '0',
-          actionNotice: '1',
-          dynamicNotice: '1',
-          periodValidityEndTime: '',
-          shareStatus: '0',
-          count: 0,
-          wechatId: '0',
-          type: 0,
-          buttonExplain: '提交',
-          tips: true
-        },
-        templateType: 0,
-        targetList: [],
-        isShow: false,
+  data() {
+    return {
+      pageShow: false,
+      isShowConfig: false,
+      form: {
+        tableExplain: '详细描述',
+        title: '问卷调查',
+        isShowheadPicture: true,
+        isShowTableExplain: true,
+        isShowBtn: true,
+        headPicture: '',
+        commitType: '1',
+        periodValidityType: '0',
+        actionNotice: '1',
+        dynamicNotice: '1',
+        periodValidityEndTime: '',
+        shareStatus: '0',
+        count: 0,
+        wechatId: '0',
         type: 0,
-        id: '',
-        filedType: '',
-        filed: {},
-        filedIndex: '',
-        isQuote: false,
-        touchStart: 0,
-        component: '',
-        formConfig: {}
+        buttonExplain: '提交',
+        tips: true
+      },
+      templateType: 0,
+      targetList: [],
+      isShow: false,
+      type: 0,
+      id: '',
+      filedType: '',
+      filed: {},
+      filedIndex: '',
+      isQuote: false,
+      touchStart: 0,
+      component: '',
+      formConfig: {}
+    }
+  },
+
+  components: {
+    AiBack,
+    draggable,
+    PreviewForm,
+    FormSetting,
+    FiledConfig
+  },
+
+  mounted() {
+    this.type = Number(this.params.type)
+
+    if (this.params.isQuote) {
+      this.isQuote = true
+    }
+
+    if (this.params.id) {
+      this.id = this.params.id
+      this.getInfo(this.params.id)
+    } else {
+      this.pageShow = true
+    }
+
+    this.init()
+
+    uni.$on('setting', res => {
+      this.form = {
+        ...this.form,
+        ...res
       }
-    },
+      this.formConfig = res
+    })
 
-    components: {
-      AiBack,
-      draggable,
-      PreviewForm,
-      FormSetting,
-      FiledConfig
-    },
-
-    mounted () {
-      this.type = Number(this.params.type)
-
-      if (this.params.isQuote) {
-        this.isQuote = true
-      }
-
-      if (this.params.id) {
-        this.id = this.params.id
-        this.getInfo(this.params.id)
+    uni.$on('filedConfig', res => {
+      console.log(33)
+      if (res.index === '-1') {
+        this.targetList.push(res.config)
       } else {
-        this.pageShow = true
+        this.$set(this.targetList, [res.index], res.config)
       }
+    })
+  },
 
-      this.init()
+  methods: {
+    toSetting() {
+      this.component = 'FormSetting'
+      this.isShowConfig = true
+    },
 
-      uni.$on('setting', res => {
-        this.form = {
-          ...this.form,
-          ...res
-        }
-        this.formConfig = res
-      })
-
-      uni.$on('filedConfig', res => {
-        console.log(33)
-        if (res.index === '-1') {
-          this.targetList.push(res.config)
-        } else {
-          this.$set(this.targetList, [res.index], res.config)
-        }
+    back() {
+      this.$emit('change', {
+        type: 'Tabbar'
       })
     },
 
-    methods: {
-      toSetting () {
-        this.component = 'FormSetting'
-        this.isShowConfig = true
-      },
+    onChange(e) {
 
-      back () {
-        this.$emit('change', {
-          type: 'Tabbar'
-        })
-      },
+    },
 
-      onChange (e) {
+    removeComponent(index) {
+      this.targetList.splice(index, 1)
+    },
 
-      },
+    toPreview() {
+      this.component = 'PreviewForm'
+      this.isShowConfig = true
+    },
 
-      removeComponent (index) {
-        this.targetList.splice(index, 1)
-      },
-
-      toPreview () {
-        this.component = 'PreviewForm'
-        this.isShowConfig = true
-      },
-
-      upload() {
-        let params = {
-          count: 1,
-          sizeType: ['compressed'],
-          sourceType: ['album', 'camera'],
-          success: (res) => {
-            let count = this.fileList?.length + (res.tempFiles?.length || res.tempFile ? 1 : 0)
-            if (count > 1) {
-              return this.$u.toast(`不能超过1个`)
-            }
-            if (res.tempFiles) {
-              res.tempFiles.map((item) => {
-                this.uploadFile(item)
-              })
-            } else if (res?.tempFile) {
-              this.uploadFile(res.tempFile)
-            }
+    upload() {
+      let params = {
+        count: 1,
+        sizeType: ['compressed'],
+        sourceType: ['album', 'camera'],
+        success: (res) => {
+          let count = this.fileList?.length + (res.tempFiles?.length || res.tempFile ? 1 : 0)
+          if (count > 1) {
+            return this.$u.toast(`不能超过1个`)
           }
-        }
-        uni.chooseImage(params)
-      },
-
-      uploadFile (img) {
-        uni.showLoading({title: '上传中'})
-        let formData = new FormData()
-        formData.append('file', img)
-        this.$http.post('/admin/file/add2', formData).then((res) => {
-          uni.hideLoading()
-          if (res?.data) {
-            this.$u.toast('上传成功!')
-            this.form.headPicture = res.data.url
-          }
-        }).catch(res => {
-          this.$u.toast(res)
-          uni.hideLoading()
-        })
-      },
-
-      onConfirm () {
-        for (let item of this.targetList) {
-          if (item.isShowPoints) {
-            if (item.pointType === '0') {
-              if (!item.answer || JSON.stringify(item.answer) === '[]') {
-                return this.$u.toast(`请输入${item.label}正确答案`)
-              }
-
-              if (!item.points) {
-                return this.$u.toast(`请输入${item.label}的分值`)
-              }
-            }
-
-            if (item.pointType === '1') {
-              for (let option of item.options) {
-                if (!option.point) {
-                  return this.$u.toast(`请输入${item.label}${option.label}的分值`)
-                }
-              }
-            }
-
-            if (item.pointType === '2') {
-              for (let option of item.options) {
-                if (!option.point) {
-                  return this.$u.toast(`请输入${item.label}${option.label}的分值`)
-                }
-              }
-
-              if (!item.points) {
-                return this.$u.toast(`请输入${item.label}全部答对分值`)
-              }
-            }
-          }
-        }
-
-        const fields = this.targetList.map(item => {
-          return {
-            fieldType: item.type,
-            fieldName: item.label,
-            fieldInfo: JSON.stringify(item)
-          }
-        })
-
-        this.$http.post(`/app/appquestionnairetemplate/addOrUpdate`, {
-          ...this.form,
-          fields,
-          status: 1,
-          id: this.isQuote ? '' : this.id,
-          headPicture: this.form.headPicture,
-          type: this.type,
-          templateType: 0
-        }).then(res => {
-          if (res.code == 0) {
-            this.$u.toast('提交成功')
-
-            setTimeout(() => {
-              this.$emit('change', {
-                type: 'Tabbar'
-              })
-            }, 600)
-          }
-        }).catch(e => {
-          this.$u.toast(e)
-        })
-      },
-
-      getInfo (id) {
-        uni.showLoading()
-        this.$http.post(`/app/appquestionnairetemplate/queryDetailById?id=${id}`).then(res => {
-          if (res.code == 0) {
-            this.form = {
-              ...res.data,
-              headPicture: res.data.headPicture
-            }
-
-            this.type = res.data.type
-
-            this.targetList = res.data.fields.map(item => {
-              return JSON.parse(item.fieldInfo)
+          if (res.tempFiles) {
+            res.tempFiles.map((item) => {
+              this.uploadFile(item)
             })
+          } else if (res?.tempFile) {
+            this.uploadFile(res.tempFile)
+          }
+        }
+      }
+      uni.chooseImage(params)
+    },
 
-            this.pageShow = true
-          } else {
-            this.$u.toast(res.msg)
+    uploadFile(img) {
+      uni.showLoading({title: '上传中'})
+      let formData = new FormData()
+      formData.append('file', img)
+      this.$http.post('/admin/file/add2', formData).then((res) => {
+        uni.hideLoading()
+        if (res?.data) {
+          this.$u.toast('上传成功!')
+          this.form.headPicture = res.data.url
+        }
+      }).catch(res => {
+        this.$u.toast(res)
+        uni.hideLoading()
+      })
+    },
+
+    onConfirm() {
+      for (let item of this.targetList) {
+        if (item.isShowPoints) {
+          if (item.pointType === '0') {
+            if (!item.answer || JSON.stringify(item.answer) === '[]') {
+              return this.$u.toast(`请输入${item.label}正确答案`)
+            }
+
+            if (!item.points) {
+              return this.$u.toast(`请输入${item.label}的分值`)
+            }
           }
 
-          uni.hideLoading()
-        }).catch(() => {
-          uni.hideLoading()
-        })
-      },
+          if (item.pointType === '1') {
+            for (let option of item.options) {
+              if (!option.point) {
+                return this.$u.toast(`请输入${item.label}${option.label}的分值`)
+              }
+            }
+          }
 
-      toFiledSetting (type, index) {
-        this.isShow = false
-        if (index > -1) {
-          this.filed = type
-          this.filedIndex =  index
-          this.component = 'FiledConfig'
-          this.isShowConfig = true
+          if (item.pointType === '2') {
+            for (let option of item.options) {
+              if (!option.point) {
+                return this.$u.toast(`请输入${item.label}${option.label}的分值`)
+              }
+            }
 
-          return false
+            if (!item.points) {
+              return this.$u.toast(`请输入${item.label}全部答对分值`)
+            }
+          }
+        }
+      }
+
+      const fields = this.targetList.map(item => {
+        return {
+          fieldType: item.type,
+          fieldName: item.label,
+          fieldInfo: JSON.stringify(item)
+        }
+      })
+
+      this.$http.post(`/app/appquestionnairetemplate/addOrUpdate`, {
+        ...this.form,
+        fields,
+        status: 1,
+        id: this.isQuote ? '' : this.id,
+        headPicture: this.form.headPicture,
+        type: this.type,
+        templateType: 0
+      }).then(res => {
+        if (res.code == 0) {
+          this.$u.toast('提交成功')
+
+          setTimeout(() => {
+            this.$emit('change', {
+              type: 'Tabbar'
+            })
+          }, 600)
+        }
+      }).catch(e => {
+        this.$u.toast(e)
+      })
+    },
+
+    getInfo(id) {
+      uni.showLoading()
+      this.$http.post(`/app/appquestionnairetemplate/queryDetailById?id=${id}`).then(res => {
+        if (res.code == 0) {
+          this.form = {
+            ...res.data,
+            headPicture: res.data.headPicture
+          }
+
+          this.type = res.data.type
+
+          this.targetList = res.data.fields.map(item => {
+            return JSON.parse(item.fieldInfo)
+          })
+
+          this.pageShow = true
+        } else {
+          this.$u.toast(res.msg)
         }
 
-        this.filedIndex = ''
-        this.filedType =  type
+        uni.hideLoading()
+      }).catch(() => {
+        uni.hideLoading()
+      })
+    },
+
+    toFiledSetting(type, index) {
+      this.isShow = false
+      if (index > -1) {
+        this.filed = type
+        this.filedIndex = index
         this.component = 'FiledConfig'
         this.isShowConfig = true
-      },
 
-      init () {
-        if (this.type == 0) {
-          this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/interview.png'
-        }
-        if (this.type == 1) {
-          this.form.title = '考试测评'
-          this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/exam.png'
-        }
-        if (this.type == 2) {
-          this.form.title = '报名登记'
-          this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/apply.png'
-        }
-        if (this.type == 3) {
-          this.form.title = '满意调查'
-          this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/satisfaction.png'
-        }
-        if (this.type == 4) {
-          this.form.title = '投票评选'
-          this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/vote.png'
-        }
+        return false
+      }
+
+      this.filedIndex = ''
+      this.filedType = type
+      this.component = 'FiledConfig'
+      this.isShowConfig = true
+    },
+
+    init() {
+      if (this.type == 0) {
+        this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/interview.png'
+      }
+      if (this.type == 1) {
+        this.form.title = '考试测评'
+        this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/exam.png'
+      }
+      if (this.type == 2) {
+        this.form.title = '报名登记'
+        this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/apply.png'
+      }
+      if (this.type == 3) {
+        this.form.title = '满意调查'
+        this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/satisfaction.png'
+      }
+      if (this.type == 4) {
+        this.form.title = '投票评选'
+        this.form.headPicture = 'https://cdn.cunwuyun.cn/dvcp/h5/form/vote.png'
       }
     }
   }
+}
 </script>
 
 <style lang="scss" scoped>
-  .add-form {
-    min-height: 100vh;
-    padding-bottom: 140px;
+.add-form {
+  min-height: 100vh;
+  padding-bottom: 140px;
+  box-sizing: border-box;
+  background: #F3F6F9;
+
+  * {
     box-sizing: border-box;
-    background: #F3F6F9;
+  }
 
-    * {
-      box-sizing: border-box;
-    }
+  .components-list {
+    padding: 0 20px;
 
-    .components-list {
-      padding: 0 20px;
+    .components-item {
+      margin-top: 24px;
+      padding: 32px;
+      box-shadow: 0 4px 8px 4px rgba(233, 233, 233, 0.39);
+      border-radius: 8px;
+      overflow: hidden;
+      border: 1px solid #EEEFF0;
+      background: #fff;
 
-      .components-item {
-        margin-top: 24px;
-        padding: 32px;
-        box-shadow: 0 4px 8px 4px rgba(233, 233, 233, 0.39);
-        border-radius: 8px;
-        overflow: hidden;
-        border: 1px solid #EEEFF0;
-        background: #fff;
+      .u-checkbox, .u-radio {
+        display: block;
 
-        .u-checkbox, .u-radio {
-          display: block;
-          image {
-            width: 100px;
-            height: 100px;
-            margin: 0 10px;
-          }
+        image {
+          width: 100px;
+          height: 100px;
+          margin: 0 10px;
+        }
+      }
+
+      ::v-deep .u-radio, ::v-deep .u-checkbox {
+        position: relative;
+        margin-bottom: 20px;
+
+        &:last-child {
+          margin-bottom: 0;
         }
 
-        ::v-deep .u-radio, ::v-deep .u-checkbox {
-          position: relative;
-          margin-bottom: 20px;
-
-          &:last-child {
-            margin-bottom: 0;
-          }
-
-          .u-checkbox__icon-wrap, .u-radio__icon-wrap {
-            position: absolute;
-            top: 4rpx;
-          }
-
-          .u-radio__label, .u-checkbox__label {
-            display: flex;
-            align-items: center;
-            margin-right: 0;
-            margin-left: 40px;
-            text-align: justify;
-
-            span {
-              line-height: 1.5;
-            }
-          }
-        }
-        span {
-          flex: 1;
-          color: #666;
-          font-size: 26px;
+        .u-checkbox__icon-wrap, .u-radio__icon-wrap {
+          position: absolute;
+          top: 4 rpx;
         }
 
-        .components-item__select {
+        .u-radio__label, .u-checkbox__label {
           display: flex;
           align-items: center;
-          justify-content: space-between;
-          width: 100%;
-          height: 80px;
-          margin-bottom: 8px;
-          padding: 0 26px;
-          border: 1px solid #DEDFDF;
+          margin-right: 0;
+          margin-left: 40px;
+          text-align: justify;
 
-          &.components-item__textarea {
-            align-items: flex-start;
-            height: 160px;
-            padding-top: 20px;
-
-            image {
-              width: 46px;
-              height: 34px;
-              margin-right: 16px;
-            }
-
-            span {
-              color: #666;
-              font-size: 26px;
-            }
-          }
-
-          &.components-item__upload {
-            justify-content: center;
-            align-items: center;
-          }
-        }
-
-        .components-item__title {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          margin-bottom: 32px;
-
-          em {
-            margin-right: 4px;
-            font-style: normal;
-            color: rgb(226, 33, 32);;
-          }
-
-          image {
-            position: relative;
-            flex-shrink: 1;
-            right: -20px;
-            width: 32px;
-            height: 32px;
-            box-sizing: content-box;
-            padding: 30px 20px 30px 20px;
-          }
-
-          div {
-            display: flex;
-            align-items: baseline;
-            max-width: 550px;
-            color: #333333;
-            font-size: 32px;
-
-            i {
-              font-style: normal;
-            }
-
-            h2 {
-              font-weight: 600;
-              font-size: 32px;
-            }
+          span {
+            line-height: 1.5;
           }
         }
       }
-    }
 
-    .add-popup {
-      height: 440px;
-      border-radius: 20px 20px 0 0;
-      background: #fff;
+      span {
+        flex: 1;
+        color: #666;
+        font-size: 26px;
+      }
 
-      .add-popup__title {
+      .components-item__select {
         display: flex;
-        position: relative;
         align-items: center;
-        justify-content: center;
-        height: 96px;
-        border-bottom: 1px solid #E4E5E6;
+        justify-content: space-between;
+        width: 100%;
+        height: 80px;
+        margin-bottom: 8px;
+        padding: 0 26px;
+        border: 1px solid #DEDFDF;
 
-        h2 {
-          color: #333333;
-          font-size: 32px;
-          font-weight: 600;
+        &.components-item__textarea {
+          align-items: flex-start;
+          height: 160px;
+          padding-top: 20px;
+
+          image {
+            width: 46px;
+            height: 34px;
+            margin-right: 16px;
+          }
+
+          span {
+            color: #666;
+            font-size: 26px;
+          }
+        }
+
+        &.components-item__upload {
+          justify-content: center;
+          align-items: center;
+        }
+      }
+
+      .components-item__title {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-bottom: 32px;
+
+        em {
+          margin-right: 4px;
+          font-style: normal;
+          color: rgb(226, 33, 32);;
         }
 
         image {
-          position: absolute;
-          right: 32px;
-          top: 50%;
-          width: 30px;
-          height: 20px;
-          transform: translateY(-50%);
-        }
-      }
-
-      .add-popup__list {
-        display: flex;
-        flex-wrap: wrap;
-        padding: 0 34px;
-
-        span {
-          width: calc((100% - 64px) / 3);
-          height: 78px;
-          line-height: 78px;
-          margin-top: 32px;
-          margin-right: 32px;
-          text-align: center;
-          color: #333333;
-          font-size: 28px;
-          border-radius: 8px;
-          border: 1px solid #E4E5E6;
-
-          &:nth-of-type(3n) {
-            margin-right: 0;
-          }
-        }
-      }
-    }
-
-    .add-form__footer {
-      display: flex;
-      align-items: center;
-      position: fixed;
-      left: 0;
-      bottom: 0;
-      z-index: 1;
-      width: 100%;
-      height: 112px;
-      text-align: center;
-
-      div {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex: 1;
-        height: 100%;
-        text-align: center;
-        background: #fff;
-
-        &:last-child {
-          color: #fff;
-          font-size: 36px;
-          background: #3192F4;
-
-          &:active {
-            opacity: 0.8;
-          }
+          position: relative;
+          flex-shrink: 1;
+          right: -20px;
+          width: 32px;
+          height: 32px;
+          box-sizing: content-box;
+          padding: 30px 20px 30px 20px;
         }
 
-        span {
-          flex: 1;
-          height: 100%;
-          line-height: 112px;
+        div {
+          display: flex;
+          align-items: baseline;
+          max-width: 550px;
           color: #333333;
           font-size: 32px;
 
-          &:active {
-            background: #eee;
+          i {
+            font-style: normal;
+          }
+
+          h2 {
+            font-weight: 600;
+            font-size: 32px;
           }
         }
       }
     }
+  }
 
-    .add-form__btn {
+  .add-popup {
+    height: 440px;
+    border-radius: 20px 20px 0 0;
+    background: #fff;
+
+    .add-popup__title {
+      display: flex;
+      position: relative;
+      align-items: center;
+      justify-content: center;
+      height: 96px;
+      border-bottom: 1px solid #E4E5E6;
+
+      h2 {
+        color: #333333;
+        font-size: 32px;
+        font-weight: 600;
+      }
+
+      image {
+        position: absolute;
+        right: 32px;
+        top: 50%;
+        width: 30px;
+        height: 20px;
+        transform: translateY(-50%);
+      }
+    }
+
+    .add-popup__list {
+      display: flex;
+      flex-wrap: wrap;
+      padding: 0 34px;
+
+      span {
+        width: calc((100% - 64px) / 3);
+        height: 78px;
+        line-height: 78px;
+        margin-top: 32px;
+        margin-right: 32px;
+        text-align: center;
+        color: #333333;
+        font-size: 28px;
+        border-radius: 8px;
+        border: 1px solid #E4E5E6;
+
+        &:nth-of-type(3n) {
+          margin-right: 0;
+        }
+      }
+    }
+  }
+
+  .add-form__footer {
+    display: flex;
+    align-items: center;
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 1;
+    width: 100%;
+    height: 112px;
+    text-align: center;
+
+    div {
       display: flex;
       align-items: center;
       justify-content: center;
-      width: 214px;
-      height: 66px;
-      line-height: 66px;
-      margin: 64px auto 0;
-      background: #FFFFFF;
-      border-radius: 34px;
+      flex: 1;
+      height: 100%;
+      text-align: center;
+      background: #fff;
 
-      &:active {
-        opacity: 0.8;
-      }
-
-      image {
-        width: 28px;
-        height: 28px;
-      }
-
-      span {
-        margin-left: 16px;
-        color: #4392E6;
-        font-size: 28px;
-      }
-    }
-
-    * {
-      box-sizing: border-box;
-    }
-
-    .form-info {
-      padding: 0 20px;
-
-      & > h2 {
-        height: 76px;
-        line-height: 76px;
-        color: #999999;
-        font-weight: normal;
-        font-size: 28px;
-      }
-
-      .form-info__wrapper {
-        padding: 0 18px;
-        background: #fff;
-
-        .title {
-          width: 100%;
-          padding: 22px 0;
-          font-size: 36px;
-          border-bottom: 1px solid #F1F2F3;
-        }
-
-        .content {
-          width: 100%;
-          padding: 30px 0!important;
-          color: #333;
-          font-size: 28px!important;
-        }
-      }
-    }
-
-    .header-pic {
-      position: relative;
-      font-size: 0;
-
-      span {
-        position: absolute;
-        bottom: 16px;
-        right: 16px;
-        z-index: 1;
-        width: 148px;
-        height: 56px;
-        line-height: 56px;
-        text-align: center;
+      &:last-child {
         color: #fff;
-        font-size: 26px;
-        background: rgba(0, 0, 0, 0.16);
-        border-radius: 28px;
+        font-size: 36px;
+        background: #3192F4;
+
+        &:active {
+          opacity: 0.8;
+        }
       }
 
-      image {
-        width: 100%;
-        height: 320px;
-      }
-    }
+      span {
+        flex: 1;
+        height: 100%;
+        line-height: 112px;
+        color: #333333;
+        font-size: 32px;
 
-    ::v-deep .u-radio, ::v-deep .u-checkbox {
-      align-items: baseline;
+        &:active {
+          background: #eee;
+        }
+      }
     }
   }
+
+  .add-form__btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 214px;
+    height: 66px;
+    line-height: 66px;
+    margin: 64px auto 0;
+    background: #FFFFFF;
+    border-radius: 34px;
+
+    &:active {
+      opacity: 0.8;
+    }
+
+    image {
+      width: 28px;
+      height: 28px;
+    }
+
+    span {
+      margin-left: 16px;
+      color: #4392E6;
+      font-size: 28px;
+    }
+  }
+
+  * {
+    box-sizing: border-box;
+  }
+
+  .form-info {
+    padding: 0 20px;
+
+    & > h2 {
+      height: 76px;
+      line-height: 76px;
+      color: #999999;
+      font-weight: normal;
+      font-size: 28px;
+    }
+
+    .form-info__wrapper {
+      padding: 0 18px;
+      background: #fff;
+
+      .title {
+        width: 100%;
+        padding: 22px 0;
+        font-size: 36px;
+        border-bottom: 1px solid #F1F2F3;
+      }
+
+      .content {
+        width: 100%;
+        padding: 30px 0 !important;
+        color: #333;
+        font-size: 28px !important;
+      }
+    }
+  }
+
+  .header-pic {
+    position: relative;
+    font-size: 0;
+
+    span {
+      position: absolute;
+      bottom: 16px;
+      right: 16px;
+      z-index: 1;
+      width: 148px;
+      height: 56px;
+      line-height: 56px;
+      text-align: center;
+      color: #fff;
+      font-size: 26px;
+      background: rgba(0, 0, 0, 0.16);
+      border-radius: 28px;
+    }
+
+    image {
+      width: 100%;
+      height: 320px;
+    }
+  }
+
+  ::v-deep .u-radio, ::v-deep .u-checkbox {
+    align-items: baseline;
+  }
+}
 </style>
diff --git a/src/apps/AppAskForm/components/List.vue b/src/apps/AppAskForm/components/List.vue
index 235ce445..dbdddf09 100644
--- a/src/apps/AppAskForm/components/List.vue
+++ b/src/apps/AppAskForm/components/List.vue
@@ -83,14 +83,14 @@
 </template>
 
 <script>
-import AiTopFixed from '@/components/AiTopFixed'
-import AiEmpty from '@/components/AiEmpty'
 import {mapActions} from 'vuex'
+import AiTopFixed from "../../../components/AiTopFixed";
+import AiEmpty from "../../../components/AiEmpty";
 
 export default {
   name: 'formList',
   label: '表单列表',
-
+  components: {AiEmpty, AiTopFixed},
   data() {
     return {
       search: {
@@ -106,12 +106,6 @@ export default {
       isShow: false
     }
   },
-
-  components: {
-    AiEmpty,
-    AiTopFixed
-  },
-
   mounted() {
     this.injectJWeixin(['sendChatMessage', 'selectEnterpriseContact'])
     this.$dict.load(['questionnaireStatus', 'questionnaireType', 'questionnaireFieldType']).then(() => {
@@ -205,7 +199,7 @@ export default {
       this.isShow = false
     },
 
-    toEdit () {
+    toEdit() {
       if (this.info.dataCount !== 0) {
         return this.$u.toast('该表单已有数据，无法编辑!')
       }
diff --git a/src/apps/AppAskForm/components/Tabbar.vue b/src/apps/AppAskForm/components/Tabbar.vue
index 52f8972c..97a89c50 100644
--- a/src/apps/AppAskForm/components/Tabbar.vue
+++ b/src/apps/AppAskForm/components/Tabbar.vue
@@ -11,30 +11,30 @@
 <script>
 import AddList from './AddList.vue'
 import List from './List.vue'
-import AiTabbar from '@/components/AiTabbar'
+import AiTabbar from "../../../components/AiTabbar";
 
 export default {
   name: 'AppAskForm',
   appName: '问卷表单',
 
-  data () {
+  data() {
     return {
       currIndex: 0
     }
   },
 
   components: {
-    AddList,
     AiTabbar,
+    AddList,
     List
   },
 
   computed: {
-    tabBar () {
+    tabBar() {
       const link = icon => `${this.$cdn}askform/${icon}.png`
       return [
-        {text: "表单列表", iconPath: "bdlb1", selectedIconPath: "bdlb2" },
-        {text: "新建项目", iconPath: "xjxm1", selectedIconPath: "xjxm2" }
+        {text: "表单列表", iconPath: "bdlb1", selectedIconPath: "bdlb2"},
+        {text: "新建项目", iconPath: "xjxm1", selectedIconPath: "xjxm2"}
       ].map(e => ({
         ...e,
         iconPath: link(e.iconPath),
@@ -43,7 +43,7 @@ export default {
     }
   },
 
-  onLoad () {
+  onLoad() {
     uni.$on('reload', () => {
       if (this.currIndex === 0) {
         this.$refs.list.reload()
@@ -54,7 +54,7 @@ export default {
   },
 
   methods: {
-    onChange (e) {
+    onChange(e) {
       this.$emit('change', e)
     }
   },
@@ -68,7 +68,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  .form {
-    padding-bottom: 98px;
-  }
+.form {
+  padding-bottom: 98px;
+}
 </style>
diff --git a/src/components/AiEmpty.vue b/src/components/AiEmpty.vue
index 6fa8c19e..de1c10dc 100644
--- a/src/components/AiEmpty.vue
+++ b/src/components/AiEmpty.vue
@@ -1,39 +1,41 @@
 <template>
-    <div class="emptyWrap">
-        <img class="emptyImg" src="https://cdn.cunwuyun.cn/dvcp/h5/Empty.png">
-        <div class="emptyText">{{description}}</div>
-    </div>
+  <div class="emptyWrap">
+    <img class="emptyImg" src="https://cdn.cunwuyun.cn/dvcp/h5/Empty.png">
+    <div class="emptyText">{{ description }}</div>
+  </div>
 </template>
 
 <script>
-  export default {
-    name:"emptyData",
-    props:{
-      description:{
-        default:'暂无相关信息',
-        type:String
-      }
+export default {
+  name: "AiEmpty",
+  props: {
+    description: {
+      default: '暂无相关信息',
+      type: String
     }
   }
+}
 </script>
 
 <style lang="scss" scoped>
-    .emptyWrap {
-        width: 100%;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        .emptyImg{
-            width: 400rpx;
-            height: 240rpx;
-            margin-top: 112px;
-        }
-        .emptyText{
-            font-size:29rpx;
-            font-family:PingFangSC-Regular,PingFang SC;
-            font-weight:400;
-            color:rgba(183,183,183,1);
-        }
-    }
+.emptyWrap {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+
+  .emptyImg {
+    width: 400 rpx;
+    height: 240 rpx;
+    margin-top: 112px;
+  }
+
+  .emptyText {
+    font-size: 29 rpx;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: rgba(183, 183, 183, 1);
+  }
+}
 </style>