Merge pull request #93 from SonicCloudOrg/dev

v1.3.0-beta2

package.json

@@ -1,6 +1,7 @@
 {
     "name": "sonic-client-web",
-    "version": "1.0.0",
+    "version": "1.3.0-beta2",
+    "author": "SonicCloudOrg",
     "scripts": {
         "dev": "vite",
         "build": "vite build",

src/components/ElementUpdate.vue

@@ -99,19 +99,19 @@ onMounted(() => {
           v-model="element.eleType"
           placeholder="请选择定位类型"
       >
-        <el-option-group label="常用定位方式">
+        <el-option-group label="移动端常用定位方式">
           <el-option label="id（resource-id）" value="id"></el-option>
           <el-option value="xpath"></el-option>
-          <el-option value="name"></el-option>
-          <el-option value="cssSelector"></el-option>
+          <el-option label="nsPredicate（仅支持iOS10或以上）" value="nsPredicate"></el-option>
           <el-option value="accessibilityId"></el-option>
         </el-option-group>
         <el-option-group label="特殊定位方式">
           <el-option label="坐标" value="point"></el-option>
           <el-option label="图片" value="image"></el-option>
         </el-option-group>
-        <el-option-group label="普通定位方式">
-          <el-option value="nsPredicate"></el-option>
+        <el-option-group label="WebView常用定位方式">
+          <el-option value="name"></el-option>
+          <el-option value="cssSelector"></el-option>
           <el-option value="linkText"></el-option>
           <el-option value="className"></el-option>
           <el-option value="tagName"></el-option>

src/components/StepUpdate.vue

@@ -86,10 +86,6 @@ const monkey = ref({
       name: "isOpenNetworkListener",
       value: true,
     },
-    {
-      name: "isOpenImageListener",
-      value: true,
-    },
   ],
 })
 const monkeyOptions = {
@@ -137,10 +133,6 @@ const monkeyOptions = {
     label: "网络状态监听器",
     des: "检测设备是否处于飞行模式和WIFI网络",
   },
-  isOpenImageListener: {
-    label: "图像静止监听器",
-    des: "检测当前图像是否长期处于静止",
-  },
 }
 const stepForm = ref(null)
 const changeType = (e) => {
@@ -153,8 +145,7 @@ const isShowInputNumber = (data) => {
   if (data === "isOpenH5Listener"
       || data === "isOpenPackageListener"
       || data === "isOpenActivityListener"
-      || data === "isOpenNetworkListener"
-      || data === "isOpenImageListener") {
+      || data === "isOpenNetworkListener") {
     return false;
   } else {
     return true;
@@ -417,7 +408,8 @@ const androidOptions = ref([
       },
       {
         value: "readText",
-        label: "图像文字识别",
+        label: "图像文字识别（暂时关闭）",
+        disabled: true
       },
     ],
   },
@@ -614,7 +606,8 @@ const iOSOptions = ref([
       },
       {
         value: "readText",
-        label: "图像文字识别",
+        label: "图像文字识别（暂时关闭）",
+        disabled: true
       },
     ],
   },

src/components/TestCaseList.vue

@@ -17,7 +17,9 @@ const pageSize = ref(15);
 const name = ref("")
 const caseId = ref(0)
 const dialogVisible = ref(false)
+const tableLoading = ref(false)
 const getTestCaseList = (pageNum, pSize) => {
+  tableLoading.value = true
   axios.get("/controller/testCases/list", {
     params: {
       projectId: props.projectId,
@@ -28,6 +30,7 @@ const getTestCaseList = (pageNum, pSize) => {
     }
   }).then(resp => {
     pageData.value = resp.data
+    tableLoading.value = false
   })
 }
 const deleteCase = (id) => {
@@ -58,6 +61,11 @@ watch(dialogVisible, (newValue, oldValue) => {
     caseId.value = 0
   }
 })
+watch(
+  () => props.projectId, 
+  () => {
+  getTestCaseList();
+})
 const editCase = async (id) => {
   caseId.value = id
   await open()
@@ -78,7 +86,7 @@ defineExpose({open})
                       :case-id="caseId"
                       :platform="platform" @flush="flush"/>
   </el-dialog>
-  <el-table :data="pageData['content']" border :row-style="isReadOnly?{cursor:'pointer'}:{}"
+  <el-table v-loading="tableLoading" :data="pageData['content']" border :row-style="isReadOnly?{cursor:'pointer'}:{}"
             @row-click="selectCase" style="margin-top: 15px">
     <el-table-column width="80" label="用例Id" prop="id" align="center" show-overflow-tooltip/>
     <el-table-column min-width="280" prop="name" header-align="center" show-overflow-tooltip>

src/components/TestSuiteUpdate.vue

@@ -3,6 +3,8 @@ import {onMounted, ref} from "vue";
 import axios from "../http/axios";
 import {ElMessage} from "element-plus";
 import {useRoute} from "vue-router";
+import RenderDeviceName from "./RenderDeviceName.vue";
+import RenderStatus from "./RenderStatus.vue";
 
 const route = useRoute()
 const props = defineProps({
@@ -43,12 +45,14 @@ const testSuite = ref({
   testCases: []
 })
 const deviceData = ref([])
+const deviceDataBack = ref([])
 const getDevice = (platform) => {
   axios
       .get("/controller/devices/listAll", {params: {platform}})
       .then((resp) => {
         if (resp['code'] === 2000) {
           deviceData.value = resp.data;
+          deviceDataBack.value = resp.data;
         }
       });
 }
@@ -91,6 +95,20 @@ const getSuiteInfo = (id) => {
     }
   })
 }
+const filterDevice = (name) => {
+  if (name) {
+    deviceData.value = deviceDataBack.value.filter((item) => {
+      if ((item['model'] && item['model'].indexOf(name) !== -1)
+          || (item['nickName'] && item['nickName'].indexOf(name) !== -1)
+          || (item['chiName'] && item['chiName'].indexOf(name) !== -1)
+          || (item['udId'] && item['udId'].indexOf(name) !== -1)) {
+        return true
+      }
+    })
+  } else {
+    deviceData.value = deviceDataBack.value
+  }
+}
 onMounted(() => {
   if (props.suiteId !== 0) {
     getSuiteInfo(props.suiteId)
@@ -173,13 +191,16 @@ onMounted(() => {
         <el-option :value="2" label="设备覆盖"></el-option>
       </el-select>
     </el-form-item>
-    <el-form-item prop="device" label="关联设备" v-if="testSuite.platform!==null">
-      <el-select value-key="id"
-                 clearable
-                 filterable
-                 style="width: 100%"
-                 v-model="testSuite.devices"
-                 multiple placeholder="请选择测试设备">
+    <el-form-item prop="device" label="关联设备">
+      <el-select
+          :disabled="testSuite.platform===null"
+          value-key="id"
+          clearable
+          filterable
+          :filter-method="filterDevice"
+          style="width: 100%"
+          v-model="testSuite.devices"
+          multiple placeholder="请选择测试设备，可输入型号、备注、中文名称、序列号筛选">
         <el-option
             v-for="item in deviceData"
             :key="item.id"
@@ -199,26 +220,31 @@ onMounted(() => {
               ></el-image>
             </template>
           </el-image>
-          <span style="float: left;margin-left: 10px">{{ item.model }}</span>
+          <span style="float: left;margin-left: 10px"><RenderDeviceName :device="item"/></span>
+          <span style="display: flex;float: right;
+    align-items: center;">
           <span style="
             margin-left: 15px;
-          float: right;
           color: #909399;
           font-size: 13px;
            font-style: italic;
         "
           >{{ item['udId'] }}</span
           >
+            <RenderStatus style="margin-left: 15px;margin-right: -10px" :status="item['status']" :user="item['user']"/>
+            </span>
         </el-option>
       </el-select>
     </el-form-item>
-    <el-form-item prop="testCases" label="关联用例" v-if="testSuite.platform!==null">
-      <el-select value-key="id"
-                 clearable
-                 filterable
-                 style="width: 100%"
-                 v-model="testSuite.testCases"
-                 multiple placeholder="请选择测试用例">
+    <el-form-item prop="testCases" label="关联用例">
+      <el-select
+          :disabled="testSuite.platform===null"
+          value-key="id"
+          clearable
+          filterable
+          style="width: 100%"
+          v-model="testSuite.testCases"
+          multiple placeholder="请选择测试用例，可输入用例名称筛选">
         <el-option
             v-for="item in testCaseData"
             :key="item.id"

src/views/Devices.vue

@@ -31,6 +31,7 @@ const checkAllStatus = ref(false);
 const isAllStatus = ref(false);
 const pageData = ref({});
 const pageSize = ref(12);
+const currDevicesPage = ref(1)
 const checkMan = ref([]);
 const name = ref("");
 const androidSystem = ref([]);
@@ -61,7 +62,10 @@ const manufacturer = ref([
   "asus",
   "GIONEE",
   "Lenovo",
-  "HTC"
+  "HTC",
+  "BBK",
+  "nubia",
+  "realme"
 ]);
 const statusList = ref([
   {
@@ -290,6 +294,13 @@ const findAll = (pageNum, pSize) => {
     clearInterval(timer.value);
   });
 };
+// 根据接口返回页数处理
+const handleFindAll = (pageNum, pageSize) => {
+  if (pageNum) {
+    currDevicesPage.value = pageNum
+  }
+  findAll(currDevicesPage.value, pageSize)
+}
 const findAgentById = (id) => {
   let result = '未知'
   for (let i in agentList.value) {
@@ -414,7 +425,7 @@ const findTemper = () => {
 const refresh = () => {
   refreshTime.value++;
   getFilterOption();
-  findAll();
+  handleFindAll();
   getAllAgents();
   findTemper();
   if (refreshTime.value === 2) {
@@ -843,7 +854,7 @@ onUnmounted(() => {
             :total="pageData['totalElements']"
             :current-page="pageData['number']+1"
             :page-size="pageData['size']"
-            @change="findAll"
+            @change="handleFindAll"
         ></pageable>
       </el-card>
     </el-tab-pane>

src/views/Elements.vue

@@ -9,16 +9,25 @@ import {ElMessage} from "element-plus";
 const route = useRoute()
 const dialogElement = ref(false)
 const elementId = ref(0)
+const deleteId = ref(0)
 const pageData = ref({});
 const pageSize = ref(15);
 const name = ref("")
 const types = ref([])
+const stepList = ref([])
+const checkDialog = ref(false)
 
 watch(dialogElement, (newValue, oldValue) => {
   if (!newValue) {
     elementId.value = 0
   }
 })
+watch(checkDialog, (newValue, oldValue) => {
+  if (!newValue) {
+    deleteId.value = 0;
+    stepList.value = [];
+  }
+})
 const editElement = async (id) => {
   elementId.value = id
   await open()
@@ -44,6 +53,23 @@ const getElementList = (pageNum, pSize) => {
   })
 }
 const deleteEle = (id) => {
+  axios.get("/controller/elements/deleteCheck", {
+    params: {
+      id
+    }
+  }).then(resp => {
+    if (resp['code'] === 2000) {
+      stepList.value = resp['data'];
+      if (stepList.value.length === 0) {
+        deleteReal(id);
+      } else {
+        deleteId.value = id;
+        checkDialog.value = true;
+      }
+    }
+  })
+}
+const deleteReal = (id) => {
   axios.delete("/controller/elements", {
     params: {
       id
@@ -53,6 +79,7 @@ const deleteEle = (id) => {
       ElMessage.success({
         message: resp['message'],
       });
+      checkDialog.value = false;
       getElementList();
     }
   })
@@ -70,6 +97,28 @@ onMounted(() => {
     <element-update v-if="dialogElement" :project-id="route.params.projectId"
                     :element-id="elementId" @flush="flush"/>
   </el-dialog>
+  <el-dialog v-model="checkDialog" title="步骤信息" width="600px">
+    <el-alert title="警告！" type="warning" show-icon :closable="false" description="该控件已存在于以下步骤中，
+    删除该控件将连同以下步骤一并删除！请前往对应步骤修改控件或确认对应步骤已废弃！"/>
+    <el-table :data="stepList" border style="margin-top: 20px">
+      <el-table-column prop="id" width="90" label="步骤Id" align="center"></el-table-column>
+      <el-table-column label="所属用例Id" width="90" align="center">
+        <template #default="scope">
+          <el-tag size="mini" v-if="scope.row.caseId=== 0">无</el-tag>
+          <span v-else>{{ scope.row.caseId }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="所属用例名称" header-align="center">
+        <template #default="scope">
+          <span v-if="scope.row.caseId=== 0">无所属用例</span>
+          <span v-else>{{ scope.row.testCasesDTO.name }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div style="text-align: center;margin-top: 20px">
+      <el-button size="small" type="danger" @click="deleteReal(deleteId)">确认删除</el-button>
+    </div>
+  </el-dialog>
   <el-button size="mini" round type="primary" @click="open">添加控件元素</el-button>
   <el-table
       @filter-change="filter"

src/views/Index.vue

@@ -1,13 +1,5 @@
 <script setup>
-import {onMounted} from "vue";
-import {useStore} from "vuex";
-import {useRoute} from "vue-router";
 import Header from "../components/Header.vue"
-
-const store = useStore();
-const route = useRoute();
-onMounted(() => {
-})
 </script>
 
 <template>