|
@@ -22,7 +22,7 @@
|
|
|
</el-select>
|
|
|
</div>
|
|
|
|
|
|
- <el-button
|
|
|
+ <!-- <el-button
|
|
|
class="search-button timeTab"
|
|
|
@click="num = 0"
|
|
|
:type="num == 0 ? 'primary' : ''"
|
|
@@ -36,17 +36,25 @@
|
|
|
style="margin-left: 0 !important; margin-right: 20px"
|
|
|
>
|
|
|
按月
|
|
|
- </el-button>
|
|
|
+ </el-button> -->
|
|
|
|
|
|
- <div class="filter-item">
|
|
|
- 日期:
|
|
|
- <el-date-picker
|
|
|
- v-model="value4"
|
|
|
- type="dates"
|
|
|
- placeholder="请选择"
|
|
|
- style="width: 200px"
|
|
|
- ></el-date-picker>
|
|
|
- </div>
|
|
|
+ <el-radio-group
|
|
|
+ v-model="listTabPosition"
|
|
|
+ @change="listTabsChange(listTabPosition)"
|
|
|
+ style="display: inline-block; position: relative; top: -3px"
|
|
|
+ >
|
|
|
+ <el-radio-button label="dayValue">按日</el-radio-button>
|
|
|
+ <el-radio-button label="monthValue">按月</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dateTime"
|
|
|
+ :type="dateType"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 150px;margin-left:20px"
|
|
|
+ :clearable="false"
|
|
|
+ :editable="false"
|
|
|
+ ></el-date-picker>
|
|
|
|
|
|
<el-button type="primary" class="search-button">搜索</el-button>
|
|
|
</div>
|
|
@@ -168,9 +176,9 @@
|
|
|
|
|
|
<script>
|
|
|
import { useStore } from 'vuex'
|
|
|
-import { defineComponent, onMounted } from 'vue'
|
|
|
-import radarChart from "./scoreReportComponent/radarChart.vue";
|
|
|
-import pieChart from "./scoreReportComponent/pieChart.vue";
|
|
|
+import { defineComponent, onMounted, ref } from 'vue'
|
|
|
+import radarChart from './scoreReportComponent/radarChart.vue'
|
|
|
+import pieChart from './scoreReportComponent/pieChart.vue'
|
|
|
|
|
|
export default defineComponent({
|
|
|
name: 'ScoreReport',
|
|
@@ -180,43 +188,47 @@ export default defineComponent({
|
|
|
},
|
|
|
setup() {
|
|
|
const store = useStore()
|
|
|
+ const listTabPosition = ref('dayValue')
|
|
|
+ const dateType = ref('date')
|
|
|
+ const dateTime = ref(new Date())
|
|
|
|
|
|
function headCellStyle({ row, column, rowIndex, columnIndex }) {
|
|
|
- row,column
|
|
|
+ row, column
|
|
|
if (columnIndex !== 0 && columnIndex !== 1 && rowIndex === 0) {
|
|
|
- return `text-align:center`;
|
|
|
+ return `text-align:center`
|
|
|
} else {
|
|
|
- return "";
|
|
|
+ return ''
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- onMounted(() => {
|
|
|
-
|
|
|
-
|
|
|
- })
|
|
|
+ const listTabsChange = (value) => {
|
|
|
+ value == 'dayValue'
|
|
|
+ ? (dateType.value = 'date')
|
|
|
+ : (dateType.value = 'month')
|
|
|
+ }
|
|
|
+
|
|
|
+ onMounted(() => {})
|
|
|
return {
|
|
|
store,
|
|
|
headCellStyle,
|
|
|
+ listTabPosition,
|
|
|
num: 0,
|
|
|
- value4: "",
|
|
|
+ value4: '',
|
|
|
+ listTabsChange,
|
|
|
+ dateType,
|
|
|
+ dateTime,
|
|
|
tableData: [
|
|
|
{
|
|
|
- huilv: "/HZ183",
|
|
|
- gongLv: "合格",
|
|
|
- dianLiu: "不合格",
|
|
|
- dianYa: "合格",
|
|
|
- name: "合格",
|
|
|
- city: "不合格",
|
|
|
+ huilv: '/HZ183',
|
|
|
+ gongLv: '合格',
|
|
|
+ dianLiu: '不合格',
|
|
|
+ dianYa: '合格',
|
|
|
+ name: '合格',
|
|
|
+ city: '不合格',
|
|
|
},
|
|
|
],
|
|
|
- };
|
|
|
-
|
|
|
-
|
|
|
+ }
|
|
|
},
|
|
|
})
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|