Ver código fonte

选择评卷员表格的样式优化

刘洋 1 ano atrás
pai
commit
d8ed511248
1 arquivos alterados com 13 adições e 4 exclusões
  1. 13 4
      src/components/common/ChooseMarkers.vue

+ 13 - 4
src/components/common/ChooseMarkers.vue

@@ -1,9 +1,9 @@
 <template>
 <template>
   <div class="choose-markers">
   <div class="choose-markers">
-    <el-button type="primary" :disabled="!subjectCode || !mainNumber" @click="modalVisible = true"
+    <el-button type="primary" :disabled="!subjectCode || !mainNumber" @click="openDialog"
       >选择评卷员{{ confirmResult?.length ? `(已选${confirmResult.length}人)` : '' }}</el-button
       >选择评卷员{{ confirmResult?.length ? `(已选${confirmResult.length}人)` : '' }}</el-button
     >
     >
-    <base-dialog v-model="modalVisible" title="选择评卷员" :width="600" class="marker-dialog">
+    <base-dialog v-model="modalVisible" title="选择评卷员" :width="450" class="marker-dialog">
       <div class="m-b-base">
       <div class="m-b-base">
         <el-input
         <el-input
           v-model.trim="filterText"
           v-model.trim="filterText"
@@ -25,8 +25,12 @@
         @checkbox-change="selectChangeEvent"
         @checkbox-change="selectChangeEvent"
         @checkbox-all="selectChangeEvent"
         @checkbox-all="selectChangeEvent"
       >
       >
-        <vxe-column type="checkbox" title="ID" width="280" tree-node></vxe-column>
-        <vxe-column field="showName" title="姓名"></vxe-column>
+        <vxe-column type="checkbox" title="" width="80" tree-node></vxe-column>
+        <vxe-column field="showName" title="姓名">
+          <template #default="{ row }">
+            <span :style="{ fontWeight: !row.parentId ? 'bold' : 'normal' }">{{ row.showName }}</span>
+          </template>
+        </vxe-column>
       </vxe-table>
       </vxe-table>
       <template #footer>
       <template #footer>
         <div class="flex justify-end">
         <div class="flex justify-end">
@@ -140,6 +144,11 @@ const confirm = () => {
   emits('user-list', [...confirmResult.value])
   emits('user-list', [...confirmResult.value])
   modalVisible.value = false
   modalVisible.value = false
 }
 }
+
+const openDialog = () => {
+  tableKey.value = Date.now() + ''
+  modalVisible.value = true
+}
 </script>
 </script>
 
 
 <style lang="scss" scoped>
 <style lang="scss" scoped>