feat:合并

src/views/projectcenter/templateAdd.vue

@@ -51,36 +51,31 @@
             />
             <div class="inname">封面图</div>
           </div>
-          <div class="in select" style="flex: 1">
-            <a-select
-              :getPopupContainer="
-                (triggerNode) => {
-                  return triggerNode.parentNode || document.body;
-                }
-              "
-              v-model:value="projectInfo.picUrl"
-              dropdownClassName="dropdown-style"
-              style="width: 440px"
-              placeholder="请选择"
-              :options="projectPic"
-              @change="handleChangeSelect"
-              allowClear
-            ></a-select>
-            <img
+          <div class="in select" style="display: flex">
+            <div
+              :class="`box ${projectInfo.picUrl === src.value ? 'active' : ''}`"
               style="
                 width: 100px;
                 height: 100px;
-                margin-top: 20px;
-                border-radius: 8px;
+                border-radius: 5px;
+                cursor: pointer;
+                position: relative;
+                overflow: hidden;
               "
-              v-if="projectInfo.picUrl"
-              :src="projectInfo.picUrl"
-              alt="avatar"
-            />
-            <div class="i_bottom">
-              <span style="color: #999ba3">
-                高宽比为16:9 (如:800*450) png或jpg图片
-              </span>
+              v-for="(src, index) in projectPic"
+              :key="index"
+              @click="() => (projectInfo.picUrl = src.value)"
+            >
+              <img
+                style="
+                  width: 100px;
+                  height: 100px;
+                  margin-bottom: 4px;
+                  margin-right: 4px;
+                "
+                :src="src.value"
+                alt="avatar"
+              />
             </div>
           </div>
         </div>
@@ -266,10 +261,6 @@ const backPage = () => {
   router.back();
 };
 
-const handleChangeSelect = (value) => {
-  projectInfo.value.picUrl = value;
-};
-
 function timeChange(e) {
   if (e && e.length === 2) {
     projectInfo.value.beginTime = e[0];
@@ -317,6 +308,9 @@ function managerChange(e, l, d, t) {
 }
 </script>
 <style lang="scss">
+.active {
+  border: 2px solid rgba(78, 166, 255, 1);
+}
 .projectAdd {
   width: 100%;
   // height: inherit;