11.27

vue/gold-system/src/views/managerecharge/rate.vue

@@ -1,22 +1,182 @@
 <script setup>
+  import { ref } from 'vue'
+  import { ElMessageBox } from 'element-plus'
+  const regeAdd = ref(false)
 
+  // 添加方法
+  const add = () => {
+    ElMessageBox.confirm('确认添加？').then(() => {
+      regeAdd.value = false
+    }).catch(() => {
+      regeAdd.value = false
+    })
+  }
+
+  // 假数据
+  const tableData = [
+  {
+    currency: '币',
+    exchangeRate: '111',
+    createTime:'2016-05-03',
+    updateTime:'2016-05-03',
+    updateName:'帅哥'
+  
+  },
+  {
+    currency: '币',
+    exchangeRate: '111',
+    createTime:'2016-05-03',
+    updateTime:'2016-05-03',
+    updateName:'帅哥'
+  },
+  {
+    currency: '币',
+    exchangeRate: '111',
+    createTime:'2016-05-03',
+    updateTime:'2016-05-03',
+    updateName:'帅哥'
+  },
+  {
+    currency: '币',
+    exchangeRate: '111',
+    createTime:'2016-05-03',
+    updateTime:'2016-05-03',
+    updateName:'帅哥'
+  },
+]
 </script>
 
 <template>
     <div class="common-layout">
         <el-container>
           <el-header >
-            <div>
-                <div>添加事件</div>
-            <el-button type="primary" @click="handleAdd">添加</el-button>
+            <el-card style="max-width: 100%">
+              <!-- 这是时间 -->
+            <div class="demo-range">
+              时间：
+              <el-time-picker
+                v-model="value1"
+                is-range
+                range-separator="To"
+                start-placeholder="Start time"
+                end-placeholder="End time"
+              />
+              <!-- 按钮 -->
+              <el-button class="button-item" type="primary" style="float:right" @click="handleSearch">查询</el-button>
+              <el-button class="button-item"  style="float:right" @click="handledelete">重置</el-button>
+              
+              
             </div>
+          </el-card>
             
           </el-header>
-          <el-main>Main</el-main>
+          <el-main>
+            <el-card class="box-card" style="max-width: 100%">
+              <!-- 添加 -->
+            <div class="add-item">
+              <el-button type="primary" @click=" regeAdd = true">新增</el-button>
+            </div>
+            <!-- 表格 -->
+            <div>
+              <el-table :data="tableData" style="width: 100%" >
+                <el-table-column prop="currency" label="货币名称" :span="4" />
+                <el-table-column prop="exchangeRate" label="汇率" :span="4"/>
+                <el-table-column prop="createTime" label="添加时间" :span="4"/>
+                <el-table-column prop="updateTime" label="更新时间" :span="4"/>
+                <el-table-column prop="updateName" label="更新人" :span="4"/>
+                <el-table-column label="操作" :span="4">
+                  <el-button type="text" @click="handleEdit(index)">编辑</el-button>
+                  <el-button type="text" @click="handleDelete(index)">删除</el-button>
+                </el-table-column>
+              </el-table>
+            </div>
+            <!-- 分页 -->
+             <div class="pagination" >
+              <el-pagination background layout="prev, pager, next" :total="1000" />
+             </div>
+            </el-card>
+            
+
+          </el-main>
         </el-container>
       </div>
+
+      <!-- 这是添加弹窗 -->
+      <el-dialog
+      v-model="regeAdd"
+      title="新增汇率"
+      width="500"
+    >
+      <template #footer>
+        <el-form
+        ref="ruleFormRef"
+        style="max-width: 600px"
+        :model="ruleForm"
+        :rules="rules"
+        label-width="auto"
+        class="demo-ruleForm"
+        :size="formSize"
+        status-icon
+      >
+        <el-form-item label="货币名称:">
+          <el-select v-model="value" placeholder="请选择" style="width: 240px">
+            <el-option
+              
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="汇率:">
+          <el-input  style="width: 120px;"/><p class="unit">:1</p>
+          <p>(提示：当前规则每 5 元人民币可兑换 1 新币)</p>
+        </el-form-item>
+        <el-form-item label="提交人:">
+          <el-input  style="width: 240px;"/>
+        </el-form-item>
+        <el-form-item>
+          <el-button  type="primary" @click="add">添加</el-button>
+          <el-button @click="regeAdd = false">取消</el-button>
+        </el-form-item>
+      </el-form>
+      </template>
+    </el-dialog>
 </template>
 
 <style scoped>
 
+p{
+  margin: 0px
+}
+
+.el-form-item {
+  margin-left: 70px;
+
+}
+
+.ad{
+  margin-left: 10px;
+}
+
+.pagination {
+  margin-top: 20px;
+  margin-left: 33%;
+}
+.box-card {
+  margin-top: 20px;
+}
+.button-item {
+  margin-left: 10px;
+}
+.add-item {
+  margin-bottom: 10px;
+}
+el-table-column{
+  text-align: center;
+}
+p{
+  color: rgb(150, 150, 150);
+}
+.unit{
+  margin-left: 10px;
+}
+
 </style>

vue/gold-system/src/views/recharge/addRecharge.vue

@@ -1,13 +1,15 @@
-<script setup>
+<script>
     
 </script>
 
 <template>
-    <div>
-        <h1>Add Recharge</h1>
-    </div>
+    <el-form :model="form" label-width="auto" style="max-width: 600px">
+        <el-form-item label="Activity name">
+          <el-input v-model="form.name" />
+        </el-form-item>
+    </el-form>
 </template>
 
-<style scoped>
+<style>
 
 </style>