liyongli 1 an în urmă
părinte
comite
75db3e7148
1 a modificat fișierele cu 154 adăugiri și 148 ștergeri
  1. 154 148
      src/view/setSail/index.vue

+ 154 - 148
src/view/setSail/index.vue

@@ -6,155 +6,157 @@
       :src="siluchunwanJpg"
     />
     <br />
-    <van-cell-group inset>
-      <van-nav-bar title="活动介绍" />
-      <p
-        style="
-          text-indent: 2em;
-          padding: 8px 8px 0 8px;
-          text-align: justify;
-          line-height: 1.5em;
-          font-size: 16px;
-          color: #a73832;
-        "
-      >
-        2023年是改革开放45周年,更是全面贯彻党的二十大精神的开局之年和全党深入开展学习贯彻习近平新时代中国特色社会主义思想主题教育之年。5月17日,习近平总书记在西安主持中国-中亚峰会前夕,专门听取了陕西省委和省政府工作汇报,强调陕西在推进中国式现代化建设中要有勇立潮头、争当时代弄潮儿的志向和气魄,奋力追赶、敢于超越,在西部地区发挥示范作用。习近平总书记掷地有声的话语为奋力谱写中国式现代化建设的陕西篇章指明了方向,提供了根本遵循。
-      </p>
-      <p
-        style="
-          text-indent: 2em;
-          padding: 8px 8px 0 8px;
-          text-align: justify;
-          line-height: 1.5em;
-          font-size: 16px;
-          color: #a73832;
-        "
-      >
-        陕西省外参赛作品发送至邮箱xxqgzhengji@163.com,邮件标题注明【春潮激荡正扬帆】,来稿须附带视频名称、作品简介、主创信息(参赛者姓名、联系电话、所在单位);或下载“闪视频”APP,通过首页置顶专题进行投稿。
-      </p>
-      <p
-        style="
-          text-indent: 2em;
-          padding: 8px 8px 0 8px;
-          text-align: justify;
-          line-height: 1.5em;
-          font-size: 16px;
-          color: #a73832;
-        "
-      >
-        陕西省内参赛作品可通过“学习强国”供稿链路报送,加标签【春潮激荡正扬帆】,并完善信息页作品简介、作者姓名、单位、电话等信息;也可发送至邮箱
-      </p>
-    </van-cell-group>
-    <br />
-    <van-form @submit="onSubmit">
+    <div class="main">
       <van-cell-group inset>
-        <van-nav-bar title="报名信息" />
-        <van-field
-          required
-          v-model="from.name"
-          label="选手姓名"
-          placeholder="请输入用户名"
-          :rules="[{ validator: isString, message: '请输入正确内容' }]"
-        />
-        <van-field
-          name="radio"
-          label="参赛方式"
-          required
-          :rules="[{ validator: isString, message: '请输入正确内容' }]"
+        <van-nav-bar title="活动介绍" />
+        <p
+          style="
+            text-indent: 2em;
+            padding: 8px 8px 0 8px;
+            text-align: justify;
+            line-height: 1.5em;
+            font-size: 16px;
+            color: #a73832;
+          "
         >
-          <template #input>
-            <van-radio-group v-model="from.type" direction="horizontal">
-              <van-radio name="团队" checked-color="#ff2c2c">单位</van-radio>
-              <van-radio name="个人" checked-color="#ff2c2c">个人</van-radio>
-            </van-radio-group>
-          </template>
-        </van-field>
-        <van-field
-          required
-          v-model="from.university"
-          label="所在单位"
-          v-if="from.type === '团队'"
-          placeholder="请输入所在单位"
-          :rules="[{ validator: isString, message: '请输入正确内容' }]"
-        />
-        <van-field
-          required
-          v-model="from.tel"
-          label="联系方式"
-          type="tel"
-          placeholder="请输入手机号"
-          :rules="[{ validator: isNumber, message: '请输入正确内容' }]"
-        /> 
-        <van-field
-          required
-          v-model="from.workTitle"
-          label="作品名称"
-          placeholder="请输入名称"
-          :rules="[{ validator: isString, message: '请输入正确内容' }]"
-        />
-        <van-field
-          v-model="from.introduction"
-          rows="2"
-          autosize
-          label="作品介绍"
-          type="textarea"
-          maxlength="50"
-          placeholder="请输入简介"
-          show-word-limit
-        />
-        <van-field
-          placeholder="上传作品"
-          required
-          label="上传作品"
-          :rules="[{ validator: isFile, message: '请输入正确内容' }]"
+          2023年是改革开放45周年,更是全面贯彻党的二十大精神的开局之年和全党深入开展学习贯彻习近平新时代中国特色社会主义思想主题教育之年。5月17日,习近平总书记在西安主持中国-中亚峰会前夕,专门听取了陕西省委和省政府工作汇报,强调陕西在推进中国式现代化建设中要有勇立潮头、争当时代弄潮儿的志向和气魄,奋力追赶、敢于超越,在西部地区发挥示范作用。习近平总书记掷地有声的话语为奋力谱写中国式现代化建设的陕西篇章指明了方向,提供了根本遵循。
+        </p>
+        <p
+          style="
+            text-indent: 2em;
+            padding: 8px 8px 0 8px;
+            text-align: justify;
+            line-height: 1.5em;
+            font-size: 16px;
+            color: #a73832;
+          "
+        >
+          陕西省外参赛作品发送至邮箱xxqgzhengji@163.com,邮件标题注明【春潮激荡正扬帆】,来稿须附带视频名称、作品简介、主创信息(参赛者姓名、联系电话、所在单位);或下载“闪视频”APP,通过首页置顶专题进行投稿。
+        </p>
+        <p
+          style="
+            text-indent: 2em;
+            padding: 8px 8px 0 8px;
+            text-align: justify;
+            line-height: 1.5em;
+            font-size: 16px;
+            color: #a73832;
+          "
         >
-          <template #input>
-            <van-uploader
-              accept="video/*"
-              v-model="from.file"
-              :max-count="1"
-              :max-size="3145728000"
-              @oversize="filesize"
-              result-type="file"
-            >
-              <template #preview-cover>
-                <van-icon
-                  color="#fff"
-                  size="40"
-                  @click="previewClick"
-                  name="play-circle-o play"
-                />
-              </template>
-            </van-uploader>
-            <p style="font-size: 12px; color: #666">
-              支持上传MP4、MOV格式的视频,视频大小2G以内
-            </p>
-          </template>
-        </van-field>
-        <div style="padding: 5px">
-          <van-button block type="danger" native-type="submit">
-            我要报名
-          </van-button>
-        </div>
+          陕西省内参赛作品可通过“学习强国”供稿链路报送,加标签【春潮激荡正扬帆】,并完善信息页作品简介、作者姓名、单位、电话等信息;也可发送至邮箱
+        </p>
       </van-cell-group>
-    </van-form>
-    <br />
+      <br />
+      <van-form @submit="onSubmit">
+        <van-cell-group inset>
+          <van-nav-bar title="报名信息" />
+          <van-field
+            required
+            v-model="from.name"
+            label="选手姓名"
+            placeholder="请输入用户名"
+            :rules="[{ validator: isString, message: '请输入正确内容' }]"
+          />
+          <van-field
+            name="radio"
+            label="参赛方式"
+            required
+            :rules="[{ validator: isString, message: '请输入正确内容' }]"
+          >
+            <template #input>
+              <van-radio-group v-model="from.type" direction="horizontal">
+                <van-radio name="团队" checked-color="#ff2c2c">单位</van-radio>
+                <van-radio name="个人" checked-color="#ff2c2c">个人</van-radio>
+              </van-radio-group>
+            </template>
+          </van-field>
+          <van-field
+            required
+            v-model="from.university"
+            label="所在单位"
+            v-if="from.type === '团队'"
+            placeholder="请输入所在单位"
+            :rules="[{ validator: isString, message: '请输入正确内容' }]"
+          />
+          <van-field
+            required
+            v-model="from.tel"
+            label="联系方式"
+            type="tel"
+            placeholder="请输入手机号"
+            :rules="[{ validator: isNumber, message: '请输入正确内容' }]"
+          />
+          <van-field
+            required
+            v-model="from.workTitle"
+            label="作品名称"
+            placeholder="请输入名称"
+            :rules="[{ validator: isString, message: '请输入正确内容' }]"
+          />
+          <van-field
+            v-model="from.introduction"
+            rows="2"
+            autosize
+            label="作品介绍"
+            type="textarea"
+            maxlength="50"
+            placeholder="请输入简介"
+            show-word-limit
+          />
+          <van-field
+            placeholder="上传作品"
+            required
+            label="上传作品"
+            :rules="[{ validator: isFile, message: '请输入正确内容' }]"
+          >
+            <template #input>
+              <van-uploader
+                accept="video/*"
+                v-model="from.file"
+                :max-count="1"
+                :max-size="3145728000"
+                @oversize="filesize"
+                result-type="file"
+              >
+                <template #preview-cover>
+                  <van-icon
+                    color="#fff"
+                    size="40"
+                    @click="previewClick"
+                    name="play-circle-o play"
+                  />
+                </template>
+              </van-uploader>
+              <p style="font-size: 12px; color: #666">
+                支持上传MP4、MOV格式的视频,视频大小2G以内
+              </p>
+            </template>
+          </van-field>
+          <div style="padding: 5px">
+            <van-button block type="danger" native-type="submit">
+              我要报名
+            </van-button>
+          </div>
+        </van-cell-group>
+      </van-form>
+      <br />
 
-    <div class="guize" @click="showGuize">参赛要求</div>
-    <div class="guize" style="top: 5em" @click="showRongyu">奖项设置</div>
+      <div class="guize" @click="showGuize">参赛要求</div>
+      <div class="guize" style="top: 5em" @click="showRongyu">奖项设置</div>
 
-    <div
-      class="Preview"
-      :style="preview !== '' ? '' : 'z-index: -1;opacity: 0'"
-    >
-      <van-icon
-        name="close"
-        color="#fff"
-        size="30"
-        class="close"
-        @click="closePreview"
-      />
-      <video ref="previewVideo" controls :src="preview"></video>
+      <div
+        class="Preview"
+        :style="preview !== '' ? '' : 'z-index: -1;opacity: 0'"
+      >
+        <van-icon
+          name="close"
+          color="#fff"
+          size="30"
+          class="close"
+          @click="closePreview"
+        />
+        <video ref="previewVideo" controls :src="preview"></video>
+      </div>
     </div>
   </div>
 </template>
@@ -184,12 +186,12 @@ const from = reactive({
   type: '个人',
   file: [],
   university: '',
-  workTitle: ''
+  workTitle: '',
 });
 
-window.onresize  = () => {
-    topWidth.value = document.body.offsetWidth
-}
+window.onresize = () => {
+  topWidth.value = document.body.offsetWidth;
+};
 
 const filesize = () => showToast('超出文件大小限制');
 const previewClick = () => {
@@ -285,7 +287,7 @@ const onSubmit = () => {
   oriData.append('operateId', '3');
   oriData.append('name', from.name);
   oriData.append('phone', from.tel);
-//   oriData.append('isOnline', true);
+  //   oriData.append('isOnline', true);
   oriData.append('introduction', from.introduction);
   oriData.append('type', from.type);
   oriData.append('university', from.university);
@@ -415,4 +417,8 @@ const onSubmit = () => {
   border-bottom-left-radius: 1em;
   z-index: 11;
 }
+
+.setSail .main {
+    max-width: 500px;
+}
 </style>