Merge branch 'master' of 121.36.198.49:zy_duanju/zhiyu_duanju_distribution_manage_front into psl_stat

src/components/admin/table/search.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full min-h-0 pt-5 pl-5 pr-5 bg-white rounded-lg dark:bg-regal-dark">
-    <el-form :inline="true">
+    <el-form :inline="true" @submit.native.prevent>
       <slot name="body" />
       <el-form-item>
         <el-button type="primary" @click="search()">

src/i18n/languages/en.ts

@@ -1,6 +1,6 @@
 const en = {
   system: {
-    name: '追书云短剧平台',
+    name: '追剧云平台',
     chinese: 'Chinese',
     english: 'English',
     confirm: 'Confirm',

src/i18n/languages/zh.ts

@@ -1,6 +1,6 @@
 const zh = {
   system: {
-    name: '追书云短剧平台',
+    name: '追剧云平台',
     chinese: '中文',
     english: '英文',
     confirm: '确定',

src/styles/index.scss

@@ -10,3 +10,6 @@
 
 // theme
 @import 'theme/index';
+
+
+@import 'iphone.css';

src/styles/iphone.css

@@ -0,0 +1,239 @@
+.md-iphone-5 .md-body {
+  width: 100%;
+  height: 100%;
+  border-radius: 3.75em;
+  border-style: solid;
+  border-width: 0.375em;
+  position: relative;
+}
+
+.md-iphone-5 .md-screen {
+  position: relative;
+  margin: 0 auto;
+  background-color: #161616;
+  border-radius: 0.25em;
+  overflow: hidden;
+  box-shadow: 0 0 0px 3px #161616;
+}
+.md-iphone-5 .md-screen img {
+  width: 100%;
+}
+
+.md-iphone-5 .md-home-button {
+  display: block;
+  width: 3.625em;
+  height: 3.625em;
+  margin: 0 auto;
+  position: relative;
+  border-radius: 100%;
+  border: none;
+  cursor: default;
+  font-size: 100%;
+}
+.md-iphone-5 .md-home-button:after {
+  content: "";
+  display: block;
+  width: 1.125em;
+  height: 1.125em;
+  margin: 0 auto;
+  position: relative;
+  border-style: solid;
+  border-width: 0.125em;
+  border-radius: 0.25em;
+}
+
+.md-iphone-5 .md-front-camera {
+  width: 0.875em;
+  height: 0.875em;
+  margin: 0 auto;
+  position: relative;
+  border-radius: 100%;
+}
+.md-iphone-5 .md-front-camera:after {
+  content: "";
+  display: block;
+  width: 0.375em;
+  height: 0.375em;
+  position: relative;
+  top: 0.25em;
+  left: 0.25em;
+  background-color: #8c8091;
+  border-radius: 100%;
+}
+
+.md-iphone-5.md-glare:before {
+  content: "";
+  display: block;
+  width: 50%;
+  height: 83%;
+  position: absolute;
+  top: 0.625em;
+  right: 0.625em;
+  border-radius: 0 3.125em 0 0;
+  z-index: 1;
+}
+
+.md-iphone-5:after {
+  content: "";
+  display: block;
+  width: 3.3125em;
+  height: 0.1875em;
+  position: absolute;
+  right: 3.625em;
+  top: -0.1875em;
+  border-radius: 0.125em 0.125em 0 0;
+}
+
+.md-iphone-5 {
+  width: 22.8125em;
+  height: 49em;
+  position: relative;
+}
+.md-iphone-5 .md-front-camera {
+  top: 1.25em;
+}
+.md-iphone-5 .md-top-speaker {
+  width: 3.75em;
+  height: 0.875em;
+  margin: 0 auto;
+  position: relative;
+  top: 2.25em;
+  border-radius: 3.125em;
+}
+.md-iphone-5 .md-top-speaker:after {
+  content: "";
+  display: block;
+  width: 3.25em;
+  height: 0.375em;
+  margin: 0 auto;
+  position: relative;
+  top: 0.25em;
+  background-color: #4b414a;
+  border-radius: 3.125em;
+}
+.md-iphone-5 .md-screen {
+  width: 20em;
+  height: 35.5em;
+  top: 3.75em;
+}
+.md-iphone-5 .md-home-button {
+  bottom: -5.9375em;
+}
+.md-iphone-5 .md-buttons {
+  width: 0.1875em;
+  height: 1.875em;
+  position: absolute;
+  left: -0.5em;
+  top: 5.9375em;
+  border-radius: 0.125em 0 0 0.125em;
+}
+.md-iphone-5 .md-buttons:after, .md-iphone-5 .md-buttons:before {
+  content: "";
+  display: block;
+  position: absolute;
+  width: 0.1875em;
+  height: 1.5625em;
+  border-radius: 0.125em 0 0 0.125em;
+}
+.md-iphone-5 .md-buttons:after {
+  top: 3.125em;
+}
+.md-iphone-5 .md-buttons:before {
+  top: 6.25em;
+}
+.md-iphone-5.md-glare:before {
+  background: -webkit-linear-gradient(16deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
+  background: -moz-linear-gradient(16deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
+  background: -o-linear-gradient(16deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
+  background: linear-gradient(74deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
+}
+.md-iphone-5.md-landscape {
+  -webkit-transform: rotateZ(90deg);
+  -moz-transform: rotateZ(90deg);
+  -ms-transform: rotateZ(90deg);
+  -o-transform: rotateZ(90deg);
+  transform: rotateZ(90deg);
+}
+.md-iphone-5.md-landscape.md-glare:before {
+  -webkit-transform: rotateY(180deg);
+  -moz-transform: rotateY(180deg);
+  -ms-transform: rotateY(180deg);
+  -o-transform: rotateY(180deg);
+  transform: rotateY(180deg);
+  left: 0.625em;
+  top: 0.625em;
+}
+
+.md-white-device .md-front-camera, .md-white-device .md-top-speaker, .md-white-device .md-home-button {
+  background: -webkit-linear-gradient(#d0d0c5, #eeeeea);
+  background: -moz-linear-gradient(#d0d0c5, #eeeeea);
+  background: -o-linear-gradient(#d0d0c5, #eeeeea);
+  background: linear-gradient(#d0d0c5, #eeeeea);
+}
+
+.md-black-device .md-front-camera, .md-black-device .md-top-speaker, .md-black-device .md-home-button {
+  background: -webkit-linear-gradient(#141917, #202623);
+  background: -moz-linear-gradient(#141917, #202623);
+  background: -o-linear-gradient(#141917, #202623);
+  background: linear-gradient(#141917, #202623);
+}
+
+.md-white-device.md-landscape .md-home-button, .md-white-device.md-landscape .md-front-camera, .md-white-device.md-landscape .md-top-speaker {
+  background: -webkit-linear-gradient(left, #d0d0c5, #eeeeea);
+  background: -moz-linear-gradient(left, #d0d0c5, #eeeeea);
+  background: -o-linear-gradient(left, #d0d0c5, #eeeeea);
+  background: linear-gradient(to right, #d0d0c5, #eeeeea);
+}
+
+.md-black-device.md-landscape .md-home-button, .md-black-device.md-landscape .md-front-camera, .md-black-device.md-landscape .md-top-speaker {
+  background: -webkit-linear-gradient(left, #141917, #202623);
+  background: -moz-linear-gradient(left, #141917, #202623);
+  background: -o-linear-gradient(left, #141917, #202623);
+  background: linear-gradient(to right, #141917, #202623);
+}
+
+.md-white-device .md-body {
+  background-color: #ebebe4;
+  border-color: #f1f2eb;
+}
+.md-white-device .md-buttons {
+  background-color: #ebebe4;
+}
+.md-white-device .md-buttons:after, .md-white-device .md-buttons:before {
+  background-color: #ebebe4;
+}
+.md-white-device .md-front-camera:after {
+  background-color: #8c8091;
+}
+.md-white-device .md-top-speaker:after {
+  background-color: #4b414a;
+}
+.md-white-device .md-home-button:after {
+  border-color: #eff1e6;
+}
+.md-white-device:after {
+  background: #ebebe4;
+}
+
+.md-black-device .md-body {
+  background-color: #1b211e;
+  border-color: #282e2b;
+}
+.md-black-device .md-buttons {
+  background-color: #1b211e;
+}
+.md-black-device .md-buttons:after, .md-black-device .md-buttons:before {
+  background-color: #1b211e;
+}
+.md-black-device .md-front-camera:after {
+  background-color: #2c292f;
+}
+.md-black-device .md-top-speaker:after {
+  background-color: #191616;
+}
+.md-black-device .md-home-button:after {
+  border-color: #444a45;
+}
+.md-black-device:after {
+  background: #1b211e;
+}

src/views/appletManage/miniProgramList/form/create.vue

@@ -33,7 +33,7 @@
         </el-form-item>
         <el-form-item label="备注" prop="remark">
           <el-tooltip placement="top">
-            <template #content> 鼠标移到账号上面显示备注内容<br /> </template>
+            <template #content> 鼠标移到小程序名称上面显示备注内容<br /> </template>
             <el-input v-model="formData.remark" placeholder="请填写备注" type="textarea" />
           </el-tooltip>
         </el-form-item>

src/views/appletManage/miniProgramList/form/depotsTransfer.vue

@@ -8,75 +8,64 @@
         <el-form-item label="状态" prop="status">
           <el-switch v-model="form.status" disabled :active-value="1" :inactive-value="0" />
         </el-form-item>
-        <el-form-item label="分配至投手公司" prop="username">
-          <div>
-            <el-transfer v-model="form.depotsValue" :props="{
-              key: 'id',
-              label: 'username',
-            }" :titles="['未分配', '已分配']" filterable :left-default-checked="leftChecked"
-              :right-default-checked="rightChecked" @right-check-change="transferChange($event, 'right')"
-              @left-check-change="transferChange($event, 'left')" :filter-method="filterMethod" filter-placeholder="搜索"
-              :data="dataObj" />
-          </div>
+        <el-form-item label="分配至投放公司" prop="depotsValue" :rules="[{ required: true, message: '请选择' }]">
+          <el-select v-model="form.depotsValue" filterable clearable placeholder="请选择">
+            <el-option v-for="item in dataObj" :key="item.id" :label="item.username" :value="item.id" />
+          </el-select>
         </el-form-item>
       </div>
     </div>
     <div class="flex justify-end">
-      <el-button type="primary" size="default" @click="doSave">确定</el-button>
+      <el-button type="primary" size="default" @click="doSave(ruleForm)">确定</el-button>
     </div>
   </el-form>
 </template>
 
 <script lang="ts" setup>
 import { manageMiniprogramAllocationDetail, manageMiniprogramShow, manageMiniprogramAllocation } from '@/api/applet/index'
-
+import type { FormInstance, FormRules } from 'element-plus'
 const props = defineProps({
   primary: Object,
 });
+const ruleForm = ref<FormInstance>()
 const loading = ref(false)
 const rules = reactive({
   miniProgramIds: [{ required: true, message: '请选择小程序' }],
 });
 const form = ref({})
 const dataObj = ref([])
-const leftChecked = ref([])
-const rightChecked = ref([])
-const channels = ref([])
 const emit = defineEmits(['close']);
 const params = ref({})
-const transferChange = (e, type) => {
-  console.log(e, 'transferChangetransferChange');
-  let arr = JSON.parse(JSON.stringify(dataObj.value))
-  const checkArr = arr.filter(el => e.includes(el.id)).map(el => el.id)
-  channels.value = checkArr
-  params.value = { uids: channels.value.join(','), action: type == 'left' ? 'off' : 'on' }
-  console.log(params.value, channels.value, 'checkArrcheckArr');
-}
-const filterMethod = (query, item) => {
-  return item.username.includes(query)
-}
-const doSave = () => {
-  console.log(form.value.depotsValue, 'channels.value', toRaw(channels.value));
-  if (toRaw(channels.value).length <= 0) {
-    ElMessage.warning('请选择投手公司')
-  } else {
-    manageMiniprogramAllocation(props.primary.id, params.value).then(res => {
-      console.log(res);
-      ElMessage.success(res.message)
-      emit('close', false)
-    })
+const doSave = (formEl: FormInstance | undefined) => {
+  params.value = {
+    action: "on",
+    uids: form.value.depotsValue
   }
-}
+  if (!formEl) return;
+  formEl
+    .validate(valid => {
+      if (valid) {
+        manageMiniprogramAllocation(props.primary.id, params.value).then(res => {
+          console.log(res);
+          ElMessage.success(res.message)
+          emit('close', false)
+        })
+      } else {
+        loading.value = false;
+      }
+    })
+    .then(() => { });
 
 
+}
+
 onMounted(() => {
   manageMiniprogramAllocationDetail(props.primary.id).then(res => {
     console.log(res, 'manageMiniprogramAllocationDetail');
     dataObj.value = res.data.all
     let timer = setTimeout(() => {
       if (res.data.on?.length > 0) {
-        form.value.depotsValue = res.data.on.map(el => el.id)
-        rightChecked.value = res.data.on.map(el => el.id)
+        form.value.depotsValue = res.data.on.map(el => el.id)[0]
         clearTimeout(timer)
       }
     }, 10);
@@ -85,18 +74,11 @@ onMounted(() => {
     console.log(res, 'props.primary');
     form.value = res.data
   })
-
 })
 
 </script>
 
 <style lang="scss" scoped>
-::v-deep(.el-input__wrapper) {
-  display: flex;
-  width: 180px;
-  flex: none;
-}
-
 .wrapper {
   display: flex;
   align-items: center;

src/views/appletManage/miniProgramList/form/depotsTransferAgo.vue

@@ -0,0 +1,106 @@
+<template>
+  <el-form :model="form" label-width="130px" ref="ruleForm" :rules="rules" v-loading="loading" class="pr-4">
+    <div class="flex flex-row justify-between">
+      <div class="w-full">
+        <el-form-item label="小程序名称" prop="email">
+          <el-input v-model="form.name" disabled placeholder="请填写登录账号" />
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-switch v-model="form.status" disabled :active-value="1" :inactive-value="0" />
+        </el-form-item>
+        <el-form-item label="分配至优化师" prop="username">
+          <div>
+            <el-transfer v-model="form.depotsValue" :props="{
+              key: 'id',
+              label: 'username',
+            }" :titles="['未分配', '已分配']" filterable :left-default-checked="leftChecked"
+              :right-default-checked="rightChecked" @right-check-change="transferChange($event, 'right')"
+              @left-check-change="transferChange($event, 'left')" :filter-method="filterMethod" filter-placeholder="搜索"
+              :data="dataObj" />
+          </div>
+        </el-form-item>
+      </div>
+    </div>
+    <div class="flex justify-end">
+      <el-button type="primary" size="default" @click="doSave">确定</el-button>
+    </div>
+  </el-form>
+</template>
+
+<script lang="ts" setup>
+import { manageMiniprogramAllocationDetail, manageMiniprogramShow, manageMiniprogramAllocation } from '@/api/applet/index'
+
+const props = defineProps({
+  primary: Object,
+});
+const loading = ref(false)
+const rules = reactive({
+  miniProgramIds: [{ required: true, message: '请选择小程序' }],
+});
+const form = ref({})
+const dataObj = ref([])
+const leftChecked = ref([])
+const rightChecked = ref([])
+const channels = ref([])
+const emit = defineEmits(['close']);
+const params = ref({})
+const transferChange = (e, type) => {
+  console.log(e, 'transferChangetransferChange');
+  let arr = JSON.parse(JSON.stringify(dataObj.value))
+  const checkArr = arr.filter(el => e.includes(el.id)).map(el => el.id)
+  channels.value = checkArr
+  params.value = { uids: channels.value.join(','), action: type == 'left' ? 'off' : 'on' }
+  console.log(params.value, channels.value, 'checkArrcheckArr');
+}
+const filterMethod = (query, item) => {
+  return item.username.includes(query)
+}
+const doSave = () => {
+  console.log(form.value.depotsValue, 'channels.value', toRaw(channels.value));
+  if (toRaw(channels.value).length <= 0) {
+    ElMessage.warning('请选择投手公司')
+  } else {
+    manageMiniprogramAllocation(props.primary.id, params.value).then(res => {
+      console.log(res);
+      ElMessage.success(res.message)
+      emit('close', false)
+    })
+  }
+}
+
+
+onMounted(() => {
+  manageMiniprogramAllocationDetail(props.primary.id).then(res => {
+    console.log(res, 'manageMiniprogramAllocationDetail');
+    dataObj.value = res.data.all
+    let timer = setTimeout(() => {
+      if (res.data.on?.length > 0) {
+        form.value.depotsValue = res.data.on.map(el => el.id)
+        rightChecked.value = res.data.on.map(el => el.id)
+        clearTimeout(timer)
+      }
+    }, 10);
+  });
+  manageMiniprogramShow(props.primary.id).then(res => {
+    console.log(res, 'props.primary');
+    form.value = res.data
+  })
+
+})
+
+</script>
+
+<style lang="scss" scoped>
+::v-deep(.el-input__wrapper) {
+  display: flex;
+  width: 180px;
+  flex: none;
+}
+
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+}
+</style>

src/views/chargeManage/chargeTemplate/form/create.vue

@@ -1,220 +0,0 @@
-<template>
-  <el-card shadow="always" :body-style="{ padding: '20px' }">
-    <template #header>
-      <div class="card-header">
-        <span>{{ props.primary ? '编辑' : '添加' }}充值模板</span>
-      </div>
-    </template>
-    <el-form :model="dataForm" label-width="120px" ref="form" v-loading="loading" class="pr-6">
-      <el-form-item label="模板名称" prop="name"
-        :rules="[{ required: true, message: '模板名称必须填写' }, { max: 20, message: '至多输入20个字符', trigger: 'blur' }]">
-        <el-input :disabled="Boolean(props.primary)" class="item" v-model="dataForm.name" clearable />
-      </el-form-item>
-      <el-form-item label="充值档位" prop="options" :rules="[{ required: true, message: '请添加充值档位' }]">
-        <el-card class="w-full" shadow="never">
-          <div class="pt-5 pl-2">
-            <Add @click="openGears(null, null)" />
-          </div>
-          <el-table :data="tableData" class="w-full mt-3" v-loading="loading">
-            <el-table-column prop="price" label="价格">
-              <template #default="scope">
-                <span>{{ scope.row.price }}元</span>
-              </template>
-            </el-table-column>
-            <el-table-column prop="sequence_text" label="位置" />
-            <el-table-column prop="type_name" label="挡位类型" />
-            <el-table-column prop="charge_coin" label="充看币">
-              <template #default="scope">
-                <span v-if="!isShowKb(scope.row)">{{ Math.round(Number(scope.row.price) * 100) }}k币</span>
-                <span v-else>{{ scope.row.type_name }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column prop="given" label="充看送币">
-              <template #default="scope">
-                <span>{{ scope.row.given }}k币</span>
-              </template>
-            </el-table-column>
-            <el-table-column prop="default_text" label="默认项">
-              <template #default="scope">
-                <span>{{ scope.row.is_default ? '默认项' : '非默认项' }}</span>
-              </template>
-            </el-table-column>
-            <el-table-column label="操作" width="200">
-              <template #default="scope">
-                <el-button link type="primary" size="small" @click="openGears(scope.$index, scope.row)">编辑</el-button>
-                <el-button link type="danger" size="small" @click.prevent="deleteRow(scope.$index)">删除</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </el-card>
-      </el-form-item>
-      <el-form-item label="启用状态" prop="status" :rules="[{ required: true, message: '请设置启用状态' }]">
-        <el-switch v-model="dataForm.status" :active-value="1" :inactive-value="0" />
-      </el-form-item>
-      <div class="flex justify-start ml-9">
-        <el-button type="primary" size="default" @click="cancel">取消</el-button>
-        <el-button type="primary" @click="submitFormChange(form)">确认</el-button>
-      </div>
-    </el-form>
-    <Dialog v-model="visibleGears" :title="title" width="40%" destroy-on-close>
-      <createGears @close="gearsClose" @success="success" :data="tableData" :primary="gearsData" />
-    </Dialog>
-  </el-card>
-</template>
-
-<script lang="ts" setup>
-import { onMounted, ref } from 'vue';
-import {
-  channelPaytemplateShow,
-  channelPaytemplateStore,
-  channelPaytemplateUpdate,
-  channelPaytemplateOptionTypeList
-} from '@/api/charge/index'
-import { FormInstance } from 'element-plus';
-import createGears from './createGears.vue'
-const visibleGears = ref(false)
-const loading = ref(false)
-const gearsData = ref()
-const tableData = ref([])
-const form = ref()
-const emit = defineEmits(['close']);
-const dataForm = ref({ status: 1 })
-
-const title = computed(() =>
-  gearsData.value ?
-    '编辑充值档位' : '添加充值档位'
-)
-
-const optionTypeList = ref([]);
-const props = defineProps({
-  primary: String | Number | Object,
-  api: String,
-});
-const filtersObj = ['MONTH', 'QUARTER', 'YEAR']
-
-const isShowKb = (e) => {
-  return filtersObj.includes(e.type)
-}
-const gearsClose = () => {
-  visibleGears.value = false
-}
-const openGears = (index: number | null, row: object) => {
-  if (row) {
-    gearsData.value = row
-    gearsData.value.index = index
-    visibleGears.value = true
-  } else {
-    if (tableData.value.length >= 6) return ElMessageBox.alert('当前充值档位位置已满')
-    gearsData.value = null
-    visibleGears.value = true
-  }
-}
-const deleteRow = (index: number) => {
-  ElMessageBox.confirm(
-    '确定要删除此条充值档位吗?',
-    '提示',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    }
-  )
-    .then(() => {
-      tableData.value.splice(index, 1)
-    })
-    .catch(() => {
-
-    })
-}
-const success = (e) => {
-  console.log(e, 'successsuccesssuccess');
-  const data = {
-    ...e,
-    ...e.typeObj,
-    ...e.sequenceObj
-  };
-  if (e.index != undefined) {
-    tableData.value[e.index] = data
-  } else {
-    tableData.value.push(data)
-  }
-}
-const cancel = () => {
-  emit('close')
-}
-const submitFormChange = (formEl: FormInstance | undefined) => {
-  if (!formEl) return;
-  dataForm.value.options = tableData.value.map(el => {
-    return {
-      price: Number(el.price),
-      type: el.type,
-      given: Number(el.given),
-      sequence: el.sequence,
-      is_default: el.is_default
-    }
-  })
-  loading.value = true;
-  formEl
-    .validate(valid => {
-      if (valid) {
-        const params = {
-          name: dataForm.value.name,
-          status: dataForm.value.status,
-          options: JSON.stringify(dataForm.value.options),
-        }
-        console.log(params, 'paramsparams');
-        if (props.primary) {
-          channelPaytemplateUpdate(dataForm.value.id, params).then(res => {
-            loading.value = false;
-            ElMessage.success(res.message)
-            emit('close')
-          }).catch(e => {
-            loading.value = false;
-          })
-        } else {
-          channelPaytemplateStore(params).then(res => {
-            loading.value = false;
-            ElMessage.success(res.message)
-            emit('close')
-          }).catch(e => {
-            loading.value = false;
-          })
-        }
-      } else {
-        loading.value = false;
-      }
-    })
-    .then(() => { });
-}
-
-if (props.primary) {
-  console.log(props.primary, 'props.primary');
-  channelPaytemplateShow(props.primary).then(res => {
-    dataForm.value = res.data.template_info
-    console.log(res, 'channelPaytemplateShowchannelPaytemplateShow');
-    tableData.value = res.data.template_item_list
-  })
-}
-
-onMounted(() => {
-  channelPaytemplateOptionTypeList().then(res => {
-    console.log(res);
-    optionTypeList.value = res.data
-
-  })
-});
-</script>
-<style scoped lang="scss">
-.item {
-  width: 300px;
-}
-
-.type-wrapper {
-  width: 80%;
-  display: flex;
-
-  .btn {
-    margin: 0 6px;
-  }
-}
-</style>

src/views/chargeManage/chargeTemplate/index.vue

@@ -1,70 +1,32 @@
 <template>
-  <div v-if="!showCreate">
-    <Search :search="search" :reset="reset">
-      <template v-slot:body>
-        <el-form-item label="模板名称">
-          <el-input v-model="query.name" clearable />
-        </el-form-item>
-      </template>
-    </Search>
-    <div class="table-default">
-      <div class="pt-5 pl-2">
-        <Add @click="openForm(null)" v-action="'channel.payTemplate.store'" />
-      </div>
-      <el-table :data="tableData" class="mt-3" v-loading="loading">
-        <el-table-column prop="name" label="模板名称" />
-        <el-table-column label="状态" v-action="'channel.payTemplate.updateStatus'">
-          <template #default="scope">
-            <el-switch v-model="scope.row.status" @change="statusChange($event, scope.row)" :active-value="1"
-              :inactive-value="0" />
-          </template>
-        </el-table-column>
-        <el-table-column label="操作" width="200">
-          <template #default="scope">
-            <el-button link type="primary" size="small" @click="openForm(scope.row)"
-              v-action="'channel.payTemplate.update'">编辑</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <Paginate />
-    </div>
+  <div>
+    <el-card shadow="always" :body-style="{ padding: '20px' }">
+      <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handChange">
+        <el-tab-pane label="非首充模板" name="nofirstTemplate">
+          <nofirstTemplate v-if="activeName == 'nofirstTemplate'"></nofirstTemplate>
+        </el-tab-pane>
+        <el-tab-pane label="首充模板" name="firstTemplate">
+          <firstTemplate v-if="activeName == 'firstTemplate'"></firstTemplate>
+        </el-tab-pane>
+      </el-tabs>
+    </el-card>
   </div>
-  <Create v-else @close="cancel(search)" :primary="primary" :api="editapi" />
 </template>
 
 <script lang="ts" setup>
-import { computed, onMounted, ref } from 'vue';
-import Create from './form/create.vue';
-import { useGetList } from '@/hook/curd/useGetList';
-import { channelPaytemplateUpdateStatus } from '@/api/charge/index'
-
-const api = 'channel/paytemplate/list';
-let editapi = 'system/notices/notice/edit';
-let showCreate = ref(false)
-
-const { data, query, search, reset, loading } = useGetList(api, true);
-const tableData = computed(() => data.value?.data);
-const primary = ref({})
-
-const openForm = (data: any) => {
-  showCreate.value = true
-  if (data) {
-    primary.value = data.id
-  } else {
-    primary.value = data
-  }
-};
-const cancel = () => {
-  showCreate.value = false
-  search()
-};
-const statusChange = (e, row) => {
-  channelPaytemplateUpdateStatus(row.id, { status: e }).then(res => {
-    ElMessage.success(res.message)
-    search()
-  })
-};
+import { useRouter, useRoute } from 'vue-router'
+import type { TabsPaneContext } from 'element-plus'
+import nofirstTemplate from "./tabs/nofirstTemplate/index.vue"
+import firstTemplate from "./tabs/firstTemplate/index.vue"
+const router = useRouter()
+const route = useRoute()
+const handChange = (tab: TabsPaneContext, event: Event) => {
+  activeName.value = tab
+}
+const activeName = ref('nofirstTemplate')
 onMounted(() => {
-  search();
+  activeName.value = route.query.tab || 'nofirstTemplate'
 });
 </script>
+
+<style scoped lang="scss"></style>

src/views/chargeManage/chargeTemplate/tabs/firstTemplate/form/create.vue

@@ -0,0 +1,334 @@
+<template>
+  <el-card shadow="always" style="overflow: auto;" :body-style="{ padding: '10px' }">
+    <template #header>
+      <div class="card-header">
+        <span>{{ props.primary ? '编辑' : '添加' }}首充模板</span>
+      </div>
+    </template>
+    <el-form :model="dataForm" label-width="130px" ref="form" v-loading="loading" class="pr-6">
+      <el-form-item label="模板名称" prop="name"
+        :rules="[{ required: true, message: '模板名称必须填写' }, { max: 20, message: '至多输入20个字符', trigger: 'blur' }]">
+        <el-input class="item" v-model="dataForm.name" clearable />
+      </el-form-item>
+      <el-form-item label="充值档位" prop="options" :rules="[{ required: true, message: '请添加充值档位' }]">
+        <div class="flex justify-start w-full" shadow="never">
+          <div class="mr-6" style="min-width:400px;">
+            <div class="pt-5 pl-2">
+              <Add @click="openGears(null, null)" />
+            </div>
+            <el-table :data="tableData" class="w-full mt-3" v-loading="loading">
+              <el-table-column prop="price" label="价格">
+                <template #default="scope">
+                  <span>{{ scope.row.price }}元</span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="sequence_text" label="位置" />
+              <el-table-column prop="type_name" label="挡位类型" />
+              <el-table-column prop="default_text" label="默认项">
+                <template #default="scope">
+                  <span>{{ scope.row.is_default ? '默认项' : '非默认项' }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作" width="200">
+                <template #default="scope">
+                  <el-button link type="primary" size="small" @click="openGears(scope.$index, scope.row)">编辑</el-button>
+                  <el-button link type="danger" size="small" @click.prevent="deleteRow(scope.$index)">删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div class="device-wrap">
+            <div class="md-iphone-5 md-white-device">
+              <div class="md-body">
+                <div class="md-buttons"></div>
+                <div class="md-front-camera"></div>
+                <div class="md-top-speaker"></div>
+                <div class="md-screen">
+                  <img src="@/assets/pay-config-bg.jpg" alt="" />
+                  <div class="preview-list">
+                    <div class="pay-item" v-for="(row, i) in tableData" :key="i"
+                      :class="[row.is_default == 1 ? 'defalut' : '']">
+                      <p>{{ row.price }}元</p>
+                      <p v-show="row.given">多送{{ row.given }}看币</p>
+                      <div class="tipss">{{ gearsName[row.type] }}</div>
+                    </div>
+                  </div>
+                </div>
+                <button class="md-home-button"></button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </el-form-item>
+      <el-form-item label="是否为默认模板" prop="status" :rules="[{ required: true, message: '请设置是否为默认模板' }]"
+        v-if="!rolesIdentify.includes('optimizer')">
+        <el-switch v-model="dataForm.status" :active-value="1" :inactive-value="0" />
+      </el-form-item>
+      <div class="flex justify-start ml-9">
+        <el-button type="primary" size="default" @click="cancel">取消</el-button>
+        <el-button type="primary" @click="submitFormChange(form)">确认</el-button>
+      </div>
+    </el-form>
+    <Dialog v-model="visibleGears" :title="title" width="40%" destroy-on-close>
+      <createGears @close="gearsClose" @success="success" :data="tableData" :primary="gearsData" />
+    </Dialog>
+  </el-card>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, ref } from 'vue';
+import {
+  channelPaytemplateShow,
+  channelPaytemplateStore,
+  channelPaytemplateUpdate,
+  channelPaytemplateOptionTypeList
+} from '@/api/charge/index'
+import { FormInstance } from 'element-plus';
+import createGears from './createGears.vue';
+const rolesIdentify = inject('rolesIdentify')
+const visibleGears = ref(false)
+const dialogVisible = ref(true)
+const loading = ref(false)
+const gearsData = ref()
+const tableData = ref([])
+const form = ref()
+const emit = defineEmits(['close']);
+const dataForm = ref({ status: 1, type: 1 })
+
+const title = computed(() =>
+  gearsData.value ?
+    '编辑充值档位' : '添加充值档位'
+)
+
+const gearsName = ref({
+  FIRST_COIN: "首充",
+  COIN: "普通充值",
+  YEAR: "包年",
+  QUARTER: "包季",
+  MONTH: "包月",
+})
+
+const optionTypeList = ref([]);
+const props = defineProps({
+  primary: String | Number | Object,
+  api: String,
+});
+const filtersObj = ['MONTH', 'QUARTER', 'YEAR']
+
+const isShowKb = (e) => {
+  return filtersObj.includes(e.type)
+}
+const gearsClose = () => {
+  visibleGears.value = false
+}
+const openGears = (index: number | null, row: object) => {
+  if (row) {
+    gearsData.value = row
+    gearsData.value.index = index
+    visibleGears.value = true
+  } else {
+    if (tableData.value.length >= 6) return ElMessageBox.alert('当前充值档位位置已满')
+    gearsData.value = null
+    visibleGears.value = true
+  }
+}
+const deleteRow = (index: number) => {
+  ElMessageBox.confirm(
+    '确定要删除此条充值档位吗?',
+    '提示',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(() => {
+      tableData.value.splice(index, 1)
+    })
+    .catch(() => {
+
+    })
+}
+const success = (e) => {
+  console.log(e, 'successsuccesssuccess');
+  const data = {
+    ...e,
+    ...e.typeObj,
+    ...e.sequenceObj
+  };
+  if (e.index != undefined) {
+    tableData.value[e.index] = data
+  } else {
+    tableData.value.push(data)
+  }
+}
+const cancel = () => {
+  emit('close')
+}
+const submitFormChange = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  dataForm.value.options = tableData.value.map(el => {
+    return {
+      price: Number(el.price),
+      type: el.type,
+      given: Number(el.given),
+      sequence: el.sequence,
+      is_default: el.is_default
+    }
+  })
+  loading.value = true;
+  formEl
+    .validate(valid => {
+      if (valid) {
+        const params = {
+          name: dataForm.value.name,
+          status: dataForm.value.status,
+          options: JSON.stringify(dataForm.value.options),
+          type: dataForm.value.type,
+        }
+        console.log(params, 'paramsparams');
+        if (props.primary) {
+          channelPaytemplateUpdate(dataForm.value.id, params).then(res => {
+            loading.value = false;
+            ElMessage.success(res.message)
+            emit('close')
+          }).catch(e => {
+            loading.value = false;
+          })
+        } else {
+          channelPaytemplateStore(params).then(res => {
+            loading.value = false;
+            ElMessage.success(res.message)
+            emit('close')
+          }).catch(e => {
+            loading.value = false;
+          })
+        }
+      } else {
+        loading.value = false;
+      }
+    })
+    .then(() => { });
+}
+
+if (props.primary) {
+  console.log(props.primary, 'props.primary');
+  channelPaytemplateShow(props.primary).then(res => {
+    dataForm.value = res.data.template_info
+    console.log(res, 'channelPaytemplateShowchannelPaytemplateShow');
+    tableData.value = res.data.template_item_list
+  })
+}
+
+onMounted(() => {
+  channelPaytemplateOptionTypeList().then(res => {
+    console.log(res);
+    optionTypeList.value = res.data
+
+  })
+});
+</script>
+<style scoped lang="scss">
+.item {
+  width: 300px;
+}
+
+.type-wrapper {
+  width: 80%;
+  display: flex;
+
+  .btn {
+    margin: 0 6px;
+  }
+}
+
+.device-wrap {
+  width: 350px;
+  margin-left: 20px;
+  margin-top: 20px;
+
+  img {
+    width: 100%;
+    height: 100%;
+    border-bottom-left-radius: 40px;
+    border-bottom-right-radius: 40px;
+  }
+
+  .preview-list {
+    position: absolute;
+    top: 100px;
+    left: 0;
+    right: 0;
+    padding: 15px;
+    padding-top: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-flow: row wrap;
+  }
+
+  .pay-item {
+    width: 46%;
+    margin-right: 4%;
+    height: 80px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
+    background: #e6e6e6;
+    border-radius: 10px;
+    position: relative;
+    box-sizing: border-box;
+    overflow: hidden;
+
+    &.defalut {
+      border: 1px solid #fd555d;
+    }
+
+    .tipss {
+      position: absolute;
+      right: 0;
+      height: 20px;
+      line-height: 20px;
+      top: 0;
+      padding: 0 4px;
+      background-color: #fd555d;
+      color: #fff;
+      font-size: 12px;
+    }
+
+    &:nth-child(2n) {
+      margin-right: 0;
+    }
+
+    p {
+      width: 100%;
+      line-height: 20px;
+      color: #000;
+      font-size: 12px;
+      text-align: center;
+
+      &:first-child {
+        font-size: 14px;
+        font-weight: bold;
+
+        span {
+          display: inline-block;
+          padding: 0 2px;
+          background: #fd555d;
+          color: #fff;
+          font-size: 10px;
+          margin-left: 5px;
+          vertical-align: top;
+          transform: scale(0.8);
+        }
+      }
+
+      &:last-child {
+        color: #666;
+      }
+    }
+  }
+}
+</style>

src/views/chargeManage/chargeTemplate/tabs/firstTemplate/index.vue

@@ -0,0 +1,195 @@
+<template>
+  <div v-if="!showCreate">
+    <Search :search="search" :reset="resetQuery">
+      <template v-slot:body>
+        <el-form-item label="模板名称">
+          <el-input v-model="query.name" clearable />
+        </el-form-item>
+      </template>
+    </Search>
+    <div class="table-default">
+      <div class="pt-5 pl-2">
+        <Add @click="openForm(null)" v-action="'channel.payTemplate.store'" />
+      </div>
+      <el-table :data="tableData" class="mt-3" v-loading="loading">
+        <el-table-column prop="name" label="模板名称" />
+        <el-table-column prop="status_str" label="是否为默认模板" v-if="!rolesIdentify.includes('optimizer')" />
+        <el-table-column label="操作" width="200">
+          <template #default="scope">
+            <el-button link type="primary" size="small" @click="openForm(scope.row)"
+              v-action="'channel.payTemplate.update'">编辑</el-button>
+            <el-button link type="primary" size="small" @click="openDetail(scope.row)">查看详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Paginate />
+    </div>
+    <el-dialog v-model="dialogVisible" title="查看详情" width="30%">
+      <div class="device-wrap" style="margin:0 auto;">
+        <div class="md-iphone-5 md-white-device">
+          <div class="md-body">
+            <div class="md-buttons"></div>
+            <div class="md-front-camera"></div>
+            <div class="md-top-speaker"></div>
+            <div class="md-screen">
+              <img src="@/assets/pay-config-bg.jpg" alt="" />
+              <div class="preview-list">
+                <div class="pay-item" v-for="(row, i) in detailData" :key="i"
+                  :class="[row.is_default == 1 ? 'defalut' : '']">
+                  <p>{{ row.price }}元</p>
+                  <p v-show="row.given">多送{{ row.given }}看币</p>
+                  <div class="tipss">{{ gearsName[row.type] }}</div>
+                </div>
+              </div>
+            </div>
+            <button class="md-home-button"></button>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+
+  <Create v-else @close="cancel(search)" :primary="primary" :api="editapi" />
+</template>
+
+<script lang="ts" setup>
+import { computed, onMounted, ref } from 'vue';
+import Create from './form/create.vue';
+import { useGetList } from '@/hook/curd/useGetList';
+import { channelPaytemplateShow } from '@/api/charge/index'
+const api = 'channel/paytemplate/list';
+let editapi = 'system/notices/notice/edit';
+const rolesIdentify = inject('rolesIdentify')
+const dialogVisible = ref(false)
+const detailData = ref([])
+let showCreate = ref(false)
+const gearsName = ref({
+  FIRST_COIN: "首充",
+  COIN: "普通充值",
+  YEAR: "包年",
+  QUARTER: "包季",
+  MONTH: "包月",
+})
+const { data, query, search, reset, loading } = useGetList(api, true);
+const tableData = computed(() => data.value?.data);
+const primary = ref({})
+const current = ref({})
+const openDetail = (row: object) => {
+  current.value = row;
+  channelPaytemplateShow(row.id).then(res => {
+    dialogVisible.value = true;
+    detailData.value = res.data.template_item_list
+  })
+}
+const openForm = (data: any) => {
+  showCreate.value = true
+  if (data) {
+    primary.value = data.id
+  } else {
+    primary.value = data
+  }
+};
+const cancel = () => {
+  showCreate.value = false
+  search()
+};
+const resetQuery = () => {
+  query.value = Object.assign({ page: query.value.page, limit: query.value.limit, type: 1 });
+  search()
+}
+onMounted(() => {
+  query.value = Object.assign({ page: query.value.page, limit: query.value.limit, type: 1 });
+  search();
+});
+</script>
+<style lang="scss" scoped>
+.device-wrap {
+  width: 350px;
+  margin-left: 20px;
+  margin-top: 20px;
+
+  img {
+    width: 100%;
+    height: 100%;
+    border-bottom-left-radius: 40px;
+    border-bottom-right-radius: 40px;
+  }
+
+  .preview-list {
+    position: absolute;
+    top: 100px;
+    left: 0;
+    right: 0;
+    padding: 15px;
+    padding-top: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-flow: row wrap;
+  }
+
+  .pay-item {
+    width: 46%;
+    margin-right: 4%;
+    height: 80px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
+    background: #e6e6e6;
+    border-radius: 10px;
+    position: relative;
+    box-sizing: border-box;
+    overflow: hidden;
+
+    &.defalut {
+      border: 1px solid #fd555d;
+    }
+
+    .tipss {
+      position: absolute;
+      right: 0;
+      height: 20px;
+      line-height: 20px;
+      top: 0;
+      padding: 0 4px;
+      background-color: #fd555d;
+      color: #fff;
+      font-size: 12px;
+    }
+
+    &:nth-child(2n) {
+      margin-right: 0;
+    }
+
+    p {
+      width: 100%;
+      line-height: 20px;
+      color: #000;
+      font-size: 12px;
+      text-align: center;
+
+      &:first-child {
+        font-size: 14px;
+        font-weight: bold;
+
+        span {
+          display: inline-block;
+          padding: 0 2px;
+          background: #fd555d;
+          color: #fff;
+          font-size: 10px;
+          margin-left: 5px;
+          vertical-align: top;
+          transform: scale(0.8);
+        }
+      }
+
+      &:last-child {
+        color: #666;
+      }
+    }
+  }
+}
+</style>

src/views/chargeManage/chargeTemplate/tabs/nofirstTemplate/form/create.vue

@@ -0,0 +1,334 @@
+<template>
+  <el-card shadow="always" style="overflow: auto;" :body-style="{ padding: '10px' }">
+    <template #header>
+      <div class="card-header">
+        <span>{{ props.primary ? '编辑' : '添加' }}非首充模板</span>
+      </div>
+    </template>
+    <el-form :model="dataForm" label-width="130px" ref="form" v-loading="loading" class="pr-6">
+      <el-form-item label="模板名称" prop="name"
+        :rules="[{ required: true, message: '模板名称必须填写' }, { max: 20, message: '至多输入20个字符', trigger: 'blur' }]">
+        <el-input class="item" v-model="dataForm.name" clearable />
+      </el-form-item>
+      <el-form-item label="充值档位" prop="options" :rules="[{ required: true, message: '请添加充值档位' }]">
+        <div class="flex justify-start w-full" shadow="never">
+          <div class="mr-6" style="min-width:400px;">
+            <div class="pt-5 pl-2">
+              <Add @click="openGears(null, null)" />
+            </div>
+            <el-table :data="tableData" class="w-full mt-3" v-loading="loading">
+              <el-table-column prop="price" label="价格">
+                <template #default="scope">
+                  <span>{{ scope.row.price }}元</span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="sequence_text" label="位置" />
+              <el-table-column prop="type_name" label="挡位类型" />
+              <el-table-column prop="default_text" label="默认项">
+                <template #default="scope">
+                  <span>{{ scope.row.is_default ? '默认项' : '非默认项' }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作" width="200">
+                <template #default="scope">
+                  <el-button link type="primary" size="small" @click="openGears(scope.$index, scope.row)">编辑</el-button>
+                  <el-button link type="danger" size="small" @click.prevent="deleteRow(scope.$index)">删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div class="device-wrap">
+            <div class="md-iphone-5 md-white-device">
+              <div class="md-body">
+                <div class="md-buttons"></div>
+                <div class="md-front-camera"></div>
+                <div class="md-top-speaker"></div>
+                <div class="md-screen">
+                  <img src="@/assets/pay-config-bg.jpg" alt="" />
+                  <div class="preview-list">
+                    <div class="pay-item" v-for="(row, i) in tableData" :key="i"
+                      :class="[row.is_default == 1 ? 'defalut' : '']">
+                      <p>{{ row.price }}元</p>
+                      <p v-show="row.given">多送{{ row.given }}看币</p>
+                      <div class="tipss">{{ gearsName[row.type] }}</div>
+                    </div>
+                  </div>
+                </div>
+                <button class="md-home-button"></button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </el-form-item>
+      <el-form-item label="是否为默认模板" prop="status" :rules="[{ required: true, message: '请设置是否为默认模板' }]"
+        v-if="!rolesIdentify.includes('optimizer')">
+        <el-switch v-model="dataForm.status" :active-value="1" :inactive-value="0" />
+      </el-form-item>
+      <div class="flex justify-start ml-9">
+        <el-button type="primary" size="default" @click="cancel">取消</el-button>
+        <el-button type="primary" @click="submitFormChange(form)">确认</el-button>
+      </div>
+    </el-form>
+    <Dialog v-model="visibleGears" :title="title" width="40%" destroy-on-close>
+      <createGears @close="gearsClose" @success="success" :data="tableData" :primary="gearsData" />
+    </Dialog>
+  </el-card>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, ref } from 'vue';
+import {
+  channelPaytemplateShow,
+  channelPaytemplateStore,
+  channelPaytemplateUpdate,
+  channelPaytemplateOptionTypeList
+} from '@/api/charge/index'
+import { FormInstance } from 'element-plus';
+import createGears from './createGears.vue';
+const rolesIdentify = inject('rolesIdentify')
+const visibleGears = ref(false)
+const dialogVisible = ref(true)
+const loading = ref(false)
+const gearsData = ref()
+const tableData = ref([])
+const form = ref()
+const emit = defineEmits(['close']);
+const dataForm = ref({ status: 1, type: 2 })
+
+const title = computed(() =>
+  gearsData.value ?
+    '编辑充值档位' : '添加充值档位'
+)
+
+const gearsName = ref({
+  FIRST_COIN: "首充",
+  COIN: "普通充值",
+  YEAR: "包年",
+  QUARTER: "包季",
+  MONTH: "包月",
+})
+
+const optionTypeList = ref([]);
+const props = defineProps({
+  primary: String | Number | Object,
+  api: String,
+});
+const filtersObj = ['MONTH', 'QUARTER', 'YEAR']
+
+const isShowKb = (e) => {
+  return filtersObj.includes(e.type)
+}
+const gearsClose = () => {
+  visibleGears.value = false
+}
+const openGears = (index: number | null, row: object) => {
+  if (row) {
+    gearsData.value = row
+    gearsData.value.index = index
+    visibleGears.value = true
+  } else {
+    if (tableData.value.length >= 6) return ElMessageBox.alert('当前充值档位位置已满')
+    gearsData.value = null
+    visibleGears.value = true
+  }
+}
+const deleteRow = (index: number) => {
+  ElMessageBox.confirm(
+    '确定要删除此条充值档位吗?',
+    '提示',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(() => {
+      tableData.value.splice(index, 1)
+    })
+    .catch(() => {
+
+    })
+}
+const success = (e) => {
+  console.log(e, 'successsuccesssuccess');
+  const data = {
+    ...e,
+    ...e.typeObj,
+    ...e.sequenceObj
+  };
+  if (e.index != undefined) {
+    tableData.value[e.index] = data
+  } else {
+    tableData.value.push(data)
+  }
+}
+const cancel = () => {
+  emit('close')
+}
+const submitFormChange = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  dataForm.value.options = tableData.value.map(el => {
+    return {
+      price: Number(el.price),
+      type: el.type,
+      given: Number(el.given),
+      sequence: el.sequence,
+      is_default: el.is_default
+    }
+  })
+  loading.value = true;
+  formEl
+    .validate(valid => {
+      if (valid) {
+        const params = {
+          name: dataForm.value.name,
+          status: dataForm.value.status,
+          options: JSON.stringify(dataForm.value.options),
+          type: dataForm.value.type,
+        }
+        console.log(params, 'paramsparams');
+        if (props.primary) {
+          channelPaytemplateUpdate(dataForm.value.id, params).then(res => {
+            loading.value = false;
+            ElMessage.success(res.message)
+            emit('close')
+          }).catch(e => {
+            loading.value = false;
+          })
+        } else {
+          channelPaytemplateStore(params).then(res => {
+            loading.value = false;
+            ElMessage.success(res.message)
+            emit('close')
+          }).catch(e => {
+            loading.value = false;
+          })
+        }
+      } else {
+        loading.value = false;
+      }
+    })
+    .then(() => { });
+}
+
+if (props.primary) {
+  console.log(props.primary, 'props.primary');
+  channelPaytemplateShow(props.primary).then(res => {
+    dataForm.value = res.data.template_info
+    console.log(res, 'channelPaytemplateShowchannelPaytemplateShow');
+    tableData.value = res.data.template_item_list
+  })
+}
+
+onMounted(() => {
+  channelPaytemplateOptionTypeList().then(res => {
+    console.log(res);
+    optionTypeList.value = res.data
+
+  })
+});
+</script>
+<style scoped lang="scss">
+.item {
+  width: 300px;
+}
+
+.type-wrapper {
+  width: 80%;
+  display: flex;
+
+  .btn {
+    margin: 0 6px;
+  }
+}
+
+.device-wrap {
+  width: 350px;
+  margin-left: 20px;
+  margin-top: 20px;
+
+  img {
+    width: 100%;
+    height: 100%;
+    border-bottom-left-radius: 40px;
+    border-bottom-right-radius: 40px;
+  }
+
+  .preview-list {
+    position: absolute;
+    top: 100px;
+    left: 0;
+    right: 0;
+    padding: 15px;
+    padding-top: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-flow: row wrap;
+  }
+
+  .pay-item {
+    width: 46%;
+    margin-right: 4%;
+    height: 80px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
+    background: #e6e6e6;
+    border-radius: 10px;
+    position: relative;
+    box-sizing: border-box;
+    overflow: hidden;
+
+    &.defalut {
+      border: 1px solid #fd555d;
+    }
+
+    .tipss {
+      position: absolute;
+      right: 0;
+      height: 20px;
+      line-height: 20px;
+      top: 0;
+      padding: 0 4px;
+      background-color: #fd555d;
+      color: #fff;
+      font-size: 12px;
+    }
+
+    &:nth-child(2n) {
+      margin-right: 0;
+    }
+
+    p {
+      width: 100%;
+      line-height: 20px;
+      color: #000;
+      font-size: 12px;
+      text-align: center;
+
+      &:first-child {
+        font-size: 14px;
+        font-weight: bold;
+
+        span {
+          display: inline-block;
+          padding: 0 2px;
+          background: #fd555d;
+          color: #fff;
+          font-size: 10px;
+          margin-left: 5px;
+          vertical-align: top;
+          transform: scale(0.8);
+        }
+      }
+
+      &:last-child {
+        color: #666;
+      }
+    }
+  }
+}
+</style>

src/views/chargeManage/chargeTemplate/tabs/nofirstTemplate/index.vue

@@ -0,0 +1,195 @@
+<template>
+  <div v-if="!showCreate">
+    <Search :search="search" :reset="resetQuery">
+      <template v-slot:body>
+        <el-form-item label="模板名称">
+          <el-input v-model="query.name" clearable />
+        </el-form-item>
+      </template>
+    </Search>
+    <div class="table-default">
+      <div class="pt-5 pl-2">
+        <Add @click="openForm(null)" v-action="'channel.payTemplate.store'" />
+      </div>
+      <el-table :data="tableData" class="mt-3" v-loading="loading">
+        <el-table-column prop="name" label="模板名称" />
+        <el-table-column prop="status_str" label="是否为默认模板" v-if="!rolesIdentify.includes('optimizer')" />
+        <el-table-column label="操作" width="200">
+          <template #default="scope">
+            <el-button link type="primary" size="small" @click="openForm(scope.row)"
+              v-action="'channel.payTemplate.update'">编辑</el-button>
+            <el-button link type="primary" size="small" @click="openDetail(scope.row)">查看详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Paginate />
+    </div>
+    <el-dialog v-model="dialogVisible" title="查看详情" width="30%">
+      <div class="device-wrap" style="margin:0 auto;">
+        <div class="md-iphone-5 md-white-device">
+          <div class="md-body">
+            <div class="md-buttons"></div>
+            <div class="md-front-camera"></div>
+            <div class="md-top-speaker"></div>
+            <div class="md-screen">
+              <img src="@/assets/pay-config-bg.jpg" alt="" />
+              <div class="preview-list">
+                <div class="pay-item" v-for="(row, i) in detailData" :key="i"
+                  :class="[row.is_default == 1 ? 'defalut' : '']">
+                  <p>{{ row.price }}元</p>
+                  <p v-show="row.given">多送{{ row.given }}看币</p>
+                  <div class="tipss">{{ gearsName[row.type] }}</div>
+                </div>
+              </div>
+            </div>
+            <button class="md-home-button"></button>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+
+  <Create v-else @close="cancel(search)" :primary="primary" :api="editapi" />
+</template>
+
+<script lang="ts" setup>
+import { computed, onMounted, ref } from 'vue';
+import Create from './form/create.vue';
+import { useGetList } from '@/hook/curd/useGetList';
+import { channelPaytemplateShow } from '@/api/charge/index'
+const api = 'channel/paytemplate/list';
+let editapi = 'system/notices/notice/edit';
+const rolesIdentify = inject('rolesIdentify')
+const dialogVisible = ref(false)
+const detailData = ref([])
+let showCreate = ref(false)
+const gearsName = ref({
+  FIRST_COIN: "首充",
+  COIN: "普通充值",
+  YEAR: "包年",
+  QUARTER: "包季",
+  MONTH: "包月",
+})
+const { data, query, search, reset, loading } = useGetList(api, true);
+const tableData = computed(() => data.value?.data);
+const primary = ref({})
+const current = ref({})
+const openDetail = (row: object) => {
+  current.value = row;
+  channelPaytemplateShow(row.id).then(res => {
+    dialogVisible.value = true;
+    detailData.value = res.data.template_item_list
+  })
+}
+const openForm = (data: any) => {
+  showCreate.value = true
+  if (data) {
+    primary.value = data.id
+  } else {
+    primary.value = data
+  }
+};
+const cancel = () => {
+  showCreate.value = false
+  search()
+};
+const resetQuery = () => {
+  query.value = Object.assign({ page: query.value.page, limit: query.value.limit, type: 2 });
+  search()
+}
+onMounted(() => {
+  query.value = Object.assign({ page: query.value.page, limit: query.value.limit, type: 2 });
+  search();
+});
+</script>
+<style lang="scss" scoped>
+.device-wrap {
+  width: 350px;
+  margin-left: 20px;
+  margin-top: 20px;
+
+  img {
+    width: 100%;
+    height: 100%;
+    border-bottom-left-radius: 40px;
+    border-bottom-right-radius: 40px;
+  }
+
+  .preview-list {
+    position: absolute;
+    top: 100px;
+    left: 0;
+    right: 0;
+    padding: 15px;
+    padding-top: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-flow: row wrap;
+  }
+
+  .pay-item {
+    width: 46%;
+    margin-right: 4%;
+    height: 80px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
+    background: #e6e6e6;
+    border-radius: 10px;
+    position: relative;
+    box-sizing: border-box;
+    overflow: hidden;
+
+    &.defalut {
+      border: 1px solid #fd555d;
+    }
+
+    .tipss {
+      position: absolute;
+      right: 0;
+      height: 20px;
+      line-height: 20px;
+      top: 0;
+      padding: 0 4px;
+      background-color: #fd555d;
+      color: #fff;
+      font-size: 12px;
+    }
+
+    &:nth-child(2n) {
+      margin-right: 0;
+    }
+
+    p {
+      width: 100%;
+      line-height: 20px;
+      color: #000;
+      font-size: 12px;
+      text-align: center;
+
+      &:first-child {
+        font-size: 14px;
+        font-weight: bold;
+
+        span {
+          display: inline-block;
+          padding: 0 2px;
+          background: #fd555d;
+          color: #fff;
+          font-size: 10px;
+          margin-left: 5px;
+          vertical-align: top;
+          transform: scale(0.8);
+        }
+      }
+
+      &:last-child {
+        color: #666;
+      }
+    }
+  }
+}
+</style>

src/views/customer/audience/index.vue

@@ -1,83 +1,84 @@
 <template>
-	<div>
-		<Search :search="search" :reset="reset">
-		  <template v-slot:body>
-		    <el-form-item label="用户id" prop="uid">
-		      <el-input v-model="id" name="uid" clearable />
-		    </el-form-item>
-		
-		  </template>
-		</Search>
-		
-		<div class="table-default">
-			<el-table  :data="tableData"  class="mt-3" v-loading="loading">
-			  <el-table-column prop="miniprogram_name" label="小程序" />
-			  <el-table-column prop="uid" label="用户id" />
-			  <el-table-column prop="user_created_at" label="小程序注册时间" />
-			  <el-table-column prop="ranse_start_at" label="最新染色时间" />
-			  <el-table-column prop="charge_coin" label="看币余额" />
-			  <el-table-column prop="reward_coin" label="充送币余额" />
-			  <el-table-column prop="total_charge_count" label="累计充值次数" />
-			  <el-table-column prop="vip_text" label="VIP状态" />
-			  <el-table-column prop="vip_end" label="VIP结束时间" />
-			  <el-table-column label="操作" fixed="right">
-					<template #default="scope">
-						<el-button v-action="'channel.orders.userDetails'" link type="primary" size="small"
-						  @click="openDetail(scope.row)">用户详情</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-		</div>
-		<Dialog v-model="userDetailVisible" width="50%" title="用户详情" :alignCenter="true" destroy-on-close>
-		  <userDetail @close="closeDetail" :primary="userDetailData"></userDetail>
-		</Dialog>
-	</div>
+  <div>
+    <Search :search="search" :reset="reset">
+      <template v-slot:body>
+        <el-form-item label="用户ID" prop="uid">
+          <el-input v-model="id" name="uid" clearable />
+        </el-form-item>
+      </template>
+    </Search>
+    <div class="table-default">
+      <el-table :data="tableData" class="mt-3" v-loading="loading">
+        <el-table-column prop="miniprogram_name" label="小程序" />
+        <el-table-column prop="uid" label="用户ID" />
+        <el-table-column prop="user_created_at" label="小程序注册时间" />
+        <el-table-column prop="ranse_start_at" label="最新染色时间" />
+        <el-table-column prop="charge_coin" label="看币余额" />
+        <el-table-column prop="reward_coin" label="充送币余额" />
+        <el-table-column prop="total_charge_count" label="累计充值次数" />
+        <el-table-column prop="vip_text" label="VIP状态" />
+        <el-table-column prop="vip_end" label="VIP结束时间" />
+        <el-table-column label="操作" fixed="right">
+          <template #default="scope">
+            <el-button v-action="'channel.orders.userDetails'" link type="primary" size="small"
+              @click="openDetail(scope.row)">用户详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <Dialog v-model="userDetailVisible" width="50%" title="用户详情" :alignCenter="true" destroy-on-close>
+      <userDetail @close="closeDetail" :primary="userDetailData"></userDetail>
+    </Dialog>
+  </div>
 </template>
 
 <script lang="ts" setup>
-import { computed, onMounted,} from 'vue';
+import { computed, onMounted, } from 'vue';
 import userDetail from './userDetail/index.vue';
 import router from '@/router'
-import {getUserInfo} from "@/api/customer/audience"
+import { getUserInfo } from "@/api/customer/audience"
 import { list } from 'postcss';
 const rolesIdentify = inject('rolesIdentify');
 const loading = ref(false)
-const id = ref('');	
+const id = ref('');
 const tableData = ref([]);
 const userDetailData = ref({})
 const userDetailVisible = ref(false)
-const   search = async ()  => {
-	if(id.value <  1){
-		ElMessage.error("请输入用户id");
-		return false;
-	};
-	loading.value = true;
-	tableData.value = [];
-	if(rolesIdentify.value.includes('optimizer')){
-		let res = 	await getUserInfo({uid:id.value})
-		if(res.data){
-			tableData.value.push(res.data);
-		}
-	}
-	loading.value = false;
-	
+const search = async () => {
+  if (id.value < 1) {
+    ElMessage.error("请输入用户id");
+    return false;
+  };
+  loading.value = true;
+  tableData.value = [];
+  if (rolesIdentify.value.includes('optimizer')) {
+    let res = await getUserInfo({ uid: id.value })
+    if (res.data) {
+      tableData.value.push(res.data);
+    }
+  }
+  loading.value = false;
+
 };
+const reset = () => {
+  id.value = '';
+  tableData.value = [];
+}
 
 
-const closeDetail = () =>{
-	userDetailVisible.value = false;
+const closeDetail = () => {
+  userDetailVisible.value = false;
 }
-const openDetail = ( data: object) =>{
-	userDetailVisible.value = true;
-	userDetailData.value = data;
+const openDetail = (data: object) => {
+  userDetailVisible.value = true;
+  userDetailData.value = data;
 }
-onMounted(() =>{
-	// tableData.push();
-	// console.log(tableData);
+onMounted(() => {
+  // tableData.push();
+  // console.log(tableData);
 })
 </script>
 
 
 
-<style>
-</style>
+<style></style>

src/views/dashboard/index.vue

@@ -3,7 +3,7 @@
     <div class="welcome">
       <div class="header">
         <!-- <img src="@/assets/logo.png" alt="logo" class="logo"> -->
-        <h1>追书云短剧平台</h1>
+        <h1>追剧云平台</h1>
       </div>
       <div class="content">
         <h2>欢迎使用</h2>

src/views/ordersManage/tabs/rechargeList/index.vue

@@ -147,6 +147,7 @@ import { useGetList } from '@/hook/curd/useGetList';
 import { titleObj, titlePtObj } from "./excelTitle"
 import userDetail from './userDetail/index.vue'
 import create from './form/create.vue'
+import Cache from '@/support/cache';
 import {
   channelOrderList,
   channelMiniprogramUseList,
@@ -298,6 +299,9 @@ onMounted(() => {
   // query.value.orderTime = [start_date, end_date];
   // query.value.created_at_start = start_date
   // query.value.created_at_end = end_date
+  if (JSON.parse(Cache.get('nav_data'))?.app.id) {
+    query.value.miniprogram_id = JSON.parse(Cache.get('nav_data'))?.app.id
+  }
   search();
 });
 </script>
@@ -322,4 +326,5 @@ onMounted(() => {
       font-size: 15px;
     }
   }
-}</style>
+}
+</style>

src/views/ordersManage/tabs/refundList/index.vue

@@ -45,24 +45,24 @@
               value-format="YYYY-MM-DD" v-model="query.orderTime" type="daterange" :shortcuts="shortcuts"
               range-separator="To" start-placeholder="开始时间" end-placeholder="结束时间" />
           </el-form-item>
-		  <el-form-item label="支付名称" prop="pay_merchant_name"  v-if="rolesIdentify.includes('administrator')">
-		    <el-input v-model="query.pay_merchant_name" placeholder="请输入支付名称" clearable />
-		  </el-form-item>
-		  <el-form-item label="收款主体" prop="payee_name" v-if="rolesIdentify.includes('administrator')">
-		    <el-input v-model="query.payee_name" placeholder="请输入收款主体" clearable />
-		  </el-form-item>
-		  <el-form-item label="支付商户号" prop="pay_appid"  v-if="rolesIdentify.includes('administrator')">
-		    <el-input v-model="query.pay_appid" placeholder="请输入支付商户号" clearable />
-		  </el-form-item>
+          <el-form-item label="支付名称" prop="pay_merchant_name" v-if="rolesIdentify.includes('administrator')">
+            <el-input v-model="query.pay_merchant_name" placeholder="请输入支付名称" clearable />
+          </el-form-item>
+          <el-form-item label="收款主体" prop="payee_name" v-if="rolesIdentify.includes('administrator')">
+            <el-input v-model="query.payee_name" placeholder="请输入收款主体" clearable />
+          </el-form-item>
+          <el-form-item label="支付商户号" prop="pay_appid" v-if="rolesIdentify.includes('administrator')">
+            <el-input v-model="query.pay_appid" placeholder="请输入支付商户号" clearable />
+          </el-form-item>
         </template>
         <template v-slot:extra_button>
-          <exportExcel v-if="rolesIdentify.includes('administrator')"  api="orderRefund/order_list" sheet_name="订单列表" :title_obj="titlePtObj[query.refund_status]"
-            :extro_params="{ is_all: true, ...query }">
+          <exportExcel v-if="rolesIdentify.includes('administrator')" api="orderRefund/order_list" sheet_name="订单列表"
+            :title_obj="titlePtObj[query.refund_status]" :extro_params="{ is_all: true, ...query }">
+          </exportExcel>
+          <exportExcel v-else="rolesIdentify.includes('administrator')" api="orderRefund/order_list" sheet_name="订单列表"
+            :title_obj="titleObj[query.refund_status]" :extro_params="{ is_all: true, ...query }">
           </exportExcel>
-		  <exportExcel v-else="rolesIdentify.includes('administrator')"  api="orderRefund/order_list" sheet_name="订单列表" :title_obj="titleObj[query.refund_status]"
-		    :extro_params="{ is_all: true, ...query }">
-		  </exportExcel>
-		  
+
         </template>
       </Search>
     </div>
@@ -95,12 +95,15 @@
         </el-table-column>
         <el-table-column prop="pay_name" label="支付方式" show-overflow-tooltip min-width="150px">
         </el-table-column>
-		<el-table-column prop="pay_merchant_name" label="支付名称" show-overflow-tooltip min-width="150px"  v-if="rolesIdentify.includes('administrator')">
-		</el-table-column>
-		<el-table-column prop="payee_name" label="收款主体" show-overflow-tooltip min-width="150px"  v-if="rolesIdentify.includes('administrator')">
-		</el-table-column>
-		<el-table-column prop="pay_appid" label="支付商户号" show-overflow-tooltip min-width="150px"  v-if="rolesIdentify.includes('administrator')">
-		</el-table-column>
+        <el-table-column prop="pay_merchant_name" label="支付名称" show-overflow-tooltip min-width="150px"
+          v-if="rolesIdentify.includes('administrator')">
+        </el-table-column>
+        <el-table-column prop="payee_name" label="收款主体" show-overflow-tooltip min-width="150px"
+          v-if="rolesIdentify.includes('administrator')">
+        </el-table-column>
+        <el-table-column prop="pay_appid" label="支付商户号" show-overflow-tooltip min-width="150px"
+          v-if="rolesIdentify.includes('administrator')">
+        </el-table-column>
         <el-table-column prop="pay_at" label="退款时间" v-if="query.refund_status == 1" show-overflow-tooltip
           min-width="180px">
         </el-table-column>
@@ -117,7 +120,7 @@
             </div>
           </template>
         </el-table-column>
-      <!--  <el-table-column v-if="query.refund_status == 0" prop="pt_verify_status_text" label="平台审核" show-overflow-tooltip
+        <!--  <el-table-column v-if="query.refund_status == 0" prop="pt_verify_status_text" label="平台审核" show-overflow-tooltip
           min-width="150px">
           <template #default="scope">
             <div class="wrapper">
@@ -127,10 +130,10 @@
             </div>
           </template>
         </el-table-column> -->
-    <!--    <el-table-column v-if="query.refund_status == 0" prop="pt_verify_remark" label="平台审核备注" show-overflow-tooltip
+        <!--    <el-table-column v-if="query.refund_status == 0" prop="pt_verify_remark" label="平台审核备注" show-overflow-tooltip
           min-width="150px">
         </el-table-column> -->
-       <!-- <el-table-column v-if="query.refund_status == 0" prop="sh_verify_status_text" label="商户审核" show-overflow-tooltip
+        <!-- <el-table-column v-if="query.refund_status == 0" prop="sh_verify_status_text" label="商户审核" show-overflow-tooltip
           min-width="150px">
           <template #default="scope">
             <div class="wrapper">
@@ -140,25 +143,24 @@
             </div>
           </template>
         </el-table-column> -->
-       <!-- <el-table-column v-if="query.refund_status == 0" prop="sh_verify_remark" label="商户审核备注" show-overflow-tooltip
+        <!-- <el-table-column v-if="query.refund_status == 0" prop="sh_verify_remark" label="商户审核备注" show-overflow-tooltip
           min-width="150px">
         </el-table-column> -->
         <el-table-column v-if="query.refund_status == 0" label="操作" fixed="right">
           <template #default="scope">
-          <!--  <el-button link type="primary" size="small" v-action="'orderRefund.RefundOrder.platformVerify'"
+            <!--  <el-button link type="primary" size="small" v-action="'orderRefund.RefundOrder.platformVerify'"
               @click="openType('noapprovedVisible', scope.row, '平台审核')">平台审核</el-button>
             <br /> -->
-          <!--  <el-button link type="primary" size="small" v-action="'orderRefund.RefundOrder.companyVerify'"
+            <!--  <el-button link type="primary" size="small" v-action="'orderRefund.RefundOrder.companyVerify'"
               @click="openType('noapprovedVisible', scope.row, '商户审核')">商户审核</el-button>
             <br /> -->
-           <!-- <el-button :disabled="!scope.row.can_pay" link type="primary" size="small"
+            <!-- <el-button :disabled="!scope.row.can_pay" link type="primary" size="small"
               v-action="'orderRefund.RefundOrder.payToUser'"
               @click="openType('approvedVisible', scope.row)">确认打款</el-button>
             <br /> -->
-			<el-button link type="primary" size="small"
-			  v-action="'orderRefund.RefundOrder.payToUser'"
-			  @click="openType('approvedVisible', scope.row)">确认打款</el-button>
-			<br />
+            <el-button link type="primary" size="small" v-action="'orderRefund.RefundOrder.payToUser'"
+              @click="openType('approvedVisible', scope.row)">确认打款</el-button>
+            <br />
           </template>
         </el-table-column>
       </el-table>
@@ -192,7 +194,8 @@ import { shortcuts } from '@/utils/shortcuts'
 import { useRouter, useRoute } from 'vue-router'
 import { InfoFilled } from '@element-plus/icons-vue';
 import { useGetList } from '@/hook/curd/useGetList';
-import {titleObj,titlePtObj} from "./excelTitle"
+import { titleObj, titlePtObj } from "./excelTitle"
+import Cache from '@/support/cache';
 import {
   channelOrderList,
   channelMiniprogramUseList,
@@ -361,6 +364,9 @@ onMounted(() => {
   initRemoteOption('channelPromotions')
   init()
   query.value.refund_status = 0;
+  if (JSON.parse(Cache.get('nav_data'))?.app.id) {
+    query.value.miniprogram_id = JSON.parse(Cache.get('nav_data'))?.app.id
+  }
   search();
 });
 </script>

src/views/pageLayout/channelPageManage/form/videoList.vue

@@ -179,7 +179,7 @@ const validateData = () => {
   const nameSet = new Set();
 
   for (const item of multipleSelection.value) {
-    if (item.sort === null || item.sort === undefined) {
+    if (item.sort === null || item.sort === undefined || !item.sort) {
       ElMessage.error(`${item.name}的排序不能为空`)
       return false;
     }

src/views/pageLayout/homePageManage/form/videoList.vue

@@ -179,7 +179,7 @@ const validateData = () => {
   const nameSet = new Set();
 
   for (const item of multipleSelection.value) {
-    if (item.sort === null || item.sort === undefined) {
+    if (item.sort === null || item.sort === undefined || !item.sort) {
       ElMessage.error(`${item.name}的排序不能为空`)
       return false;
     }

src/views/payBack/juliangAccount/tabs/advertiserList/form/create.vue

@@ -20,6 +20,14 @@
             <el-input style="width:200px;margin:0 5px;" v-model.number="formCallback.max_money">
               <template #append>元</template>
             </el-input>
+            <el-tooltip placement="top">
+              <template #content>
+                <span>判断范围示例： 30&lt;= 回传金额 &gt;= 1000</span> <br />
+              </template>
+              <el-icon>
+                <InfoFilled />
+              </el-icon>
+            </el-tooltip>
           </div>
         </el-form-item>
         <el-form-item class="ml-6" label="" label-width="fit-content">
@@ -76,7 +84,7 @@
 </template>
 
 <script lang="ts" setup>
-import { Close } from '@element-plus/icons-vue';
+import { Close, InfoFilled } from '@element-plus/icons-vue';
 import { FormInstance } from 'element-plus';
 import { callbackJuliangAccountAddAccount } from '@/api/backConfig/index'
 import { useRouter, useRoute } from 'vue-router'

src/views/payBack/juliangAccount/tabs/advertiserList/form/paybackConfig.vue

@@ -14,6 +14,14 @@
             <el-input style="width:200px;margin:0 5px;" v-model.number="formCallback.max_money">
               <template #append>元</template>
             </el-input>
+            <el-tooltip placement="top">
+              <template #content>
+                <span>判断范围示例： 30&lt;= 回传金额 &gt;= 1000</span> <br />
+              </template>
+              <el-icon>
+                <InfoFilled />
+              </el-icon>
+            </el-tooltip>
           </div>
         </el-form-item>
         <el-form-item class="ml-6" label="" label-width="fit-content">
@@ -70,7 +78,7 @@
 </template>
 
 <script lang="ts" setup>
-import { Close } from '@element-plus/icons-vue';
+import { Close, InfoFilled } from '@element-plus/icons-vue';
 import { FormInstance } from 'element-plus';
 import { callbackJuliangAccountUpdateCallbackConfig } from '@/api/backConfig/index';
 import { useRouter, useRoute } from 'vue-router'

src/views/payBack/juliangAccount/tabs/advertiserList/index.vue

@@ -14,6 +14,9 @@
         <el-input placeholder="请输入巨量账户" class="input" icon="search" v-model="query.account_name" clearable></el-input>
       </el-form-item> -->
     </template>
+    <template v-slot:extra_button>
+      <el-button type="warning" @click="toHelp">使用文档</el-button>
+    </template>
   </Search>
   <div class="table-default">
     <div class="pt-5 pl-2" v-action="'callback.JuliangAccount.addAccount'">
@@ -94,6 +97,11 @@ const closeType = (type: string) => {
   search()
 }
 
+
+const toHelp = () => {
+  window.open('https://docs.qq.com/doc/DRGRra3lsclJkYW95')
+}
+
 const switchStatus = (data: object) => {
   console.log({ id: data.id, state: data.state }, 'data', data);
   callbackJuliangAccountTurnCallbackState({ id: data.id, state: data.state }).then(res => {

src/views/promotion/promotionList/form/create.vue

@@ -10,6 +10,33 @@
           :value="item.series_sequence" />
       </el-select>
     </el-form-item>
+    <el-form-item label="充值模板配置">
+      <template #label>
+        <div class="flex items-center">
+          <span class="mr-1 text-red-600">*</span>充值模板配置
+        </div>
+      </template>
+      <div class="items-center w-full withdraw-popup-warn">
+        <div>如果没有目标充值模板，请前往<span class="text-lg font-bold text-blue-400 cursor-pointer" @click="toCharge">充值管理</span>进行添加
+        </div>
+      </div>
+      <div class="flex flex-col">
+        <div class="flex items-center">
+          <div style="width:80px;text-align: end;" class="mb-3 mr-2">首充模板:</div>
+          <el-select v-model="formDataForm.first_charge_template_id" filterable remote clearable
+            :remote-method="(query) => { remoteMethod(query, 'firstCharge') }" placeholder="请选择首充模板">
+            <el-option v-for="(item, index) in firstTemplateList" :key="index" :label="item.name" :value="item.id" />
+          </el-select>
+        </div>
+        <div class="flex items-center">
+          <div style="width:80px;text-align: end;" class="mr-2">非首充模板:</div>
+          <el-select v-model="formDataForm.not_first_charge_template_id" filterable remote clearable
+            :remote-method="(query) => { remoteMethod(query, 'notFirstCharge') }" placeholder="请选择非首充模板">
+            <el-option v-for="(item, index) in nofirstTemplate" :key="index" :label="item.name" :value="item.id" />
+          </el-select>
+        </div>
+      </div>
+    </el-form-item>
     <el-form-item label="备注" prop="name" :rules="[{ required: false, message: '备注必须填写' }]">
       <el-input v-model="formDataForm.remark" clearable />
     </el-form-item>
@@ -26,31 +53,77 @@ import Cache from '@/support/cache';
 import { FormInstance } from 'element-plus';
 import { videoStockEpisodeList } from '@/api/video/index'
 import { tuiguangPromotionUpdateSeriesSequence } from '@/api/promotion/index'
+import { channelPaytemplateList } from '@/api/charge/index'
 const props = defineProps({
   primary: String | Number,
 });
+const router = useRouter()
 const emit = defineEmits(['close']);
 const loading = ref(false)
 const form = ref()
+const firstTemplateList = ref([])
+const nofirstTemplate = ref([])
 const sequenceOptions = ref([])
 const formDataForm = ref({})
 if (props.primary) {
-  formDataForm.value.id = props.primary.id
-  formDataForm.value.series_sequence = props.primary.series_sequence
+  formDataForm.value = JSON.parse(JSON.stringify(props.primary))
   console.log(props.primary, 'props.primaryprops.primary');
 }
 
+
+const remoteMethod = (query: string, type: string,) => {
+  console.log(query, 'queryquery', type);
+  switch (type) {
+    case 'firstCharge':
+      initRemoteOption('firstCharge', { name: query })
+      break;
+    case 'notFirstCharge':
+      initRemoteOption('notFirstCharge', { name: query })
+      break;
+  }
+}
+const toCharge = () => {
+  router.push({ path: '/chargeManage/charge' })
+}
+
+const initRemoteOption = (type: string, params?: object) => {
+  switch (type) {
+    case 'firstCharge':
+      channelPaytemplateList({ limit: 999, type: 1, ...params }).then(res => {
+        firstTemplateList.value = res.data
+      })
+      break;
+    case 'notFirstCharge':
+      channelPaytemplateList({ limit: 999, type: 2, ...params }).then(res => {
+        nofirstTemplate.value = res.data
+      })
+      break;
+  }
+}
+
+
 const submitForm = (formEl: FormInstance | undefined) => {
+  if (!formDataForm.value.first_charge_template_id) return ElMessage.error('请选择首充模板')
+  if (!formDataForm.value.not_first_charge_template_id) return ElMessage.error('请选择非首充模板')
   loading.value = true;
   if (!formEl) return;
   formEl
     .validate(valid => {
       if (valid) {
-        tuiguangPromotionUpdateSeriesSequence(formDataForm.value).then(res => {
+        const params = {
+          id: formDataForm.value.id,
+          series_sequence: formDataForm.value.series_sequence,
+          remark: formDataForm.value.remark,
+          first_charge_template_id: formDataForm.value.first_charge_template_id,
+          not_first_charge_template_id: formDataForm.value.not_first_charge_template_id,
+        }
+        tuiguangPromotionUpdateSeriesSequence(params).then(res => {
           console.log(res, 'tuiguangPromotionAddtuiguangPromotionAdd');
           ElMessage.success(res.message)
           emit('close')
           loading.value = false;
+        }).catch(e => {
+          loading.value = false;
         })
       } else {
         loading.value = false;
@@ -59,12 +132,16 @@ const submitForm = (formEl: FormInstance | undefined) => {
     .then(() => { });
 }
 const initSequence = (params?: object) => {
-  videoStockEpisodeList({ video_id: props.primary.video_id, limit: 300, ...params }).then(res => {
+  videoStockEpisodeList({ video_id: props.primary.video_id, limit: 999, ...params }).then(res => {
     sequenceOptions.value = res.data
   })
 }
 
 onMounted(() => {
+  initRemoteOption('firstCharge')
+  initRemoteOption('notFirstCharge')
+  // initRemoteOption('firstCharge', { name: props.primary.first_charge_template_str.slice(0, 1) })
+  // initRemoteOption('notFirstCharge', { name: props.primary.not_first_charge_template_str.slice(0, 1) })
   initSequence()
 });
 </script>

src/views/promotion/promotionList/index.vue

@@ -118,6 +118,12 @@
                   </div>
                 </template>
               </el-table-column>
+              <el-table-column prop="total_episode_num" label="充值模板" min-width="130px">
+                <template #default="scope">
+                  <el-button v-if="scope.row.first_charge_template_str || scope.row.not_first_charge_template_str" link
+                    type="primary" size="default" @click="openDetail(scope.row)">充值模板详情</el-button>
+                </template>
+              </el-table-column>
               <el-table-column prop="callback_config_id" label="备注">
                 <template #default="scope">
                   <div class="wrapper">
@@ -146,7 +152,7 @@
               <el-table-column label="推广名称" show-overflow-tooltip>
                 <template #default="scope">
                   <div class="wrapper">
-                    <span class="text-lg font-bold text-blue-400 content">
+                    <span class="content">
                       {{ scope.row.name }}
                     </span>
                   </div>
@@ -159,7 +165,7 @@
               <el-table-column prop="total_episode_num" label="入口章节">
                 <template #default="scope">
                   <div class="wrapper">
-                    <span class="text-lg font-bold text-blue-400 content">
+                    <span class="content">
                       {{ scope.row.video_name }}
                     </span>
                   </div>
@@ -168,6 +174,12 @@
                   </div>
                 </template>
               </el-table-column>
+              <el-table-column prop="total_episode_num" label="充值模板" min-width="130px">
+                <template #default="scope">
+                  <el-button v-if="scope.row.first_charge_template_str || scope.row.not_first_charge_template_str" link
+                    type="primary" size="default" @click="openDetail(scope.row)">充值模板详情</el-button>
+                </template>
+              </el-table-column>
               <el-table-column label="操作">
                 <template #default="scope">
                   <el-button @click="openType('promotionVisible', scope.row)" link type="primary"
@@ -192,6 +204,67 @@
     <Dialog v-model="backConfigVisible" width="50%" :title="titleBack" destroy-on-close>
       <backConfig @close="closeType('backConfigVisible')" :primary="backConfigData"></backConfig>
     </Dialog>
+
+    <el-dialog v-model="dialogVisible" title="充值模板详情" width="85%">
+      <div class="flex items-center justify-center">
+        <el-card class="w-full mr-16 box-card" shadow="never">
+          <template #header>
+            <div class="card-header">
+              <span>首充模板</span>
+            </div>
+          </template>
+          <div class="w-full device-wrap" style="margin:0 auto;">
+            <div class="md-iphone-5 md-white-device">
+              <div class="md-body">
+                <div class="md-buttons"></div>
+                <div class="md-front-camera"></div>
+                <div class="md-top-speaker"></div>
+                <div class="md-screen">
+                  <img src="@/assets/pay-config-bg.jpg" alt="" />
+                  <div class="preview-list">
+                    <div class="pay-item" v-for="(row, i) in detailData?.firstTemplate" :key="i"
+                      :class="[row.is_default == 1 ? 'defalut' : '']">
+                      <p>{{ row.price }}元</p>
+                      <p v-show="row.given">多送{{ row.given }}看币</p>
+                      <div class="tipss">{{ gearsName[row.type] }}</div>
+                    </div>
+                  </div>
+                </div>
+                <button class="md-home-button"></button>
+              </div>
+            </div>
+          </div>
+        </el-card>
+        <el-card class="w-full box-card" shadow="never">
+          <template #header>
+            <div class="card-header">
+              <span>非首充模板</span>
+            </div>
+          </template>
+          <div class="w-full device-wrap" style="margin:0 auto;">
+            <div class="md-iphone-5 md-white-device">
+              <div class="md-body">
+                <div class="md-buttons"></div>
+                <div class="md-front-camera"></div>
+                <div class="md-top-speaker"></div>
+                <div class="md-screen">
+                  <img src="@/assets/pay-config-bg.jpg" alt="" />
+                  <div class="preview-list">
+                    <div class="pay-item" v-for="(row, i) in detailData?.notFirstTemplate" :key="i"
+                      :class="[row.is_default == 1 ? 'defalut' : '']">
+                      <p>{{ row.price }}元</p>
+                      <p v-show="row.given">多送{{ row.given }}看币</p>
+                      <div class="tipss">{{ gearsName[row.type] }}</div>
+                    </div>
+                  </div>
+                </div>
+                <button class="md-home-button"></button>
+              </div>
+            </div>
+          </div>
+        </el-card>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -206,6 +279,7 @@ import { useGetList } from '@/hook/curd/useGetList';
 import Cache from '@/support/cache';
 const activeName = ref(1)
 import { tuiguangPromotionDel } from '@/api/promotion/index'
+import { channelPaytemplateShow } from '@/api/charge/index'
 const api = 'tuiguang/promotion/list';
 const router = useRouter()
 const route = useRoute()
@@ -215,7 +289,17 @@ const promotionData = ref({})
 const backConfigVisible = ref(false)
 const backConfigData = ref({})
 const current = ref({})
+const dialogVisible = ref(false)
+const detailData = ref({ firstTemplate: [], notFirstTemplate: [] })
 const titleBack = computed(() => activeName.value ? '更新回传配置' : '回传配置')
+const gearsName = ref({
+  FIRST_COIN: "首充",
+  COIN: "普通充值",
+  YEAR: "包年",
+  QUARTER: "包季",
+  MONTH: "包月",
+})
+
 const colorType = (data: object) => {
   const type = data.status
   switch (type) {
@@ -236,6 +320,19 @@ const timeChange = (e) => {
   }
 }
 
+const openDetail = (row: object) => {
+  current.value = row;
+  channelPaytemplateShow(row.first_charge_template_id).then(res => {
+    dialogVisible.value = true;
+    detailData.value.firstTemplate = res.data.template_item_list
+  })
+  channelPaytemplateShow(row.not_first_charge_template_id).then(res => {
+    dialogVisible.value = true;
+    detailData.value.notFirstTemplate = res.data.template_item_list
+  })
+  console.log(detailData.value, 'detailData.valuedetailData.value');
+}
+
 const goToTtHuicHuan = (row: object) => {
   router.push({ path: '/payback/juliangAccount', query: { id: row.callback_config_id } })
 }
@@ -345,4 +442,94 @@ onMounted(() => {
     }
   }
 }
+
+.device-wrap {
+  width: 350px;
+  margin-left: 20px;
+  margin-top: 20px;
+
+  img {
+    width: 100%;
+    height: 100%;
+    border-bottom-left-radius: 40px;
+    border-bottom-right-radius: 40px;
+  }
+
+  .preview-list {
+    position: absolute;
+    top: 100px;
+    left: 0;
+    right: 0;
+    padding: 15px;
+    padding-top: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-flow: row wrap;
+  }
+
+  .pay-item {
+    width: 46%;
+    margin-right: 4%;
+    height: 80px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
+    background: #e6e6e6;
+    border-radius: 10px;
+    position: relative;
+    box-sizing: border-box;
+    overflow: hidden;
+
+    &.defalut {
+      border: 1px solid #fd555d;
+    }
+
+    .tipss {
+      position: absolute;
+      right: 0;
+      height: 20px;
+      line-height: 20px;
+      top: 0;
+      padding: 0 4px;
+      background-color: #fd555d;
+      color: #fff;
+      font-size: 12px;
+    }
+
+    &:nth-child(2n) {
+      margin-right: 0;
+    }
+
+    p {
+      width: 100%;
+      line-height: 20px;
+      color: #000;
+      font-size: 12px;
+      text-align: center;
+
+      &:first-child {
+        font-size: 14px;
+        font-weight: bold;
+
+        span {
+          display: inline-block;
+          padding: 0 2px;
+          background: #fd555d;
+          color: #fff;
+          font-size: 10px;
+          margin-left: 5px;
+          vertical-align: top;
+          transform: scale(0.8);
+        }
+      }
+
+      &:last-child {
+        color: #666;
+      }
+    }
+  }
+}
 </style>

src/views/videoManage/videoLibraryList/detail.vue

@@ -85,6 +85,33 @@
       <el-form-item label="入口章节" prop="series_sequence" :rules="[{ required: false, message: '入口章节必须填写' }]">
         <el-input disabled v-model="current.series_name" name="author" clearable />
       </el-form-item>
+      <el-form-item label="充值模板配置">
+        <template #label>
+          <div class="flex items-center">
+            <span class="mr-1 text-red-600">*</span>充值模板配置
+          </div>
+        </template>
+        <div class="items-center w-full withdraw-popup-warn">
+          <div>如果没有目标充值模板，请前往<span class="text-lg font-bold text-blue-400 cursor-pointer"
+              @click="toCharge">充值管理</span>进行添加</div>
+        </div>
+        <div class="flex flex-col">
+          <div class="flex items-center">
+            <div style="width:80px;text-align: end;" class="mb-3 mr-2">首充模板:</div>
+            <el-select v-model="formDataForm.first_charge_template_id" filterable remote clearable
+              :remote-method="(query) => { remoteMethod(query, 'firstCharge') }" placeholder="请选择首充模板">
+              <el-option v-for="(item, index) in firstTemplateList" :key="index" :label="item.name" :value="item.id" />
+            </el-select>
+          </div>
+          <div class="flex items-center">
+            <div style="width:80px;text-align: end;" class="mr-2">非首充模板:</div>
+            <el-select v-model="formDataForm.not_first_charge_template_id" filterable remote clearable
+              :remote-method="(query) => { remoteMethod(query, 'notFirstCharge') }" placeholder="请选择非首充模板">
+              <el-option v-for="(item, index) in nofirstTemplate" :key="index" :label="item.name" :value="item.id" />
+            </el-select>
+          </div>
+        </div>
+      </el-form-item>
       <div class="flex justify-end">
         <el-button type="primary" @click="submitForm(form)">{{
           $t('system.confirm')
@@ -102,6 +129,7 @@ import { useGetList } from '@/hook/curd/useGetList';
 import { useOpen } from '@/hook/curd/useOpen';
 import { FormInstance } from 'element-plus';
 import { tuiguangPromotionAdd } from '@/api/promotion/index'
+import { channelPaytemplateList } from '@/api/charge/index'
 const api = 'videoStock/episode/list';
 const props = defineProps({
   primary: String | Number,
@@ -118,6 +146,8 @@ const playVisible = ref(false)
 const linkVisible = ref(false)
 const { data, query, search, reset, loading } = useGetList(api);
 const { open, close, title, visible, id } = useOpen();
+const firstTemplateList = ref([])
+const nofirstTemplate = ref([])
 if (props.primary) {
   query.value.video_id = props.primary.id
   formDataForm.value.video_id = props.primary.id
@@ -128,6 +158,37 @@ const play = (e: object) => {
   current.value = e;
   playVisible.value = true;
 }
+
+const remoteMethod = (query: string, type: string,) => {
+  console.log(query, 'queryquery', type);
+  switch (type) {
+    case 'firstCharge':
+      initRemoteOption('firstCharge', { name: query })
+      break;
+    case 'notFirstCharge':
+      initRemoteOption('notFirstCharge', { name: query })
+      break;
+  }
+}
+const toCharge = () => {
+  router.push({ path: '/chargeManage/charge' })
+}
+
+const initRemoteOption = (type: string, params?: object) => {
+  switch (type) {
+    case 'firstCharge':
+      channelPaytemplateList({ limit: 999, type: 1, ...params }).then(res => {
+        firstTemplateList.value = res.data
+      })
+      break;
+    case 'notFirstCharge':
+      channelPaytemplateList({ limit: 999, type: 2, ...params }).then(res => {
+        nofirstTemplate.value = res.data
+      })
+      break;
+  }
+}
+
 const createLink = (e: object) => {
   current.value = e;
   formDataForm.value.series_sequence = e.series_sequence
@@ -135,7 +196,8 @@ const createLink = (e: object) => {
 }
 
 const submitForm = (formEl: FormInstance | undefined) => {
-  loading.value = true;
+  if (!formDataForm.value.first_charge_template_id) return ElMessage.error('请选择首充模板')
+  if (!formDataForm.value.not_first_charge_template_id) return ElMessage.error('请选择非首充模板')
   if (!formEl) return;
   formEl
     .validate(valid => {
@@ -143,12 +205,10 @@ const submitForm = (formEl: FormInstance | undefined) => {
         tuiguangPromotionAdd(formDataForm.value).then(res => {
           console.log(res, 'tuiguangPromotionAddtuiguangPromotionAdd');
           ElMessage.success(res.message)
-          loading.value = false;
           linkVisible.value = false;
           router.push({ path: '/promotion/promotionList', query: { tab: 0 } })
         })
       } else {
-        loading.value = false;
       }
     })
     .then(() => { });
@@ -156,6 +216,8 @@ const submitForm = (formEl: FormInstance | undefined) => {
 
 onMounted(() => {
   search();
+  initRemoteOption('firstCharge')
+  initRemoteOption('notFirstCharge')
 });
 </script>
 
@@ -173,4 +235,10 @@ video#my-player.video-js {
   word-wrap: break-word;
   word-break: break-all;
 }
+
+.withdraw-popup-warn {
+  margin-bottom: 10px;
+  font-weight: 600;
+  line-height: 1.8;
+}
 </style>

src/views/videoManage/videoLibraryList/index.vue

@@ -179,7 +179,6 @@ import moment from 'moment';
 import { videoStockVideoUpdate, videoStockVideoAdd, videoStockVideoCategoryList } from '@/api/video/index'
 import { useUserStore } from '@/stores/modules/user/index'
 import Cache from '@/support/cache';
-import { fa } from 'element-plus/es/locale';
 const ismulSet = ref(false)
 const api = 'videoStock/video/list';
 const addApi = 'contentManage/book/edit_author';

vite.config.js

@@ -76,7 +76,7 @@ export default defineConfig(({ command, mode }) => {
             enabledCollections: ['ep'] //@iconify-json/ep 是 Element Plus 的图标库
           }),
           // 自动导入 Element Plus 组件//dev环境会特别慢加上,build的时候可以放开
-          // ElementPlusResolver()
+          ElementPlusResolver()
         ],
         dirs: ['src/components/', 'src/layout/'],