Browse Source

修复UI走查

wzl 2 years ago
parent
commit
06cd025425

+ 7 - 0
src/assets/style/element-variables.scss

@@ -98,4 +98,11 @@ li.el-menu-item,
 }
 .el-tooltip__popper {
   margin-top: 0 !important;
+}
+// 下拉框placeholder颜色,文字颜色
+.el-input__inner {
+  color: #232A40;
+  &::placeholder {
+    color: #808185;
+  }
 }

+ 4 - 4
src/views/Dashboard.vue

@@ -333,7 +333,7 @@ export default {
     <h2>Data Filter</h2>
     <div class="block p-24px mt-12px mb-32px">
       <div class="flex">
-        <select v-model="dataFilterProductSelect" name="dataFilterProduct" class="min-w-180px mr-16px">
+        <select v-model="dataFilterProductSelect" name="dataFilterProduct" class="min-w-180px mr-16px" :class="{ '!text-[#232A40]': dataFilterProductSelect !== '' }">
           <option value="">Product</option>
           <option v-for="item in productList" :key="item.id" :value="item.code">{{ item.name }}</option>
         </select>
@@ -373,7 +373,7 @@ export default {
     <div class="block p-24px mt-12px mb-32px">
       <div class="flex">
         <div class="flex justify-between">
-          <select v-model="chartSelectValue" name="date" class="min-w-180px mr-16px">
+          <select v-model="chartSelectValue" name="date" class="min-w-180px mr-16px" :class="{ '!text-[#232A40]': chartSelectValue !== '' }">
             <option value="" selected disabled>Statistics Time</option>
             <option value="1">Today</option>
             <option value="2">Last 7 Days</option>
@@ -414,11 +414,11 @@ export default {
 
     <div class="block p-24px mt-24px mb-32px">
       <div class="flex">
-        <select v-model="teamSelect" name="team" class="min-w-140px mr-16px">
+        <select v-model="teamSelect" name="team" class="min-w-140px mr-16px" :class="{ '!text-[#232A40]': teamSelect !== '' }">
           <option value="">Team</option>
           <option v-for="item in teamList" :key="item.value" :value="item.value">{{ item.label }}</option>
         </select>
-        <select v-model="teamFilterProductSelect" name="teamFilterProduct" class="min-w-180px mr-16px">
+        <select v-model="teamFilterProductSelect" name="teamFilterProduct" class="min-w-180px mr-16px" :class="{ '!text-[#232A40]': teamFilterProductSelect !== '' }">
           <option value="">Product</option>
           <option v-for="item in productList" :key="item.id" :value="item.code">{{ item.name }}</option>
         </select>

+ 14 - 3
src/views/Device.vue

@@ -207,7 +207,7 @@ export default {
         </span>
       </div>
       <div class="flex bg-[#fff] pt-32px px-24px rounded-t-8px w-full">
-        <select v-model="productId" class="w-140px">
+        <select v-model="productId" class="w-140px" :class="{ '!text-[#232A40]': productId !== '' }">
           <option value="" selected>Product</option>
           <option
             v-for="item in productList"
@@ -217,14 +217,14 @@ export default {
             {{ item.name }}
           </option>
         </select>
-        <select v-model="status" class="w-140px ml-16px">
+        <select v-model="status" class="w-140px ml-16px" :class="{ '!text-[#232A40]': status !== '' }">
           <option value="" selected>Staus</option>
           <option value="0" selected>Unactivated</option>
           <option value="1" selected>Ativated</option>
           <option value="5" selected>Canceled</option>
           <option value="4" selected>Expired</option>
         </select>
-        <select v-model="teamId" class="w-140px ml-16px">
+        <select v-model="teamId" class="w-140px ml-16px" :class="{ '!text-[#232A40]': teamId !== '' }">
           <option value="" selected >Team</option>
           <option v-for="item in teamList" :key="item.value" :value="item.id">
             {{ item.name }}
@@ -360,6 +360,17 @@ export default {
 .el-table::v-deep thead {
   color: #000 !important;
 }
+::v-deep .input-with-select .el-input__inner {
+  padding: 0 20px 0 8px;
+  border-color: #d9d9d9;
+  font-size: 14px;
+  color: #232A40;
+}
+::v-deep .input-with-select .el-input__inner::placeholder {
+  font-size: 14px;
+  font-weight: 400;
+  color: #808185;
+}
 </style>
 
 <style lang="scss">

+ 14 - 3
src/views/LicenseManage.vue

@@ -237,7 +237,7 @@ const searchInfo = (val) => {
         </div>
       </div>
       <div class="flex bg-[#fff] pt-32px px-24px rounded-t-8px w-full">
-        <select class="w-140px" v-model="productId">
+        <select class="w-140px" v-model="productId" :class="{ '!text-[#232A40]': productId !== '' }">
           <option value="" selected>Product</option>
           <option
             v-for="item in productList"
@@ -247,14 +247,14 @@ const searchInfo = (val) => {
             {{ item.name }}
           </option>
         </select>
-        <select class="w-140px ml-16px" v-model="status">
+        <select class="w-140px ml-16px" v-model="status" :class="{ '!text-[#232A40]': status !== '' }">
           <option value="" selected>status</option>
           <option value="2">Assigned</option>
           <option value="3">Activated</option>
           <option value="4">Canceled</option>
           <option value="1">Unassigned</option>
         </select>
-        <select class="w-140px ml-16px" v-model="teamId">
+        <select class="w-140px ml-16px" v-model="teamId" :class="{ '!text-[#232A40]': teamId !== '' }">
           <option value="" selected>Team</option>
           <option v-for="item in teamList" :key="item.value" :value="item.id">
             {{ item.name }}
@@ -375,6 +375,17 @@ const searchInfo = (val) => {
 .el-table::v-deep thead {
   color: #000 !important;
 }
+::v-deep .input-with-select .el-input__inner {
+  padding: 0 20px 0 8px;
+  border-color: #d9d9d9;
+  font-size: 14px;
+  color: #232A40;
+}
+::v-deep .input-with-select .el-input__inner::placeholder {
+  font-size: 14px;
+  font-weight: 400;
+  color: #808185;
+}
 </style>
 
 <style lang="scss">

+ 13 - 2
src/views/ManageAdmin.vue

@@ -146,13 +146,13 @@ const handleCurrentChange = (val) => {
         </div>
       </div>
       <div class="flex bg-[#fff] pt-32px px-24px rounded-t-8px w-full">
-        <select class="w-140px" v-model="teamId">
+        <select class="w-140px" v-model="teamId" :class="{ '!text-[#232A40]': teamId !== '' }">
           <option value="" selected>Team</option>
           <option v-for="item in teamList" :key="item.value" :value="item.id">
             {{ item.name }}
           </option>
         </select>
-        <select class="w-140px ml-16px" v-model="role">
+        <select class="w-140px ml-16px" v-model="role" :class="{ '!text-[#232A40]': role !== '' }">
           <option value="" selected>Role</option>
           <option value="1">Super admin</option>
           <option value="2">Team admin</option>
@@ -287,6 +287,17 @@ const handleCurrentChange = (val) => {
 .el-table::v-deep thead {
   color: #000 !important;
 }
+::v-deep .input-with-select .el-input__inner {
+  padding: 0 20px 0 8px;
+  border-color: #d9d9d9;
+  font-size: 14px;
+  color: #232A40;
+}
+::v-deep .input-with-select .el-input__inner::placeholder {
+  font-size: 14px;
+  font-weight: 400;
+  color: #808185;
+}
 </style>
 
 <style lang="scss">

+ 2 - 2
src/views/ProductManagement.vue

@@ -51,7 +51,7 @@ const pagingQuery = () => {
 }
 //获取已购买产品
 const getproductList = (val) => {
-  get('/pdf-tech/product/listWithAdmin').then(
+  get('/pdf-tech/product/listWithAll').then(
     (res) => {
       productList.value = res.data.result
     }
@@ -91,7 +91,7 @@ const handleCurrentChange = (value) => {
         <span>Content</span>
       </div>
       <div class="flex bg-[#fff] pt-32px px-24px rounded-t-8px w-full">
-        <select v-model="productId" class="w-140px">
+        <select v-model="productId" class="w-140px" :class="{ '!text-[#232A40]': productId !== '' }">
           <option value="" selected>Product</option>
           <option
             v-for="item in productList"

+ 1 - 1
src/views/Settings.vue

@@ -228,7 +228,7 @@ export default {
           </div>
         </el-form-item>
         <el-form-item label="Area">
-          <select v-model="ruleForm.area" class="flex w-600px !h-40px">
+          <select v-model="ruleForm.area" class="flex w-600px !h-40px" :class="{ '!text-[#232A40]': ruleForm.area !== '' }">
             <option value="" selected>Choose your Area</option>
             <option
               v-for="(item, index) in country"

+ 5 - 3
src/views/TeamManagement/ManageMember.vue

@@ -203,19 +203,19 @@ onMounted(() => {
     </div>
     <div class="block px-24px pt-32px pb-40px">
       <div class="flex">
-        <select name="team" class="min-w-50px mr-16px" v-model="teamId">
+        <select name="team" class="min-w-50px mr-16px" v-model="teamId" :class="{ '!text-[#232A40]': teamId !== '' }">
           <option value="" selected>Team</option>
           <option v-for="item in teamList" :value="item.id" :key="item.id">
             {{ item.name }}
           </option>
         </select>
-        <select name="status" class="min-w-100px mr-16px" v-model="status">
+        <select name="status" class="min-w-100px mr-16px" v-model="status" :class="{ '!text-[#232A40]': status !== '' }">
           <option value="" selected>Status</option>
           <option value="2">Invited</option>
           <option value="1">Joined</option>
           <option value="0">Deleted</option>
         </select>
-        <select name="Assigned Product" class="min-w-100px mr-16px" v-model="product">
+        <select name="Assigned Product" class="min-w-100px mr-16px" v-model="product" :class="{ '!text-[#232A40]': product !== '' }">
           <option value="" selected>Assigned Product</option>
           <option
             v-for="item in productList"
@@ -384,6 +384,8 @@ onMounted(() => {
 ::v-deep .input-with-select .el-input__inner {
   padding: 0 20px 0 8px;
   border-color: #d9d9d9;
+  font-size: 14px;
+  color: #232A40;
 }
 ::v-deep .input-with-select .el-input__inner::placeholder {
   font-size: 14px;

+ 7 - 2
src/views/TeamManagement/ManageTeam.vue

@@ -184,7 +184,7 @@ onMounted(() => {
     </div>
     <div class="block px-24px pt-32px pb-40px">
       <div class="flex">
-        <select v-model="teamId" name="team" class="min-w-140px mr-16px">
+        <select v-model="teamId" name="team" class="min-w-140px mr-16px" :class="{ '!text-[#232A40]': teamId !== '' }">
           <option value="">Team</option>
           <option v-for="item in teamList" :value="item.id" :key="item.id">
             {{ item.name }}
@@ -243,7 +243,10 @@ onMounted(() => {
           min-width="18%"
         >
         </el-table-column>
-        <el-table-column prop="teamAdmin" label="Team Admin" min-width="14.5%">
+        <el-table-column label="Team Admin" min-width="14.5%">
+          <template slot-scope="scope">
+            <span v-for="(item, index) in scope.row.teamAdmin" :key="index">{{ item }}<br /></span>
+          </template>
         </el-table-column>
         <el-table-column
           prop="createTime"
@@ -335,6 +338,8 @@ onMounted(() => {
 ::v-deep .input-with-select .el-input__inner {
   padding: 0 20px 0 8px;
   border-color: #d9d9d9;
+  font-size: 14px;
+  color: #232A40;
 }
 ::v-deep .input-with-select .el-input__inner::placeholder {
   font-size: 14px;

+ 43 - 6
src/views/TeamManagement/ManageTeamOperate.vue

@@ -97,12 +97,16 @@ export default {
     },
     // 创建团队
     createTeam () {
-      this.formData.productList.forEach(item =>{
+      let data = JSON.parse(JSON.stringify(this.formData))
+      data.productList.forEach(item =>{
         if (item.licenseNumber === null || item.licenseNumber === '') {
           item.licenseNumber = 0
         }
       })
-      postWithHeader('/pdf-tech/vppTeam/createTeam', JSON.stringify(this.formData)).then((res) => {
+      data.teamAdminId = data.teamAdminId.filter((item) => {
+        return item !== 'All'
+      })
+      postWithHeader('/pdf-tech/vppTeam/createTeam', JSON.stringify(data)).then((res) => {
         //限制点击
         setTimeout(() => {
           this.click = true
@@ -121,12 +125,16 @@ export default {
     },
     // 编辑团队
     editTeam () {
-      this.formData.productList.forEach(item =>{
+      let data = JSON.parse(JSON.stringify(this.formData))
+      data.productList.forEach(item =>{
         if (item.licenseNumber === null || item.licenseNumber === '') {
           item.licenseNumber = 0
         }
       })
-      putWithHeader('/pdf-tech/vppTeam/editTeam', JSON.stringify(this.formData)).then((res) => {
+      data.teamAdminId = data.teamAdminId.filter((item) => {
+        return item !== 'All'
+      })
+      putWithHeader('/pdf-tech/vppTeam/editTeam', JSON.stringify(data)).then((res) => {
         //限制点击
         setTimeout(() => {
           this.click = true
@@ -170,6 +178,32 @@ export default {
           })
         }
       })
+    },
+    // Team Admin下拉框全选功能
+    selectAllAdmin() {
+      if (this.formData.teamAdminId.length < this.adminOptions.length) {
+        this.formData.teamAdminId = []
+        this.adminOptions.map((item) => {
+          this.formData.teamAdminId.push(item.value)
+        })
+        this.formData.teamAdminId.unshift('All')
+      } else {
+        this.formData.teamAdminId = []
+      }
+    },
+    changeSelectAdmin(val) {
+      if (!val.includes('All') && val.length === this.adminOptions.length) {
+        this.formData.teamAdminId.unshift('All')
+      } else if (val.includes('All') && (val.length - 1) < this.adminOptions.length) {
+        this.formData.teamAdminId = this.formData.teamAdminId.filter((item) => {
+          return item !== 'All'
+        })
+      }
+    },
+    removeTag(val) {
+      if (val === 'All') {
+        this.formData.teamAdminId = []
+      }
     }
   },
   // 切换路由时清除本地存储数据
@@ -198,9 +232,12 @@ export default {
         <el-form-item label="Team Admin">
           <el-select
             v-model="formData.teamAdminId"
+            @change='changeSelectAdmin'
+            @remove-tag='removeTag'
             multiple
             placeholder=""
             class="w-600px">
+            <el-option value="All" @click.native='selectAllAdmin'>All</el-option>
             <el-option
               v-for="item in adminOptions"
               :key="item.value"
@@ -216,13 +253,13 @@ export default {
               <span>Product</span>
               <span class="text-[#FF5054]">*</span>
             </template>
-            <select v-model="item.productId" placeholder="Project" class="w-[100%] !h-40px !pl-12px focus-visible:(outline-none)">
+            <select v-model="item.productId" placeholder="Project" class="w-[100%] !h-40px !pl-12px focus-visible:(outline-none)" :class="{ '!text-[#232A40]': item.productId !== '' }">
               <option value="">Project</option>
               <option v-for="item in projectOptions" :key="item.value" :value="item.value">{{ item.label }}</option>
             </select>
           </el-form-item>
           <el-form-item label="Team License Number" class="!mb-22px">
-            <el-input v-model="item.licenseNumber"></el-input>
+            <el-input v-model.number="item.licenseNumber"></el-input>
           </el-form-item>
         </div>
         <div class="w-600px h-48px border-1 border-dashed border-[#1460F3] rounded-8px flex justify-center items-center">