first

src/views/index/toDoList.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="wrap" >
+    <ul id="dataList" class="dataList">
+      <li class="item" v-for="(item,i) in 4" :key="i">
+        <div class="left">
+          <div class="repairName"><span class="name">维修申请</span><span class="carCode">苏AB6768</span></div>
+          <div class="addressName">苏州老张汽车修理厂</div>
+          <div class="time">2023-05-12 12:30:30 张三</div>
+        </div>
+        <div class="right">
+          <button class="nopass" @click="noPass">不通过</button>
+          <button class="pass" @click="pass">通过</button>
+        </div>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+import {getToDoList} from "@/api/order"
+export default {
+  name: "toDoList",
+  data(){
+    return{
+
+    }
+  },
+  mounted() {
+    this.getList()
+  },
+  methods:{
+    async getList(){
+      let result=await getToDoList()
+      console.log("result",result)
+    },
+    noPass(){
+      console.log("不通过")
+    },
+    pass(){
+      console.log("通过")
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import "@/styles/mixin.scss";
+.wrap {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding: 13px 13px 0 13px;
+  background-color: #F4F5F7;
+}
+
+.dataList {
+  padding: 0;
+}
+
+.item {
+  list-style: none;
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 10px;
+  width: 100%;
+  background: #FFFFFF;
+  box-shadow: 0px 2px 10px 0px rgba(216, 216, 216, 0.5);
+  border-radius: 6px;
+  padding: 10px 13px;
+  box-sizing: border-box;
+}
+
+.repairName {
+  font-weight: 500;
+}
+
+.name {
+  font-size: 14px;
+  margin-right: 22px;
+}
+
+.carCode {
+  font-size: 12px;
+}
+
+.addressName {
+  margin-top: 8px;
+  margin-bottom: 5px;
+}
+
+.addressName,
+.time {
+  font-size: 12px;
+}
+
+button {
+  padding: 2px 8px;
+  @include fontWeightSize(500,12px);
+  border-radius: 3px;
+}
+
+.nopass {
+  background: white;
+  border: 1px solid #DDDDDD !important;
+  margin-right: 15px;
+}
+
+.pass {
+  border: none;
+  border: 1px solid #2A5094 !important;
+  background: #2A5094;
+  color: white;
+}
+
+
+</style>