pref:添加企业轮播图和视频上传,浏览和分享点击后展示弹窗内容

enterprise-manager-ui/admin/src/assets/utils/dateFormat.js

+export const timestampToTime = (timestamp, transLength) => {
+  // 时间戳为10位需*1000，时间戳为13位不需乘1000
+  let date = null;
+  if (timestamp) {
+    if (timestamp.length < 13) {
+      date = new Date(timestamp * 1000);
+    } else {
+      date = new Date(timestamp);
+    }
+    let Y = date.getFullYear() + "-";
+    let M =
+      date.getMonth() + 1 < 10
+        ? "0" + (date.getMonth() + 1)
+        : date.getMonth() + 1;
+    let D =
+      date.getDate() < 10 ? "-" + "0" + date.getDate() : "-" + date.getDate();
+    let h =
+      " " +
+      (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) +
+      ":";
+    let m =
+      (date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()) +
+      ":";
+    let s =
+      date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
+    switch (transLength) {
+      case 2:
+        return Y + M;
+      case 3:
+        return Y + M + D;
+      case 6:
+        return Y + M + D + h + m + s;
+    }
+  } else {
+    return "";
+  }
+};
+// 小时：分钟 ==》 转分钟
+
+export const transFormMinut = (String) => {
+  if (typeof String === "number") {
+    return;
+  }
+  if (!String) {
+    return 0;
+  }
+  let arr = String.split(":");
+  let hour =
+    arr[0].indexOf("0") === 0 ? arr[0].substring(1, arr[0].length) : arr[0];
+  let minu =
+    arr[1].indexOf("0") === 0 ? arr[1].substring(1, arr[1].length) : arr[1];
+  return hour * 60 + minu * 1;
+  // return JSON.stringify(hour * 60 + minu * 1);
+};
+// // 分钟 ==》 小时
+export const transFormTime = (num) => {
+  if (typeof num != "string" && num !== 0) {
+    return Math.floor(num / 60).toString() + ":" + (num % 60).toString();
+  } else {
+    return "0:00";
+  }
+};
+
+//当前月第一天
+export const getFirstDay = () => {
+  let y = new Date().getFullYear(); //获取年份
+  let m = new Date().getMonth() + 1; //获取月份
+  let d = "01";
+  m = m < 10 ? "0" + m : m; //月份补 0
+
+  return [y, m, d].join("-");
+};
+
+//当前月最后一天
+export const getLastDay = () => {
+  let y = new Date().getFullYear(); //获取年份
+  let m = new Date().getMonth() + 1; //获取月份
+  let d = new Date(y, m, 0).getDate(); //获取当月最后一日
+  m = m < 10 ? "0" + m : m; //月份补 0
+  d = d < 10 ? "0" + d : d; //日数补 0
+
+  return [y, m, d].join("-");
+};
+
+//获取两日期之间日期列表函数
+export const getdiffdate = (stime, etime) => {
+  //初始化日期列表，数组
+  let diffdate = new Array();
+  let i = 0;
+  //开始日期小于等于结束日期,并循环
+  while (stime <= etime) {
+    diffdate[i] = stime;
+    //获取开始日期时间戳
+    let stime_ts = new Date(stime).getTime();
+
+    //增加一天时间戳后的日期
+    let next_date = stime_ts + 24 * 60 * 60 * 1000;
+
+    //拼接年月日，这里的月份会返回（0-11），所以要+1
+    let next_dates_y = new Date(next_date).getFullYear() + "-";
+    let next_dates_m =
+      new Date(next_date).getMonth() + 1 < 10
+        ? "0" + (new Date(next_date).getMonth() + 1) + "-"
+        : new Date(next_date).getMonth() + 1 + "-";
+    let next_dates_d =
+      new Date(next_date).getDate() < 10
+        ? "0" + new Date(next_date).getDate()
+        : new Date(next_date).getDate();
+
+    stime = next_dates_y + next_dates_m + next_dates_d;
+
+    //增加数组key
+    i++;
+  }
+  return diffdate;
+};
+// 获取某个日期是周几
+export const getMyDay = (date) => {
+  let week;
+  if (date.getDay() == 0) week = "周日";
+  if (date.getDay() == 1) week = "周一";
+  if (date.getDay() == 2) week = "周二";
+  if (date.getDay() == 3) week = "周三";
+  if (date.getDay() == 4) week = "周四";
+  if (date.getDay() == 5) week = "周五";
+  if (date.getDay() == 6) week = "周六";
+  return week;
+};
+// 求两个日期的 分钟差
+export const getMinu = (s1, s2) => {
+  var reDate = /\d{4}-\d{1,2}-\d{1,2} /;
+  s1 = new Date((reDate.test(s1) ? s1 : "2023-01-01 " + s1).replace(/-/g, "/"));
+  s2 = new Date((reDate.test(s2) ? s2 : "2023-01-01 " + s2).replace(/-/g, "/"));
+  var ms = s2.getTime() - s1.getTime();
+  if (ms < 0) return 0;
+  return Math.floor(ms / 1000 / 60); //分钟
+};
+// 求两个日期的 秒差
+export const getSec = (s1, s2) => {
+  var reDate = /\d{4}-\d{1,2}-\d{1,2} /;
+  s1 = new Date((reDate.test(s1) ? s1 : "2023-01-01 " + s1).replace(/-/g, "/"));
+  s2 = new Date((reDate.test(s2) ? s2 : "2023-01-01 " + s2).replace(/-/g, "/"));
+  var ms = s2.getTime() - s1.getTime();
+  if (ms < 0) return 0;
+  return Math.floor(ms / 1000); //秒
+};

enterprise-manager-ui/admin/src/views/company/drawershow.vue

@@ -21,12 +21,15 @@
           v-model="form.companyName"
           placeholder="请输入企业名称"
         />
+      </el-row>
+      <el-row>
         <Field
           label="联系电话"
           prop="contactPhone"
           v-model="form.contactPhone"
           placeholder="请输入联系电话"
         />
+      </el-row>
       <!-- <Field label="公司编码" prop="companyCode" v-model="form.companyCode" placeholder="请输入公司编码"/>
                             <Field label="注册号" prop="registrationNumber" v-model="form.registrationNumber" placeholder="请输入注册号"/>
                             <Field label="法定代表人" prop="legalRepresentative" v-model="form.legalRepresentative" placeholder="请输入法定代表人"/>
@@ -37,7 +40,7 @@
                               <p>当前选中的行政区划编码为： {{regionCodeList}}</p>
                               <el-cascader  v-model="regionCodeList" :props="areaprops"></el-cascader>
         </Field>-->
-
+      <el-row>
         <Field
           :span="24"
           label="经营地址"
@@ -50,13 +53,15 @@
             @addressSelect="addressSelect"
           ></area-select>
         </Field>
-
+      </el-row>
+      <el-row>
         <!-- <Field label="所在地" prop="location" v-model="form.location" placeholder="请输入所在地"/> -->
         <Field
           prop="location"
           v-model="form.location"
           placeholder="请输入详细地址"
         />
+      </el-row>
       <!-- <Field label="电子邮件地址" prop="email" v-model="form.email" placeholder="请输入电子邮件地址"/>
                             <Field label="公司网站" prop="website" v-model="form.website" placeholder="请输入公司网站"/>
                             <Field label="税务登记号" prop="taxRegistrationNumber" v-model="form.taxRegistrationNumber" placeholder="请输入税务登记号"/>
@@ -72,10 +77,27 @@
       <!-- <Field label="公司文化" prop="companyCulture" v-model="form.companyCulture" type="textarea" placeholder="请输入公司文化"/>
                             <Field label="排序" prop="sort" v-model="form.sort" type="num" placeholder="请输入排序"/>
         <Field label="成立日期" prop="establishDate" v-model="form.establishDate" type="date" />-->
-
+      <el-row>
         <Field :span="24" label="企业logo">
           <imageUpload v-model="form.logoPath" prePath="/file/preview" />
         </Field>
+      </el-row>
+      <el-row>
+        <Field :span="24" label="企业背景图">
+          <imageUpload v-model="form.background" prePath="/file/preview" />
+        </Field>
+      </el-row>
+      <el-row>
+        <!-- <Field
+          :span="24"
+          label="企业标签"
+          prop="companyLabelsList"
+          type="select"
+          :multiple="true"
+          :enumData="dict.labels"
+          v-model="form.companyLabelsList"
+          placeholder="请选择产品分类"
+        /> -->
         <Field :span="24" label="企业标签">
           <el-select
             v-model="companyLabelsList"
@@ -91,6 +113,26 @@
             ></el-option>
           </el-select>
         </Field>
+      </el-row>
+      <el-row>
+        <Field label="轮播图">
+          <imageUpload
+            v-model="form.companyPicPath"
+            prePath="/file/preview"
+            :isList="true"
+            ref="imgList"
+          />
+        </Field>
+      </el-row>
+      <el-row>
+        <Field label="短视频"
+          ><fileUpload
+            v-model="form.companyVideoPath"
+            :fileType="['mp4', 'avi']"
+            prePath="/file/fileupload"
+        /></Field>
+      </el-row>
+      <el-row>
         <Field label="公司介绍">
           <editor v-model="form.companyIntroduction" :min-height="150" />
         </Field>
@@ -285,7 +327,6 @@ export default {
         ],
         logoPath: [
           { required: true, message: "请输入企业logo", trigger: "blur" },
-          { max: 128, message: "最多只能录入128个字符", trigger: "blur" },
         ],
         establishDate: [{ required: true, message: "请选择成立日期" }],
         createTime: [{ required: true, message: "请选择创建时间" }],
@@ -414,6 +455,15 @@ export default {
     cancel() {
       this.open = false;
     },
+    beforeSubmit(data) {
+      // data.companyLabelsList = data.companyLabelsList.join(",");
+      let arr = [];
+      arr = this.$refs.imgList.imgList.map((v) => {
+        return v.response ? v.response.url : v.url.substr(v.url.indexOf("f"));
+      });
+      data.companyPicPath = arr.join(",");
+      return data;
+    },
     /**获取数据后弹框 */
     afterRender(data) {
       this.open = true;
@@ -452,6 +502,7 @@ export default {
         lon: "",
         lati: "",
         logoPath: "",
+        background: "",
         companyVideoPath: "",
         companyPicPath: "",
         companyIntroduction: "",

enterprise-manager-ui/admin/src/views/news/list.vue

 <template>
   <div class="page">
-        <LayoutTable :data="tableData" :config="tableConfig" notDel>
-                    </LayoutTable>
-
+    <LayoutTable :data="tableData" :config="tableConfig" notDel> </LayoutTable>
 
     <drawer-show ref="drawerform" @ok="getData" />
-        <drawer-view ref="drawerview" @handletop="handleTop" @del="toDel"/>
+    <share-drawershow
+      ref="shareDrawershow"
+      :drawerTableData="drawerTableData"
+    />
+    <drawer-view ref="drawerview" @handletop="handleTop" @del="toDel" />
   </div>
 </template>
 
 <script>
-    /** 表单弹出框模式需引入 */
-    import drawerShow from "./drawershow";
-    import drawerView from "./drawerview";
-    import table from "@/assets/mixins/table";
-    export default {
+/** 表单弹出框模式需引入 */
+import drawerShow from "./drawershow";
+import drawerView from "./drawerview";
+import table from "@/assets/mixins/table";
+import ShareDrawershow from "./shareDrawershow.vue";
+export default {
   name: "NewsList",
   components: {
     drawerShow,
-            drawerView
-},
-        mixins: [table],
-        created() {
+    drawerView,
+    ShareDrawershow,
   },
+  mixins: [table],
+  created() {},
   methods: {
     /** 重写新增方法 */
     toAdd(row) {
@@ -33,82 +36,90 @@
       this.$refs.drawerform.edit(row);
     },
     /** 重写查看方法 */
-            toView(row,isopen) {
+    toView(row, isopen) {
       // this.$refs.drawerform.view(row);
       // 这里查看不再和编辑共用界面，多写一个抽屉，但调用view方法接口
       // this.$refs.drawerform.reset()
       this.$refs.drawerform.query = { id: row.id };
-                this.$refs.drawerform.urls.currUrl ="news/view";
+      this.$refs.drawerform.urls.currUrl = "news/view";
 
-                this.$refs.drawerform.$get('news/view', this.$refs.drawerform.query)
+      this.$refs.drawerform
+        .$get("news/view", this.$refs.drawerform.query)
         .then(({ data }) => {
-                  if(!isopen){
-                    this.$refs.drawerview.open = true
+          if (!isopen) {
+            this.$refs.drawerview.open = true;
           }
-                  this.$refs.drawerview.form = data.entity
-                })
-                .catch(error => {
-                  this.$refs.drawerview.form = {}
-                  this.$message.error(error.message)
-                  throw error
+          this.$refs.drawerview.form = data.entity;
         })
-
+        .catch((error) => {
+          this.$refs.drawerview.form = {};
+          this.$message.error(error.message);
+          throw error;
+        });
     },
 
-          handleTop(row,top) {
-
-              this.$post("/news/save",{id:row.id,top:top}).then((res) => {
+    handleTop(row, top) {
+      this.$post("/news/save", { id: row.id, top: top })
+        .then((res) => {
           if (res.code == 1) {
-                  if(top==0){
+            if (top == 0) {
               this.$message.success("取消置顶成功！");
-                  }else{
+            } else {
               this.$message.success("置顶成功！");
             }
-                  this.toView({id:row.id},true)
+            this.toView({ id: row.id }, true);
             this.getData();
           }
         })
         .catch((error) => {
           this.$message.error(error.message);
         });
-
     },
 
     handleViews(row) {
       //查询详细
-            this.$post("/news/record/list",{newsId:row.id}).then((res) => {
+      this.$post("/news/record/list", { newsId: row.id })
+        .then((res) => {
           if (res.code == 1) {
-                console.log("views-data",res)
-                this.getData();
+            console.log("views-data", res);
+            // this.getData();
+            this.drawerTableData = res.data;
+            this.drawerTableData.row = row;
+            this.drawerTableData.title = "浏览";
+            this.$refs.shareDrawershow.open = true;
           }
-            }).catch((error) => {
+        })
+        .catch((error) => {
           this.$message.error(error.message);
         });
-
     },
 
-
     handleShares(row) {
       //分享详细
-            this.$post("/news/share/list",{newsId:row.id}).then((res) => {
+      this.$post("/news/share/list", { newsId: row.id })
+        .then((res) => {
           if (res.code == 1) {
-                console.log("shares-data",res)
-                this.getData();
+            this.drawerTableData = res.data;
+            this.drawerTableData.row = row;
+            this.drawerTableData.title = "分享";
+            this.$refs.shareDrawershow.open = true;
           }
-            }).catch((error) => {
+        })
+        .catch((error) => {
           this.$message.error(error.message);
         });
     },
   },
   data() {
     return {
+      drawerTableData: [],
       config: {
         search: [
           {
             name: "categoryId",
             type: "select",
-                            placeholder:"请选择新闻类型",
-                            label: "新闻类型"
+            placeholder: "请选择新闻类型",
+            label: "新闻类型",
           },
           {
             name: "title",
@@ -119,44 +130,67 @@
         ],
         columns: [
           // {type: "selection", width: 60},
-                        {type: "index",label: "序号",width: 50},
+          { type: "index", label: "序号", width: 50 },
 
-                      {label: "新闻标题", prop: "title"},
+          { label: "新闻标题", prop: "title" },
 
-                        {label: "新闻类型", prop: "categoryId",formatter: this.formatter},
+          { label: "新闻类型", prop: "categoryId", formatter: this.formatter },
 
-                      {label: "创建时间", prop: "createDateTime", formatter: this.formatterDate},
+          {
+            label: "创建时间",
+            prop: "createDateTime",
+            formatter: this.formatterDate,
+          },
 
-                        {label: "数据",formatter:  row => {
-                          let bool=false;
+          {
+            label: "数据",
+            formatter: (row) => {
+              let bool = false;
               return (
                 <div>
-                                  <el-link underline={bool} onClick={() => {
+                  <el-link
+                    underline={bool}
+                    onClick={() => {
                       this.handleViews(row);
-                                  }}  type="primary">浏览({row.viewNums})</el-link><br/>
+                    }}
+                    type="primary"
+                  >
+                    浏览({row.viewNums})
+                  </el-link>
+                  <br />
 
-                                  <el-link underline={bool} onClick={() => {
+                  <el-link
+                    underline={bool}
+                    onClick={() => {
                       this.handleShares(row);
-                                  }}  type="primary">分享({row.shareNums})</el-link>
+                    }}
+                    type="primary"
+                  >
+                    分享({row.shareNums})
+                  </el-link>
                 </div>
-                            );}},
-
+              );
+            },
+          },
 
-                        {label: "创建用户", prop: "createUserId", formatter: this.formatter},
+          {
+            label: "创建用户",
+            prop: "createUserId",
+            formatter: this.formatter,
+          },
           {
             label: "操作",
             width: 240,
-                            formatter: row => {
+            formatter: (row) => {
               return (
                 <div>
-
                   {row.top === 0 ? (
                     <el-button
                       size="mini"
                       type="text"
                       icon="el-icon-open"
                       onClick={() => {
-                                                this.handleTop(row,1);
+                        this.handleTop(row, 1);
                       }}
                     >
                       置顶
@@ -167,7 +201,7 @@
                       type="text"
                       icon="el-icon-open"
                       onClick={() => {
-                                                this.handleTop(row,0);
+                        this.handleTop(row, 0);
                       }}
                     >
                       取消置顶
@@ -181,14 +215,13 @@
                     onView={this.toView}
                     onDel={this.toDel}
                   />
-
                 </div>
               );
-                            }
-                        }
-                    ]
-                }
-            };
-        }
+            },
+          },
+        ],
+      },
     };
+  },
+};
 </script>

enterprise-manager-ui/admin/src/views/news/shareDrawershow.vue

+<template>
+  <!-- 弹出框表单 -->
+  <el-drawer
+    :visible.sync="open"
+    :direction="direction"
+    :destroy-on-close="true"
+    size="40%"
+  >
+    <div slot="title" class="title">
+      <h4
+        :class="activeTitle == 0 ? 'title_text active' : 'title_text'"
+        @click="handleTitle(0)"
+      >
+        浏览（{{ drawerTableData.row ? drawerTableData.row.viewNums : 0 }}）
+      </h4>
+      <h4
+        :class="activeTitle == 1 ? 'title_text active' : 'title_text'"
+        @click="handleTitle(1)"
+      >
+        分享（{{ drawerTableData.row ? drawerTableData.row.shareNums : 0 }}）
+      </h4>
+    </div>
+    <div class="form">
+      <el-table :data="tableData.data" border style="width: 100%">
+        <el-table-column type="index" width="50" label="序号">
+        </el-table-column>
+        <el-table-column prop="viewName" label="浏览人员"> </el-table-column>
+        <el-table-column prop="sumViews" label="浏览次数"> </el-table-column>
+        <el-table-column prop="viewTime" label="最近浏览时间">
+          <template slot-scope="scope">
+            <span>{{ timeFix(scope.row.viewTime) }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="block">
+        <el-pagination
+          @current-change="handleCurrentChange"
+          :current-page.sync="tableData.current_page"
+          :page-size="10"
+          layout="total, prev, pager, next"
+          :total="tableData.total"
+        >
+        </el-pagination>
+      </div>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+import form from "@/assets/mixins/formdialog";
+import { timestampToTime } from "@/assets/utils/dateFormat.js";
+export default {
+  name: "NewsDetail",
+  props: {
+    drawerTableData: {
+      type: Object,
+      default: {},
+    },
+  },
+  mixins: [form],
+  components: {},
+  computed: {
+    timeFix(val) {
+      console.log(val);
+      return (val) => {
+        let time = timestampToTime(val, 6);
+        return time;
+      };
+    },
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: false,
+      // 弹出层标题
+      title: "新闻",
+      // 是否显示弹出层
+      open: false,
+      tableData: [],
+      activeTitle: 0,
+    };
+  },
+
+  methods: {
+    // 标题切换操作
+    handleTitle(i) {
+      this.activeTitle = i;
+      this.activeTitle == 0 ? this.handleView() : this.handleShare();
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+      this.activeTitle == 0 ? this.handleView(val) : this.handleShare(val);
+    },
+    //查询详细
+    handleView(val = 1) {
+      this.$post("/news/record/list", {
+        newsId: this.drawerTableData.row.id,
+        page: val,
+      })
+        .then((res) => {
+          if (res.code == 1) {
+            this.tableData = res.data;
+          }
+        })
+        .catch((error) => {
+          this.$message.error(error.message);
+        });
+    },
+    //分享详细
+    handleShare(val = 1) {
+      this.$post("/news/share/list", {
+        newsId: this.drawerTableData.row.id,
+        page: val,
+      })
+        .then((res) => {
+          if (res.code == 1) {
+            console.log("shares-data", res);
+            this.tableData = res.data;
+          }
+        })
+        .catch((error) => {
+          this.$message.error(error.message);
+        });
+    },
+    /** 编辑 */
+    edit(row) {
+      this.reset();
+      this.query = { id: row.id };
+      this.urls.currUrl = "news/edit";
+      this.getData();
+      this.pageInfo.type = "edit";
+      this.title = "修改新闻";
+    },
+    /** 新增 */
+    add(row) {
+      this.reset();
+      this.urls.currUrl = "news/add";
+      this.getData();
+      this.pageInfo.type = "add";
+      this.title = "新增新闻";
+    },
+    /** 查看*/
+    view(row) {
+      this.reset();
+      this.query = { id: row.id };
+      this.urls.currUrl = "news/view";
+      this.getData();
+      this.pageInfo.type = "view";
+      this.title = "新闻详细";
+    },
+    /**取消按钮 */
+    cancel() {
+      this.open = false;
+    },
+    /**获取数据后弹框 */
+    afterRender(data) {
+      this.open = true;
+    },
+  },
+  watch: {
+    open: {
+      handler(val) {
+        if (val) {
+          this.tableData = this.drawerTableData;
+          console.log(this.drawerTableData);
+          this.drawerTableData.title == "浏览"
+            ? (this.activeTitle = 0)
+            : (this.activeTitle = 1);
+        }
+      },
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.footerbtns {
+  margin-top: 20px;
+  padding-top: 20px;
+  border-top: 1px solid gainsboro;
+  display: flex;
+  justify-content: center;
+  align-content: center;
+}
+.form {
+  width: 100%;
+  padding: 20px;
+}
+.title {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  .title_text {
+    width: 20%;
+    color: #333;
+    opacity: 0.5;
+    cursor: pointer;
+  }
+  .active {
+    opacity: 1;
+    color: #333;
+  }
+}
+.block {
+  width: 100%;
+  text-align: end;
+}
+</style>
\ No newline at end of file