axwen-test31 2.0.0

package/src/views/reach/resource-state/resourceDetail.vue

@@ -0,0 +1,1483 @@
+<template>
+  <div class="form-all" v-loading="isLoading">
+      <div class="form-part">
+          <resourceListHeadVue 
+              v-if="isLoaded"
+              :title="title" 
+              :titleCode="titleCode" 
+              :channelType="channelType" 
+              :resourceNicheType="resourceNicheType" 
+              :width="width" 
+              :height="height"  
+              :processedResourceTotal="processedResourceTotal" 
+              :processedListingResourceTotal="processedListingResourceTotal"
+              :showicon="false"
+              style="padding-right: 5px;"
+              />
+          <div class="basic-form">
+              <span class="title-text">基本信息</span>
+              <div class="form-content">
+                  <el-form ref="basicform" :model="basicform" :rules="isEditMode ? rules : {}" label-width="100px"  :readonly="isReadOnly">
+                      <el-row>
+                          <el-col :span="12">
+                              <el-form-item label="标题：" prop="title" >
+                                  <el-input v-model="basicform.title" placeholder="请输入标题" style="width: 70%;"
+                                      :readonly="isReadOnly"></el-input>
+                              </el-form-item>
+                          </el-col>
+                          <el-col :span="12">
+                              <el-form-item label="优先级：" prop="priority">
+                                  <el-input v-model.number="basicform.priority" placeholder="请输入优先级"
+                                      style="width: 70%;" :readonly="isReadOnly"></el-input>
+                              </el-form-item>
+                          </el-col>
+                      </el-row>
+                      <el-row>
+                          <el-col :span="12">
+                              <el-form-item label="生效开始时间：" prop="startTime">
+                                  <el-date-picker type="datetime" placeholder="请设置开始时间" v-model="basicform.startTime"
+                                      format="yyyy-MM-dd HH:mm:ss" :readonly="isReadOnly"
+                                      style="width: 70%;"></el-date-picker>
+                              </el-form-item>
+                          </el-col>
+                          <el-col :span="12">
+                              <el-form-item label="生效结束时间：" prop="endTime">
+                                  <el-date-picker type="datetime" placeholder="请设置结束时间" v-model="basicform.endTime"
+                                      format="yyyy-MM-dd HH:mm:ss" :readonly="isReadOnly"
+                                      style="width: 70%;"></el-date-picker>
+                              </el-form-item>
+                          </el-col>
+                      </el-row>
+                      <el-row>
+                          <el-col :span="12">
+                              <el-form-item label="说明：" prop="dsc">
+                                  <el-input type="textarea" style="width: 70%;" placeholder="请输入说明"
+                                      v-model="basicform.dsc" :readonly="isReadOnly" maxlength="256"></el-input>
+                              </el-form-item>
+                          </el-col>
+                          <el-col :span="12" v-if="this.showlistingList.length > 0">
+                              <el-form-item label="上架记录：" prop="log" v-show="state === 'detail'">
+                                  <div class="shelfLog" :title="formattedLog" :readonly="isReadOnly">
+                                      <div v-for="(item, index) in showlistingList" :key="index" class="log-item">
+                                          {{ item.crtTm }}
+                                          {{ item.listingStatus }}
+                                      </div>
+                                  </div>
+                              </el-form-item>
+                          </el-col>
+
+                          <el-col :span="12" v-else>
+                              <el-form-item label="上架记录：" prop="log" v-show="state === 'detail'">
+                                  <div class="shelfLogEmpty">暂无上架记录</div>
+                              </el-form-item>
+                          </el-col>
+                      </el-row>
+                  </el-form>
+              </div>
+          </div>
+          <div class="resource-item">
+              <span class="title-text">资源信息</span>
+              <div class="form-content">
+                  <el-form ref="resourceform" :model="resourceform" :rules="isEditMode ? resourcerules : {}"
+                      label-width="88px">
+                      <el-row>
+                          <el-col :span="24">
+                              <el-form-item :label="getLabel" prop="localPicture">
+                                  <div class="upload-container">
+                                      <span v-if="imageUrl && !isReadOnly" class="close-icon"
+                                          @click.stop="clearImage">×</span>
+                                      <el-button v-if="!isReadOnly" :disabled="isReadOnly" type="text"
+                                          class="upload-button" @click.prevent="showUploadConfirm"></el-button>
+                                      <el-upload class="avatar-uploader" :action="''" :show-file-list="false"
+                                          :disabled="isReadOnly">
+                                          <el-image ref="image" v-if="imageUrl" :src="imageUrl" class="avatar" :preview-src-list="[imageUrl]"/>
+                                          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                                          <div class="mask"  v-if="imageUrl" @click="handlePictureCardPreview(imageUrl)">
+                                              <span class="el-upload-icon" >
+                                                  <i class="el-icon-zoom-in"></i>
+                                              </span>
+                                          </div>
+                                      </el-upload>
+                                  </div>
+                              </el-form-item>
+                              <!-- <span class="notify-upload">建议尺寸：750*1624，大小不超过2M，尺寸为png/jpg/jpeg</span> -->
+                          </el-col>
+                      </el-row>
+                      <el-row>
+                          <el-col :span="12">
+                              <el-form-item label="跳转活动：" prop="jumpUrlName" class="jump">
+                                  <!-- <el-button class="jumpButton" @click="showPop = true"
+                                  :disabled="isReadOnly"></el-button> -->
+                                  <!-- <input class="jumpUrlShow" v-model="resourceform.jumpUrlName" /> -->
+                                  <!-- <banner :visible.sync="showPop" @input="handleSelectDataID"
+                                  @confirm="handleSelectData" /> -->
+                                  <el-input v-model="resourceform.jumpUrlName" placeholder="请输入跳转活动":disabled="isReadOnly" />
+                              </el-form-item>
+                          </el-col>
+                      </el-row>
+                      <el-row>
+                          <el-col :span="12">
+                              <!-- <el-form-item label="参与客户：" prop="custListType">
+                              <el-radio-group v-model="resourceform.custListType" @input="selectSpecialGroup"
+                                  :disabled="isReadOnly">
+                                  <el-radio :label="0" style="margin-right: 10px;">全部</el-radio>
+                                  <el-radio :label="1">特定客群</el-radio>
+                              </el-radio-group>
+                          </el-form-item> -->
+                              <el-form-item label="参与客户：" prop="custListType">
+                                  <el-button-group v-model="resourceform.custListType" :disabled="isReadOnly">
+                                      <el-button v-for="item in DICTS" :key="item.value" :value="item.value" :disabled="isReadOnly"
+                                          @click="handleRadioChange(item.value)"
+                                          :type="resourceform.custListType === item.value ? 'primary' : 'default'">
+                                          {{ item.label }}
+                                      </el-button>
+                                  </el-button-group>
+                              </el-form-item>
+                              <groupList :visible.sync="groupVisible" @submit="submit" @cancel="cancel"
+                                  @update="groupListVisible"></groupList>
+                          </el-col>
+                      </el-row>
+                      <el-row>
+                          <el-col :span="12">
+                              <el-form-item v-show="this.selectCustomer" label="客群类型：">
+                                  {{ this.groupType }}
+                              </el-form-item>
+                          </el-col>
+                          <el-col :span="12">
+                              <el-form-item v-show="this.selectCustomer" label="客群名称：">
+                                  <!-- {{ this.groupList.name }} -->
+                                  <el-button type="text" @click="handleGroupDetail">{{ this.groupList.name }}</el-button>
+                              </el-form-item>
+                          </el-col>
+                      </el-row>
+                      <el-row>
+                          <el-col :span="12">
+                              <el-form-item v-show="resourceform.custListType === '2'"  prop="eventRelation" label="即时事件：">
+                                  <el-popover v-model:visible="popoverVisible" ref="popoverRef" placement="bottom-start" width="300" trigger="click" :disabled="isReadOnly">
+                                      <div class="tree-container">
+                                      <el-tree accordion :data="filteredEventTreeData" node-key="code"
+                                          :props="treeProps" :default-expand-all="true" :highlight-current="true"
+                                          :current-node-key="resourceform.eventCode" :expand-on-click-node="false"
+                                          @node-click="handleNodeClick" :disabled="isReadOnly"/>
+                                      </div>
+                                      <template #reference>
+                                          <el-input v-model="resourceform.eventRelation" placeholder="请选择事件名称"
+                                              clearable @clear="handleClear" @input="handleInput":disabled="isReadOnly" />
+                                      </template>
+                                  </el-popover>
+                              </el-form-item>
+                          </el-col>
+                      </el-row>
+                  </el-form>
+              </div>
+          </div>
+      </div>
+      <div class="bottom-button" v-if="!hiddenOperate">
+          <el-button @click="cancelsubmit">取消</el-button>
+          <el-button type="primary" @click="submitForm('save')" :disabled="isReadOnly">保存</el-button>
+          <el-button type="primary" @click="submitForm('saveapproval')" :disabled="isReadOnly">保存并提交审批</el-button>
+      </div>
+
+      <el-dialog :visible.sync="dialogVisible" :title="getTitle" width="70%">
+          <el-table :data="resourceList" style="width: 100%" @row-click="handleRowClick"
+              :row-class-name="tableRowClassName" max-height="400">
+              <el-table-column label="选择" style="width: 10%">
+                  <template slot-scope="scope">
+                      <el-radio v-model="selectedRow" :label="scope.row.id">
+                          &nbsp;
+                      </el-radio>
+                  </template>
+              </el-table-column>
+              <el-table-column prop="tempName" label="图片名称" style="width: 10%">
+              </el-table-column>
+              <el-table-column prop="imgType" label="图片类型" style="width: 10%">
+                  <template #default="scope">
+                      {{ imgTypeMap[scope.row.imgType] || '未知类型' }}
+                  </template>
+              </el-table-column>
+              <el-table-column prop="imgContent" label="图片" style="width: 10%">
+                  <template #default="scope">
+                      <!-- <img :src="getImgSrc(scope.row.imgContent)" alt="图片"
+                          style="max-width: 100%; max-height: 100px;"> -->
+                          <img class="hahaha" :src="getImgSrc(scope.row.imgContent)" alt="图片"
+                          style="max-width: 100%; max-height: 100px;">	
+                  </template>
+              </el-table-column>
+              <el-table-column prop="shareRange" label="共享范围" style="width: 10%">
+                  <template #default="scope">
+                      {{ shareRangeMap[scope.row.shareRange] || '' }}
+                  </template>
+              </el-table-column>
+              <el-table-column prop="crtByName" label="创建人" style="width: 10%">
+                  <template #default="scope">
+                      {{ scope.row.crtByName + '(' + scope.row.crtBy + ')' || '' }}
+                  </template>
+              </el-table-column>
+              <el-table-column prop="crtTm" label="创建时间" style="width: 10%">
+              </el-table-column>
+          </el-table>
+          <template #footer>
+              <span class="dialog-footer">
+                  <div class="pagination">
+                      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+                          @prev-click="lastPage" @next-click="nextPage" class="bottom-pagination"
+                          :current-page="currentPage" :page-sizes="[5, 10, 20, 50]" :page-size="pageSize"
+                          layout="total, sizes, prev, pager, next, jumper" :total="total">
+                      </el-pagination>
+                  </div>
+                  <div class="popbutton">
+                      <el-button @click="dialogVisible = false">取消</el-button>
+                      <el-button type="primary" @click="confirmUpload">确定</el-button>
+                  </div>
+              </span>
+          </template>
+      </el-dialog>
+  </div>
+</template>
+<script>
+import { getImgs } from '@/api/template/template-picture'
+import { searchResourceNew, showResourceDetail, approvalResource, editResource,getResourceDetail } from '../../../api/reach';
+import { IMG_INTERFACE, IMG_REACH_INTERFACE } from '@/utils/variable'
+// import banner from '../resource-state/bannerjump'
+import groupList from '../resource-state/groupList'
+import { getSource } from '../../../api/reachsource';
+import { getAllNowEventList, getEventSearchChildList } from '../../../api/event'
+import resourceListHeadVue from '../resource-state/components/resourceListHead.vue';
+import dayjs from 'dayjs';
+import { cloneDeep } from 'lodash';
+export default {
+  components: { groupList,resourceListHeadVue },
+  data() {
+      const currentTime = dayjs()
+      return {
+          basicform: {
+              title: '',
+              priority: '',
+              startTime: null,
+              endTime: null,
+              dsc: '',
+          },
+          resourceform: {
+              localPicture: "",
+              adPictureFile: "",
+              jumpUrlSourceId: "",
+              jumpUrlFile: "",
+              jumpUrlType: 0,
+              libraryId: "",
+              custListType: null,
+              custList: "",
+              jumpUrl: '',
+              jumpUrlName: '',
+              eventCode: '',
+              eventRelation: '',
+              custListRelation: {
+                  groupList:{},
+                  groupType:'',
+              },
+          },
+          isDetailMode: false,
+          dialogVisible: false,//banner 弹窗图片
+          groupVisible: false,
+          // showPop: false,//banner跳转
+          selectedFile: null,
+          imageUrl: '',
+          imageShow: '',
+          image: '',
+          resourceList: [],
+          formattedLog: '',
+          selectedRowData: null,//选中数据
+          selectImgData: '',//选中图片地址
+          currentPage: 1, // 当前页码
+          pageSize: 5, // 每页显示数量
+          total: 0, // 总记录数,
+          isLoading: false,
+          selectedRow: null,
+          groupType: '',
+          filteredEventTreeData:[],
+          eventTreeData:[],
+          popoverVisible: false,
+          isLoaded:false,
+          imgTypeMap: {
+              '1': '图片',
+              '2': '缩略图'
+          },
+          shareRangeMap: {
+              '0': '共享',
+              '1': '私有'
+          },
+          rules: {
+              title: [
+                  { required: true, message: '请输入活动名称'},
+              ],
+              priority: [
+                  { required: true, message: '请输入优先级' },
+                  {
+                      validator: (rule, value, callback) => {
+                          const reg = /^[1-9]\d{0,8}$/;
+                          if (!value) {
+                              return callback(new Error('请输入优先级'));
+                          }
+                          if (!reg.test(value)) {
+                              return callback(new Error('请输入 1 到 999999999 的正整数'));
+                          }
+                          callback();
+                      },
+                  }
+              ],
+              // startTime: [
+              //     { required: true, message: '请选择生效开始时间' },
+              //     {
+              //         validator: (rule, value, callback) => {
+              //             const { endTime } = this.basicform;
+              //             if (!value) {
+              //                 return callback();
+              //             }
+              //             if (dayjs(value).isBefore(currentTime)) {
+              //                 return callback(new Error('开始时间必须大于当前时间'));
+              //             }
+              //             if (endTime && dayjs(value).isAfter(endTime)) {
+              //                 return callback(new Error('开始时间必须小于结束时间'));
+              //             }
+              //             callback();
+              //         }
+              //     }
+              // ],
+              // endTime: [
+              //     { required: true, message: '请选择生效结束时间' },
+              //     {
+              //         validator: (rule, value, callback) => {
+              //             const { startTime } = this.basicform;
+              //             if (!this.basicform.startTime || !value) {
+              //                 return callback();
+              //             }
+              //             if (startTime && dayjs(value).isBefore(startTime)) {
+              //                 return callback(new Error('结束时间必须大于开始时间'));
+              //             }
+              //             callback();
+              //         }
+              //     }
+              // ]
+          },
+          resourcerules: {
+              localPicture: [
+                  { required: true, message: '请上传图片' }
+              ],
+              // jumpUrlName: [
+              //     { required: true, message: '请设置跳转活动', trigger: 'blur' }
+              // ],
+              custListType: [
+                  { required: true, message: '请选择参与客户' }
+              ],
+              eventRelation: [
+                  {
+                  validator: (rule, value, callback) => {
+                      if (this.resourceform.custListType === '2' && !value) {
+                      callback(new Error('请选择即时事件'));
+                      } else {
+                      callback();
+                      }
+                  }
+                  }
+              ]
+          },
+          resourceNicheId: '',
+          resourceNicheType: '',
+          channelType:'',
+          title:'',
+          titleCode:'',
+          processedResourceTotal:'',
+          processedListingResourceTotal:'',
+          height:'',
+          width:'',
+          H5DataID: '',
+          H5Item: '',
+          groupList: {
+              name:''
+          },
+          adPictureFile: null,
+          row: '',
+          state: '',
+          isReadOnly: false,
+          libraryId: '',
+          adStatus: null,
+          listingStatus: null,
+          originalData: {},
+          isEditMode: true,
+          showlistingList: [],
+          DICTS: {},
+          treeProps: {
+              label: 'name',
+              children: 'children',
+              disabled: 'disabled',
+          },
+          selectCustomer:false
+      }
+  },
+  computed: {
+      hiddenOperate(){
+          return this.$route.query.hiddenOperate === 'true'
+      },
+      getLabel() {
+          if (this.resourceNicheType.includes('banner')) {
+              return '封面';
+          } else if (this.resourceNicheType.includes('pop')) {
+              return '封面';
+          }
+          return '默认封面：';
+      },
+      getTitle() {
+          if (this.resourceNicheType.includes('banner')) {
+              return '封面图';
+          } else if (this.resourceNicheType.includes('pop')) {
+              return '封面图';
+          }
+          return '默认封面图';
+      },
+      groupOtherParams() {
+          return { stat: '01', libId: undefined }
+      },
+  },
+  watch: {
+      '$route'(to, from) {
+          if (to.name === 'resourceNew') { // 确保是当前路由
+              this.initData(); // 重新初始化数据
+              this.handleAction(); // 重新执行操作
+          }
+      },
+      'resourceform.custListType': function(newVal) {
+          this.$refs['resourceform'].validateField('eventRelation');
+      }
+  },
+  created() {
+      this.initData();
+  },
+  mounted() {
+      this.handleAction();
+      console.log(this.pkId)
+  },
+  methods: {
+      handlePictureCardPreview(imageUrl) {
+          this.$refs.image.clickHandler();
+      },
+      handleGroupDetail() {
+          if (this.groupList.type) {
+              let query = {
+                  portraitType: 'group',
+                  pkId: this.groupList.pkId,
+                  libId: this.groupList.libId,
+                  type: this.groupList.type,
+                  crtBy: this.groupList.crtBy,
+              }
+              let querylist = Object.keys(query)
+              let path = '/sub-app/mp-cm/groupDetail'
+              querylist.forEach((item, index) => {
+                  if (index === 0) {
+                      path = `${path}?${item}=${query[item]}`
+                  } else {
+                      path = `${path}&${item}=${query[item]}`
+                  }
+              })
+              this.$pushState(path)
+          }
+      },
+      initData() {
+          const query = this.$route.query;
+          this.resourceNicheId = query.resourceNicheId || '';
+          this.handleGetDetail(this.resourceNicheId)
+          this.pkId = query.pkId;
+          this.state = query.state;
+          this.width=query.width
+          this.height = query.height
+          this.imageShow = query.imageUrl || ''
+          this.$getOptionsForSystemParams('RESOURCE_PARTICIPATE').then(res => {
+              this.DICTS = res
+          })
+      },
+      async handleGetDetail(id){
+          const response = await getResourceDetail(id)
+          this.title = response.data.title
+          this.titleCode = response.data.titleCode
+          this.channelType = response.data.channelType
+          this.resourceNicheType = response.data.resourceNicheType
+          this.processedListingResourceTotal = response.data.listingResourceTotal
+          this.processedResourceTotal = response.data.resourceTotal
+          this.isLoaded = true
+      },
+      //         async getBaseEventData(code) {
+      //             this.isLoading = true
+      //             this.eventTreeData = []
+      //             console.log('111')
+      //             try {
+      //                 // if (typeof code !== 'string' && typeof code !== 'number')
+      //                 // return
+      //                 const res = await getAllNowEventList()
+      //                 console.log(res,'resss')
+      //                 const eventName = res.data[0].eventName
+      //                 const eventCode = res.data[0].eventCode
+      //                 const params = {
+      //                     pageNum: 1,
+      //                     pageSize: 20,
+      //                     search: {
+      //                         parentEventCode: eventCode
+      //                     }
+      //                 }
+      //                 const response = await getEventSearchChildList(params)
+      //                 console.log(response.data.list,'0000')
+      //                 // if (res?.success) {
+      //                 // const rawData = res.data[code] || []
+      //                 // this.eventTreeData = Array.isArray(rawData) ? rawData : [rawData]
+      //                 // this.filteredEventTreeData = this.eventTreeData
+      //                 // }
+      //             }
+      //   catch (err) {
+      //     console.error('获取事件名称失败:', err)
+      //     this.eventNames = []
+      //     this.Form.eventName = null
+      //   }
+      //   finally {
+      //     this.isLoading = false
+      //   }
+      // },
+      async getBaseEventData() {
+          this.isLoading = true;
+          this.eventTreeData = [];
+          try {
+              const res = await getAllNowEventList();
+              if (!res?.success || !Array.isArray(res.data) || res.data.length === 0) return;
+              const parentEvents = res.data.map
+                  (item => ({
+                      name: item.eventName,
+                      code: item.eventCode,
+                      children: [],
+                      isParent:true
+                  }));
+
+              for (const parent of parentEvents) {
+                  const params = {
+                          pageNum: 1,
+                          pageSize: 20,
+                          search: {
+                              parentEventCode: parent.code,
+                              dataState:'1'
+                          }
+                      };
+                  const response = await getEventSearchChildList(params);
+                  if (response?.success && Array.isArray(response.data?.list)) {
+                      parent.children = response.data.list.map
+                          (child => ({
+                              name: child.eventName,
+                              code: child.eventCode
+                          }));
+                  }
+              }
+              this.filteredEventTreeData = this.eventTreeData = parentEvents;
+          } catch(err) {
+              console.error('获取事件失败:', err);
+              this.eventTreeData = [];
+          } finally {
+              this.isLoading = false;
+          }
+      },
+      handleNodeClick(data) {
+      if (data.disabled)
+          return
+      const isLeaf = !data.children || (Array.isArray(data.children) && data.children.length === 0)
+      if (data.isParent) {
+          return;
+      }
+      if (isLeaf) {
+          this.resourceform.eventCode = data.code
+          this.resourceform.eventRelation = data.name
+          this.popoverVisible = false;
+      }
+  },
+      handleClear() {
+          this.resourceform.eventCode = ''
+          this.filteredEventTreeData = this.eventTreeData
+      },
+      handleInput(value) {
+          if (!value) {
+              this.filteredEventTreeData = this.eventTreeData // 恢复全部
+              return
+          }
+          const keyword = value.toLowerCase()
+          this.filteredEventTreeData = this.filterTree(this.eventTreeData, keyword)
+      },
+      filterTree(nodes, keyword) {
+          return nodes
+              .map((node) => {
+                  const isParentNode = node.children?.length > 0
+                  const isSelfMatch = node.name.toLowerCase().includes(keyword)
+
+                  // 复制节点避免污染原数据
+                  const newNode = { ...node, disabled: isParentNode }
+
+                  // 如果是父节点且匹配，保留自身和所有子节点
+                  if (isParentNode && isSelfMatch) {
+                      return newNode // 保留完整子树
+                  }
+
+                  // 如果是父节点但自身不匹配，检查子节点
+                  if (isParentNode) {
+                      const filteredChildren = this.filterTree(node.children, keyword)
+                      if (filteredChildren.length > 0) {
+                          newNode.children = filteredChildren
+                          return newNode // 子节点有匹配则保留父节点
+                      }
+                      return null // 无匹配子节点时丢弃
+                  }
+
+                  // 叶子节点直接匹配
+                  return isSelfMatch ? newNode : null
+              })
+              .filter(Boolean)
+      },
+      handleAction() {
+          if (this.state === 'detail') {
+              this.isDetailMode = true;
+              this.isReadOnly = true;
+              const baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
+              this.imageUrl = baseUrl + IMG_REACH_INTERFACE + this.imageShow;
+              // this.image = this.imageUrl = this.imageShow
+              this.getDetail();
+          } else if (this.state === 'edit') {
+              const baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
+              this.imageUrl = baseUrl + IMG_REACH_INTERFACE + this.imageShow;
+              this.image = this.imageUrl
+              // this.image = this.imageUrl = this.imageShow
+              this.getDetail();
+
+          } else if (this.state === 'copy') {
+              const baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
+              this.imageUrl = baseUrl + IMG_REACH_INTERFACE + this.imageShow;
+              this.image = this.imageUrl
+              // this.image = this.imageUrl = this.imageShow
+              this.getCopyDetail();
+          }
+          if (!this.isDetailMode) {
+              this.$nextTick(() =>{
+                  this.$refs.basicform?.clearValidate(); // 编辑/新增时不提示错误
+              });
+          }
+      },
+      showUploadConfirm() {
+          this.dialogVisible = true;
+          this.getBannerList()
+      },
+      async getBannerList() {
+          const params = {
+              beginEndDate: null,
+              pageNum: this.currentPage,
+              pageSize: this.pageSize,
+              search: {
+                  scene: '01',
+                  tempStatus: '01'
+              },
+              searchOrg: '',
+              tempName: '',
+              tempStatus: '01'
+          }
+          try {
+              const response = await getImgs(params);
+              const data = response.data;
+              this.resourceList = data?.list || [];
+              this.total = data?.total || 0;
+          } catch (error) {
+              console.error('请求资源数据时出错:', error);
+          }
+      },
+      async reachImage(path) {
+          const response = await getSource(path)
+          const url = URL.createObjectURL(response.data);
+          return url
+      },
+      async getDetail() {
+          if (this.pkId) {
+              try {
+                  const res = await showResourceDetail(this.pkId)
+                  const { errorMsg, errorCode, data = {} } = res
+                  if (errorCode === '000000') {
+                      this.originalData = cloneDeep(data)
+                      // const localPicture = await this.reachImage(data.localPicture)
+                      // this.imageUrl = await this.reachImage(this.imageShow)
+                      // this.imageUrl = await this.reachImage(data.localPicture)
+                      const baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
+                      this.image = baseUrl + IMG_REACH_INTERFACE + data.localPicture;
+                      this.imageUrl = baseUrl + IMG_REACH_INTERFACE + data.localPicture;
+                      this.listingStatus = data.listingStatus
+                      this.adStatus = data.adStatus
+                      this.basicform = {
+                          title: data.title,
+                          priority: data.priority,
+                          startTime: dayjs(data.startTime).toDate(), // 假设使用dayjs来处理日期
+                          endTime: dayjs(data.endTime).toDate(),
+                          dsc: data.dsc
+                      };
+                      if(data.custListRelation){
+                          var custListRelation = data.custListRelation 
+                      ? JSON.parse(data.custListRelation) 
+                      : null;
+                      const groupType = custListRelation?.groupType
+                      this.groupType = groupType
+                      }
+                      this.resourceform = {
+                          jumpUrlSourceId: data.jumpUrlSourceId,
+                          jumpUrl: data.jumpUrl,
+                          jumpUrlType: data.jumpUrlType,
+                          jumpUrlName: data.jumpUrlName,
+                          custListType: String(data.custListType),
+                          eventCode:data.eventCode,
+                          eventRelation:data.eventRelation,
+                          custListRelation:custListRelation,
+                          localPicture: data.localPicture
+                          // localPicture: `http://172.17.0.137:18000/imind-reach/fileCommon/download?path=${data.localPicture}`
+                      };
+                      // this.image = this.imageUrl = this.resourceform.localPicture
+
+                      if(data.custListType === 1){
+                          this.selectCustomer = true
+                      }
+                      this.groupList = {
+                          libId: data.libraryId,
+                          pkId: data.custList,
+                          name: custListRelation?.groupList?.name,
+                      };
+                      console.log(custListRelation?.group, 'group--------------');
+                      if (custListRelation?.groupType === '静态客群') {
+                          this.groupList.type = '99'
+                      } else if (custListRelation?.groupType === '动态客群') {
+                          this.groupList.type = '98'
+                      } else if (custListRelation?.groupType === '组合客群') {
+                          this.groupList.type = '66'
+                      } else if (custListRelation?.groupType === '事件客群') {
+                          this.groupList.type = '96'
+                      }
+                      this.H5DataID = data.jumpUrlSourceId;
+                      // this.imageUrl = `http://172.17.0.137:18000/imind-reach/fileCommon/download?path=${data.localPicture}`
+                      // this.imageUrl = localPicture
+                      if (data?.listingLogList && data.listingLogList.length > 0) {
+                          const statusMap = {
+                              0: '下架',
+                              1: '上架'
+                          };
+                          this.showlistingList = data.listingLogList.map(item => ({
+                              listingStatus: statusMap[item.listingStatus] || '', // 映射状态
+                              crtTm: item.crtTm ? dayjs(item.crtTm).format('YYYY-MM-DD HH:mm:ss') : '--' // 格式化时间
+                          }));
+                      } else {
+                          this.showlisting = [];
+                  }
+                  if(this.resourceform.custListType === '2'){
+                      this.getBaseEventData()
+                  }
+                  } else {
+                      this.$message.error(errorMsg || '查询失败')
+                  }
+              } catch (error) {
+                  console.error('请求失败详情:', error);
+              }
+          }
+      },
+      async getCopyDetail() {
+          try {
+              const res = await showResourceDetail(this.pkId)
+              const { errorMsg, errorCode, data = {} } = res
+              if (errorCode === '000000') {
+                  this.listingStatus = data.listingStatus
+                  this.adStatus = data.adStatus
+                  this.basicform = {
+                      title: data.title + '_copy',
+                      priority: data.priority,
+                      startTime: dayjs(data.startTime).toDate(), // 假设使用dayjs来处理日期
+                      endTime: dayjs(data.endTime).toDate(),
+                      dsc: data.dsc
+                  };
+                  if(data.custListRelation){
+                          var custListRelation = data.custListRelation 
+                      ? JSON.parse(data.custListRelation) 
+                      : null;
+                  const groupType = custListRelation?.groupType
+                  this.groupType = groupType
+                  }
+                  // const localPicture = await this.reachImage(data.localPicture)
+                  // this.imageUrl = await this.reachImage(data.localPicture)
+                  const baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
+                  this.image = baseUrl + IMG_REACH_INTERFACE + data.localPicture;
+                  this.imageUrl = baseUrl + IMG_REACH_INTERFACE + data.localPicture;
+                  this.resourceform = {
+                      jumpUrlSourceId: data.jumpUrlSourceId,
+                      jumpUrl: data.jumpUrl,
+                      jumpUrlType: data.jumpUrlType,
+                      jumpUrlName: data.jumpUrlName,
+                      custListType: String(data.custListType),
+                      eventCode:data.eventCode,
+                      eventRelation:data.eventRelation,
+                      custListRelation:custListRelation,
+                      // localPicture: `http://172.17.0.137:18000/imind-reach/fileCommon/download?path=${data.localPicture}`
+                      // localPicture:localPicture
+                      localPicture: data.localPicture
+                  };
+                  // this.image = this.imageUrl = this.resourceform.localPicture
+                  if(data.custListType === 1){
+                          this.selectCustomer = true
+                      }
+                      this.groupList = {
+                          libId: data.libraryId,
+                          pkId: data.custList,
+                          name:custListRelation?.groupList?.name
+                      };
+                  this.H5DataID = data.jumpUrlSourceId;
+                  // this.imageUrl = `http://172.17.0.137:18000/imind-reach/fileCommon/download?path=${data.localPicture}`
+                  // this.imageUrl = localPicture
+                  if (data?.listingLogList && data.listingLogList.length > 0) {
+                      const statusMap = {
+                          0: '下架',
+                          1: '上架'
+                      };
+                      this.showlistingList = data.listingLogList.map(item => ({
+                          listingStatus: statusMap[item.listingStatus] || '', // 映射状态
+                          crtTm: item.crtTm ? dayjs(item.crtTm).format('YYYY-MM-DD HH:mm:ss') : '--' // 格式化时间
+                      }));
+                  } else {
+                      this.showlisting = [];
+                  }
+                  this.pkId = ''
+                  if(this.resourceform.custListType === '2'){
+                  this.getBaseEventData()
+                  }
+              } else {
+                  this.$message.error(errorMsg || '查询失败')
+              }
+          } catch (error) {
+              console.error('请求失败详情:', error);
+              this.$message.error('请求失败，请稍后重试')
+          }
+      },
+      handleChange() {
+          const currentData = {
+              basicform: this.basicform,
+              resourceform: this.resourceform,
+              groupList: this.groupList,
+              H5DataID: this.H5DataID
+          };
+          return JSON.stringify(this.originalData) !== JSON.stringify(currentData);
+      },
+      confirmUpload() {
+          if (!this.selectedRowData) {
+              this.$message.error('请先选择一行');
+              return;
+          }
+          this.dialogVisible = false;
+          const baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
+          this.image = baseUrl + IMG_REACH_INTERFACE + this.selectImgData;
+          this.imageUrl = baseUrl + IMG_REACH_INTERFACE + this.selectImgData;
+          // this.imageUrl = 'http://172.17.0.137:18000' + IMG_INTERFACE + this.selectImgData;
+          this.resourceform.localPicture = IMG_REACH_INTERFACE + this.selectImgData;
+      },
+      handleRowClick(row) {
+          this.selectedRowData = row;
+          this.selectImgData = row.imgContent;
+          this.selectedRow = row.id
+          // this.state = 'pictChange'
+      },
+      tableRowClassName({ row }) {
+          if (this.selectedRowData && row === this.selectedRowData) {
+              return 'selected-row';
+          }
+          return '';
+      },
+      handleSizeChange(newSize) {
+          this.pageSize = newSize; // 更新每页显示数量
+          this.currentPage = 1; // 切换每页显示数量时，重置当前页码为1
+          this.getBannerList()
+      },
+      handleCurrentChange(newPage) {
+          this.currentPage = newPage; // 更新当前页码
+          this.getBannerList()
+
+      },
+      lastPage() {
+          if (this.currentPage > 1) {
+              this.currentPage--; // 上一页，页码减1
+              this.getBannerList()
+          }
+      },
+      nextPage() {
+          const totalPages = Math.ceil(this.total / this.pageSize);
+          if (this.currentPage < totalPages) {
+              this.currentPage++; // 下一页，页码加1
+              this.getBannerList()
+
+          }
+      },
+      getImgSrc(imgContent) {
+          return IMG_INTERFACE + imgContent;
+      },
+      clearImage() {
+          this.imageUrl = ''; // 清空图片路径
+          this.resourceform.localPicture = ''
+      },
+      // handleSelectData(val) {
+      //     this.H5Item = val
+      //     this.resourceform.jumpUrl = val[0].outLink || val[0].localLink
+      //     this.resourceform.jumpUrlName = val[0].tmplName || val[0].searchName
+      // },
+      // handleSelectDataID(val, sel) {
+      //     this.H5DataID = val
+      //     this.resourceform.jumpUrlType = sel
+      // },
+      cancelsubmit() {
+          this.$router.replace({
+              name: 'resourceList',
+              query: {
+                  resourceNicheId: this.resourceNicheId,
+                  resourceNicheType: this.resourceNicheType,
+                  __beforeClose: true
+              }
+          });
+      },
+      submitForm(button) {
+          if (!this.handleChange()) {
+              this.$message.info('没有检测到任何修改');
+              return;
+          }
+          let resourceformvalid = false
+          let basicformvalid = false
+          // 校验第一个表单
+          this.$refs['basicform'].validate((valid) => {
+              if (valid) {
+                  basicformvalid = true;
+              } else {
+                  this.$message.error('请检查基础表单的信息');
+                  return false;
+              }
+          });
+          // 校验第二个表单
+          this.$refs['resourceform'].validate((valid) => {
+              if (valid) {
+                  resourceformvalid = true;
+              } else {
+                  this.$message.error('请检查资源表单的信息');
+                  return false;
+              }
+          });
+          if(this.resourceform.custListType === '1' && ( this.groupList.name === '' || this.groupType === '')){
+              this.$message.error('请选择特定客群');
+              return 
+          }
+          // 确保所有表单都有效
+          if (basicformvalid && resourceformvalid && button === 'save') {
+              this.handleSave();
+          } else if (basicformvalid && resourceformvalid && button === 'saveapproval') {
+              this.handleSaveAndSubmit();
+          }
+      },
+      async handleSave() {
+          this.isLoading = true;
+          if (this.pkId) {
+              const params = {
+                  pkId: this.pkId,
+                  resourceNicheId: this.resourceNicheId,
+                  title: this.basicform.title,
+                  priority: this.basicform.priority,
+                  localPicture: this.imageUrl,
+                  jumpUrlSourceId: this.H5DataID,
+                  jumpUrl: this.resourceform.jumpUrl,
+                  jumpUrlType: this.resourceform.jumpUrlType,
+                  jumpUrlName: this.resourceform.jumpUrlName,
+                  libraryId: this.groupList.libId,
+                  custListType: this.resourceform.custListType,
+                  custList: this.groupList.pkId,
+                  custListRelation:JSON.stringify(this.resourceform.custListRelation),
+                  startTime: dayjs(this.basicform.startTime).format('YYYY-MM-DD HH:mm:ss'),
+                  endTime: dayjs(this.basicform.endTime).format('YYYY-MM-DD HH:mm:ss'),
+                  dsc: this.basicform.dsc,
+                  eventRelation:this.resourceform.eventRelation,
+                  eventCode:this.resourceform.eventCode
+              }
+              // console.log(params,'params')
+              try {
+                  const { errorMsg, errorCode } = await editResource(params)
+                  if (errorCode === '000000') {
+                      this.$message.success(errorMsg);
+                      this.$router.replace({
+                          name: 'resourceList',
+                          query: {
+                              resourceNicheId: this.resourceNicheId,
+                              resourceNicheType: this.resourceNicheType,
+                              __beforeClose: true
+                          }
+                      });
+                  } else {
+                      this.$message.error(errorMsg || '保存失败')
+                  }
+              } catch (error) {
+                  console.log(error)
+              } finally {
+                  this.isLoading = false;
+              }
+          } else {
+              const params = {
+                  pkId: "",
+                  resourceNicheId: this.resourceNicheId,
+                  title: this.basicform.title,
+                  priority: this.basicform.priority,
+                  localPicture: this.imageUrl,
+                  jumpUrlSourceId: this.H5DataID,
+                  jumpUrl: this.resourceform.jumpUrl,
+                  jumpUrlType: this.resourceform.jumpUrlType,
+                  jumpUrlName: this.resourceform.jumpUrlName,
+                  libraryId: this.groupList.libId,
+                  custListType: this.resourceform.custListType,
+                  custList: this.groupList.pkId,
+                  custListRelation:JSON.stringify(this.resourceform.custListRelation),
+                  startTime: dayjs(this.basicform.startTime).format('YYYY-MM-DD HH:mm:ss'),
+                  endTime: dayjs(this.basicform.endTime).format('YYYY-MM-DD HH:mm:ss'),
+                  dsc: this.basicform.dsc,
+                  eventRelation:this.resourceform.eventRelation,
+                  eventCode:this.resourceform.eventCode
+              }
+              try {
+                  const { errorMsg, errorCode } = await searchResourceNew(params)
+                  if (errorCode === '000000') {
+                      this.$message.success(errorMsg);
+                      this.$router.replace({
+                          name: 'resourceList',
+                          query: {
+                              resourceNicheId: this.resourceNicheId,
+                              resourceNicheType: this.resourceNicheType,
+                              __beforeClose: true
+                          }
+                      });
+                  } else {
+                      this.$message.error(errorMsg || '保存失败')
+                  }
+              } catch (error) {
+                  console.log(error)
+              } finally {
+                  this.isLoading = false;
+              }
+          }
+      },
+      async handleSaveAndSubmit() {
+          this.isLoading = true;
+          if (this.pkId) {
+              const params = {
+                  pkId: this.pkId,
+                  resourceNicheId: this.resourceNicheId,
+                  title: this.basicform.title,
+                  priority: this.basicform.priority,
+                  localPicture: this.imageUrl,
+                  jumpUrlSourceId: this.H5DataID,
+                  jumpUrl: this.resourceform.jumpUrl,
+                  jumpUrlType: this.resourceform.jumpUrlType,
+                  jumpUrlName: this.resourceform.jumpUrlName,
+                  libraryId: this.groupList.libId,
+                  custListType: this.resourceform.custListType,
+                  custList: this.groupList.pkId,
+                  custListRelation:JSON.stringify(this.resourceform.custListRelation),
+                  startTime: dayjs(this.basicform.startTime).format('YYYY-MM-DD HH:mm:ss'),
+                  endTime: dayjs(this.basicform.endTime).format('YYYY-MM-DD HH:mm:ss'),
+                  dsc: this.basicform.dsc,
+                  eventRelation:this.resourceform.eventRelation,
+                  eventCode:this.resourceform.eventCode
+              }
+              try {
+                  const { errorMsg, errorCode, data } = await editResource(params)
+                  if (errorCode === '000000') {
+                      const approvalResult = await approvalResource(data.pkId)
+                      const { errorCode: approvalCode, errorMsg: approvalMsg } = approvalResult;
+                      if (approvalCode === '000000') {
+                          this.$router.replace({
+                              name: 'resourceList',
+                              query: {
+                                  resourceNicheId: this.resourceNicheId,
+                                  resourceNicheType: this.resourceNicheType,
+                                  __beforeClose: true
+                              }
+                          });
+                          this.restForm()
+                          this.$message.success(approvalMsg);
+                      } else {
+                          this.$message.error(approvalMsg || '保存失败')
+                      }
+                  } else {
+                      this.$message.error(errorMsg || '保存失败')
+                  }
+              } catch (error) {
+                  console.log(error)
+              } finally {
+                  this.isLoading = false;
+              }
+          } else {
+              const params = {
+                  pkId: "",
+                  resourceNicheId: this.resourceNicheId,
+                  title: this.basicform.title,
+                  priority: this.basicform.priority,
+                  localPicture: this.imageUrl,
+                  jumpUrlSourceId: this.H5DataID,
+                  jumpUrl: this.resourceform.jumpUrl,
+                  jumpUrlName: this.resourceform.jumpUrlName,
+                  jumpUrlType: this.resourceform.jumpUrlType,
+                  libraryId: this.groupList.libId,
+                  custListType: this.resourceform.custListType,
+                  custList: this.groupList.pkId,
+                  custListRelation:JSON.stringify(this.resourceform.custListRelation),
+                  startTime: dayjs(this.basicform.startTime).format('YYYY-MM-DD HH:mm:ss'),
+                  endTime: dayjs(this.basicform.endTime).format('YYYY-MM-DD HH:mm:ss'),
+                  dsc: this.basicform.dsc,
+                  eventRelation:this.resourceform.eventRelation,
+                  eventCode:this.resourceform.eventCode
+              }
+              try {
+                  const { errorMsg, errorCode, data } = await searchResourceNew(params)
+                  if (errorCode === '000000') {
+                      const approvalResult = await approvalResource(data.pkId)
+                      const { errorCode: approvalCode, errorMsg: approvalMsg } = approvalResult;
+                      if (approvalCode === '000000') {
+                          this.$router.replace({
+                              name: 'resourceList',
+                              query: {
+                                  resourceNicheId: this.resourceNicheId,
+                                  resourceNicheType: this.resourceNicheType,
+                                  __beforeClose: true
+                              }
+                          });
+                          this.restForm()
+                          this.$message.success(approvalMsg);
+                      } else {
+                          this.$message.error(approvalMsg || '保存失败')
+                      }
+                  } else {
+                      this.$message.error(errorMsg || '保存失败')
+                  }
+              } catch (error) {
+                  console.log(error)
+              } finally {
+                  this.isLoading = false;
+              }
+          }
+      },
+      handleRadioChange(value) {
+          this.resourceform.custListType = value;
+          this.selectSpecialGroup()
+      },
+      selectSpecialGroup() {
+          if (this.resourceform.custListType === '0') {
+              this.groupVisible = false;
+              this.selectCustomer = false
+              this.resourceform.eventRelation = '';
+              this.resourceform.eventCode = '';
+              this.groupType = ''
+              this.groupList.name = ''
+              this.resourceform.custListRelation = {}
+          } else if (this.resourceform.custListType === '1') {
+              this.groupVisible = true;
+              this.resourceform.eventRelation = '';
+              this.resourceform.eventCode = '';
+          } else if (this.resourceform.custListType === '2') {
+              this.groupVisible = false;
+              this.selectCustomer = false
+              this.groupType = ''
+              this.groupList.name = ''
+              this.resourceform.custListRelation = {}
+              this.getBaseEventData()
+          }
+      },
+      submit(type, params) {
+          const map = {
+              groupStatic: '静态客群',
+              groupDynamic: '动态客群',
+              groupAssembly: '组合客群',
+              commonTable: '流转客群',
+              groupEvent: '事件客群'
+          }
+          this.groupType = map[type]
+          this.resourceform.custListRelation = this.resourceform.custListRelation || {
+                  groupList: {
+                      name:''
+                  },
+                  groupType: ''
+                  };
+          this.resourceform.custListRelation.groupType = this.groupType;
+          this.groupList = params
+          this.resourceform.custListRelation.groupList = this.resourceform.custListRelation.groupList || {};
+          this.resourceform.custListRelation.groupList.name = this.groupList.name;
+      },
+      restForm() {
+          this.basicform = {
+              title: '',
+              priority: '',
+              startTime: null,
+              endTime: null,
+              dsc: '',
+          };
+          this.resourceform = {
+              localPicture: "",
+              adPictureFile: "",
+              jumpUrlSourceId: "",
+              jumpUrlFile: "",
+              jumpUrlType: 0,
+              libraryId: "",
+              custListType: null,
+              custListRelation: {
+                  groupList:{},
+                  groupType:'',
+              },
+              custList: "",
+              jumpUrl: '',
+              jumpUrlName: '',
+              eventCode:'',
+              eventRelation:'',
+          };
+          this.adPictureFile = null;
+          this.groupList = {
+               name:''
+          };
+          this.imageUrl = ''
+      },
+      cancel(visible) {
+          this.groupVisible = visible
+          // this.resourceform.custListType = null;
+      },
+      groupListVisible(visible) {
+          this.selectCustomer = true
+          this.groupVisible = visible
+      },
+  }
+}
+
+</script>
+<style scoped>
+.form-all {
+  padding: 32px 24px;
+  position: relative;
+  height: 87vh;
+  overflow: auto;
+}
+
+.form-part {
+  height: 100%;
+  overflow-y: auto;
+}
+
+.title-text {
+  font-size: 14px;
+  line-height: 40px;
+  border-left: 3px solid #1664FF;
+  padding-left: 10px;
+}
+
+.form-content {
+  padding: 20px 10px;
+}
+
+.resource-item {
+  padding: 20px 10px;
+}
+
+.jump {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+}
+
+.jumpButton {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 80%;
+  height: 100%;
+  opacity: 0;
+  z-index: 2;
+  background-color: transparent;
+}
+
+.jumpUrlShow {
+  width: 80%;
+  padding-right: 30px;
+  cursor: pointer;
+  border-radius: 3px;
+  border: 1px solid #DCDFE6;
+  height: 30px;
+  background-color: transparent;
+}
+
+.shelfLog {
+  width: 70%;
+  height: 100px;
+  background-color: #f5f7fa;
+  border: 1px solid #dcdfe6;
+  border-radius: 3px;
+  min-height: 30px;
+  overflow-y: auto;
+  padding-left: 10px;
+}
+
+.shelfLogEmpty {
+  width: 70%;
+  height: 34px;
+  background-color: #f5f7fa;
+  border: 1px solid #dcdfe6;
+  border-radius: 3px;
+  min-height: 30px;
+  overflow-y: auto;
+}
+
+.avatar-uploader .el-upload:hover {
+  border-color: #409EFF;
+}
+
+.avatar-uploader .mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 178px;
+  height: 178px;
+  display: block;  
+  background: rgba(0, 0, 0, 0.5);  
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  display: none;
+  color: #fff;
+  font-size: 14px;
+}
+.avatar:hover .mask, .avatar-uploader:hover .mask {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.el-upload-icon {
+  display: flex;
+  margin-right: 10px;
+}
+
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 173px;
+  height: 80x;
+  line-height: 156px;
+  text-align: center;
+  /* border:1px solid #DCDFE6; */
+  /* border-radius: 3px; */
+}
+
+.avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+
+.notify-upload {
+  color: #DCDFE6;
+  margin-left: 90px;
+}
+
+.bottom-button {
+  height: 2.2rem;
+  display: flex;
+  justify-content: center;
+  position: absolute;
+  bottom: 10px;
+  padding-top: 7px;
+  border-top: 1px solid #ebedf0;
+  background-color: #fff;
+  left: 0;
+  right: 0;
+}
+
+.el-dialog {
+  width: 54%;
+  height: auto;
+  position: relative;
+}
+.tree-container {
+max-height: 300px;
+min-height: 300px;
+ /* 设置你希望的最大高度 */
+overflow-y: auto;
+}
+.pagination {
+  left: 0;
+  margin-bottom: 10px;
+}
+
+.popbutton {
+  margin-left: 10px;
+}
+
+.picture {
+  display: flex;
+  flex-direction: column;
+}
+
+.upload-container {
+  position: relative;
+  display: inline-block;
+}
+
+.upload-button {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+  /* 让按钮透明 */
+  z-index: 10;
+  /* 确保按钮在最上层 */
+  cursor: pointer;
+}
+
+.avatar-uploader {
+  width: 178px;
+  height: 178px;
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+
+.close-icon {
+  position: absolute;
+  top: 5px;
+  /* 距离顶部的距离 */
+  right: 5px;
+  /* 距离右侧的距离 */
+  font-size: 18px;
+  color: #fff;
+  /* 图标颜色 */
+  background-color: rgba(0, 0, 0, 0.5);
+  /* 半透明背景 */
+  border-radius: 50%;
+  /* 圆形样式 */
+  width: 20px;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  cursor: pointer;
+  z-index: 20;
+  /* 确保图标在最上层 */
+}
+
+/deep/ .el-table--enable-row-hover .el-table__body tr:hover>td {
+  background-color: transparent !important;
+}
+
+/deep/ .el-table .el-table__body .el-table__row.selected-row,
+/deep/ .el-table .el-table__body .el-table__row.selected-row:hover {
+  background-color: #f5f7fa !important;
+  /* 浅灰色背景 */
+}
+/deep/ .el-popover__content {
+padding: 0;
+max-height: none !important;
+}
+.hahaha{
+  height: 30px;
+}
+</style>