'styling'
This commit is contained in:
parent
85fdecf8f2
commit
b069df452c
430
js/dir_app.js
430
js/dir_app.js
|
|
@ -101,8 +101,18 @@ const TQuestion = Vue.component('field', {
|
|||
"answer": function(val,Oldval) { this.a = val },
|
||||
"a": function (val, oldVal) {
|
||||
this.$root.events.trigger('changed',[this.qid,this.table, val, this.targetid]) }, },
|
||||
template: `<div class="pure-control-group"><label v-if="this.question" :for="this.qid" class="question">{{ question }}</label>
|
||||
<input :id="this.qid" type="text" class="form-control" v-model="a" :placeholder="placeholder" /></div>`,
|
||||
template: `<div class="mb-4">
|
||||
<label v-if="question" :for="qid" class="block text-sm font-medium text-gray-700 mb-1">
|
||||
{{ question }}
|
||||
</label>
|
||||
<input
|
||||
:id="qid"
|
||||
type="text"
|
||||
v-model="a"
|
||||
:placeholder="placeholder"
|
||||
class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50 p-2 text-sm"
|
||||
/>
|
||||
</div>`,
|
||||
})
|
||||
|
||||
// A single INLINE text style question
|
||||
|
|
@ -144,8 +154,17 @@ const TAQuestion = Vue.component('tfield', {
|
|||
this.$root.events.trigger('changed',[this.qid,this.table, val, this.targetid]) },
|
||||
"answer": function (val, oldVal) { this.a = val },
|
||||
},
|
||||
template: `<div class="pure-control-group"><label :for="this.qid" class="question">{{ question }} </label>
|
||||
<textarea :id="this.qid" :class="this.myclass" v-model="a"></textarea></div>` })
|
||||
template: `<div class="mb-4">
|
||||
<label :for="qid" class="block text-sm font-medium text-gray-700 mb-1">
|
||||
{{ question }}
|
||||
</label>
|
||||
<textarea
|
||||
:id="qid"
|
||||
v-model="a"
|
||||
:class="myclass"
|
||||
class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50 p-2 text-sm"
|
||||
></textarea>
|
||||
</div>` })
|
||||
|
||||
|
||||
|
||||
|
|
@ -162,7 +181,7 @@ const HTAQuestion = Vue.component('htfield', {
|
|||
watch: {
|
||||
"answer": function (val, oldVal) { this.p.content.innerHTML = val }, },
|
||||
template: `<div><label :for="this.qid" class="question">{{ question }} </label>
|
||||
<div :id="this.qid" class="pure-control-group pell"></div></div>` })
|
||||
<div :id="this.qid" class="pell"></div></div>` })
|
||||
|
||||
// long format text WYSIWYG HTML FORM ALIGNED STYLE
|
||||
const HTAQuestionFA = Vue.component('htfield_fa', {
|
||||
|
|
@ -176,8 +195,8 @@ const HTAQuestionFA = Vue.component('htfield_fa', {
|
|||
self.p.content.innerHTML = self.answer },
|
||||
watch: {
|
||||
"answer": function (val, oldVal) { this.p.content.innerHTML = val }, },
|
||||
template: `<div class="pure-control-group"><label :for="this.qid" class="question">{{ question }} </label>
|
||||
<div :id="this.qid" class="pure-control-group form-control pell"></div></div>` })
|
||||
template: `<div class=""><label :for="this.qid" class="question">{{ question }} </label>
|
||||
<div :id="this.qid" class="form-control pell"></div></div>` })
|
||||
|
||||
// A single numeric question
|
||||
const NQuestioon = Vue.component('n-question', {
|
||||
|
|
@ -243,9 +262,20 @@ const SelMenu = Vue.component('selectmenu', {
|
|||
"a": function (val, oldVal) {
|
||||
this.$root.events.trigger('changed',[this.qid,this.table, val, this.targetid]) },
|
||||
"answer": function (val, oldVal) { this.a = val }, },
|
||||
template: `<select :id="this.qid" v-model="a" class="pure-input-1-12">
|
||||
<option v-for="o in this.$root[menu]" :value="o.id">{{o[labelfield]}}</option>
|
||||
</select>` })
|
||||
template: `<div class="mb-4">
|
||||
<label :for="qid" class="block text-sm font-medium text-gray-700 mb-1">
|
||||
{{ question }}
|
||||
</label>
|
||||
<select
|
||||
:id="qid"
|
||||
v-model="a"
|
||||
class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50 p-2 text-sm bg-white"
|
||||
>
|
||||
<option v-for="o in $root[menu]" :value="o.id">
|
||||
{{ o[labelfield] }}
|
||||
</option>
|
||||
</select>
|
||||
</div>` })
|
||||
|
||||
|
||||
// Select menu FORM ALIGNED STYLE
|
||||
|
|
@ -256,10 +286,20 @@ const SelMenuFA = Vue.component('selectmenu_fa', {
|
|||
"a": function (val, oldVal) {
|
||||
this.$root.events.trigger('changed',[this.qid,this.table, val, this.targetid]) },
|
||||
"answer": function (val, oldVal) { this.a = val }, },
|
||||
template: `<div class="pure-control-group"><label :for="this.qid" class="question">{{ question }} </label>
|
||||
<select :id="this.qid" v-model="a" class="form-control pure-input-1-12">
|
||||
<option v-for="o in this.$root[menu]" :value="o.id">{{o[labelfield]}}</option>
|
||||
</select></div>` })
|
||||
template: `<div class="mb-4">
|
||||
<label :for="qid" class="block text-sm font-medium text-gray-700 mb-1">
|
||||
{{ question }}
|
||||
</label>
|
||||
<select
|
||||
:id="qid"
|
||||
v-model="a"
|
||||
class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50 p-2 text-sm bg-white"
|
||||
>
|
||||
<option v-for="o in $root[menu]" :value="o.id">
|
||||
{{ o[labelfield] }}
|
||||
</option>
|
||||
</select>
|
||||
</div>` })
|
||||
|
||||
|
||||
// A date time picker
|
||||
|
|
@ -272,8 +312,18 @@ const DTPicker = Vue.component('dtpicker', {
|
|||
"answer": function(val,Oldval) { this.a = val },
|
||||
"a": function (val, oldVal) {
|
||||
this.$root.events.trigger('changed',[this.qid,this.table, val, this.targetid]) }, },
|
||||
template: `<div class="pure-control-group"><label v-if="this.question" :for="this.qid" class="question">{{ question }}</label>
|
||||
<input type="datetime-local" :id="this.qid" class="form-control" v-model="a" step="300" /></div>`,
|
||||
template: `<div class="mb-4">
|
||||
<label v-if="question" :for="qid" class="block text-sm font-medium text-gray-700 mb-1">
|
||||
{{ question }}
|
||||
</label>
|
||||
<input
|
||||
type="datetime-local"
|
||||
:id="qid"
|
||||
v-model="a"
|
||||
step="300"
|
||||
class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50 p-2 text-sm"
|
||||
/>
|
||||
</div>`,
|
||||
})
|
||||
|
||||
|
||||
|
|
@ -655,7 +705,7 @@ const ActivityEditor = Vue.component('activityedit', {
|
|||
function(r2) {
|
||||
self.everyone = r2.users
|
||||
_.each( self.everyone, function(x) {
|
||||
x.hostid = x.id } )
|
||||
x.hostid = x.hostid } )
|
||||
self.everyname = _.pluck(r2.users,'name') } ) },
|
||||
fetch_myevents: function() {
|
||||
var self = this;
|
||||
|
|
@ -669,7 +719,8 @@ const ActivityEditor = Vue.component('activityedit', {
|
|||
self.this_activity.starttime = self.this_activity.starttime.replace(' ','T')} )
|
||||
basic_get('dir_api.php?a=get/hosts',
|
||||
function(r2) {
|
||||
self.hosts_by_sesid = _.groupBy(r2,function(x) { return x.id } )
|
||||
var filtered = r2.filter(x => x.hostid != null)
|
||||
self.hosts_by_sesid = _.groupBy(filtered,function(x) { return x.id } )
|
||||
self.this_hosts = self.hosts_by_sesid[ self.my_activity ]
|
||||
} )
|
||||
},
|
||||
|
|
@ -703,7 +754,7 @@ const ActivityEditor = Vue.component('activityedit', {
|
|||
qid="mode" :answer="this_activity.mode" menu="modes_menu"
|
||||
:targetid="this_activity.id" question="What mode?" labelfield="string"></selectmenu_fa>
|
||||
<field myclass="double" table="conf_sessions" qid="length" :answer="this_activity.length"
|
||||
:targetid="this_activity.id" question="Length (in hours)" placeholder="1"></field>
|
||||
:targetid="this_activity.id" question="Length (in hours or minutes)" placeholder="1"></field>
|
||||
<selectmenu_fa table="conf_sessions" qid="type" :answer="this_activity.type" menu="sessiontypes_menu"
|
||||
:targetid="this_activity.id" question="Type" labelfield="type"></selectmenu_fa>
|
||||
<selectmenu_fa v-if="this_activity.type=='101'" table="conf_sessions"
|
||||
|
|
@ -712,36 +763,56 @@ const ActivityEditor = Vue.component('activityedit', {
|
|||
<field myclass="double" table="conf_sessions" qid="recording" :answer="this_activity.recording"
|
||||
:targetid="this_activity.id" question="Recording Link" placeholder=""></field>
|
||||
<br />
|
||||
<div v-if="!creating" class="pure-control-group double">
|
||||
<label class="fake_pcg">Hosts</label>
|
||||
<div class="fake_pcg">
|
||||
<span v-for="h in this_hosts">{{h.name}}
|
||||
<span class="clicky" v-on:click="remove(h.hostid)">x</span> <br /></span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!creating" class="pure-control-group double">
|
||||
<label class="">Add a host</label>
|
||||
<div class="fake_pcg">
|
||||
<form autocomplete="off">
|
||||
<input type="text" id="addhost" name="addhost" class="form-control"
|
||||
v-on:keyup="hostlookup" v-model="host_search_str" />
|
||||
</form>
|
||||
<div>
|
||||
<span v-for="ho in host_search">{{ho.name}}
|
||||
<span class="clicky" v-on:click="add(ho.id)">+</span> <br /></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="creating" class="pure-control-group double">
|
||||
<label class=""></label>
|
||||
<div class="fake_pcg">
|
||||
<button class="pure-button pure-button-primary form-control" v-on:click="save_new_event">
|
||||
Create Activity
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Existing Hosts List -->
|
||||
<div v-if="!creating" class="mb-4">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">Hosts</label>
|
||||
<div class="border rounded-md p-3 bg-gray-50">
|
||||
<i v-if="this_hosts.length==0">type below to add a host</i>
|
||||
<div v-for="h in this_hosts" class="flex items-center justify-between text-sm mb-1">
|
||||
<span>{{ h.name }}</span>
|
||||
<button
|
||||
type="button"
|
||||
@click="remove(h.hostid)"
|
||||
class="text-red-500 hover:text-red-700 font-semibold"
|
||||
>
|
||||
x
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Add Host Section -->
|
||||
<div v-if="!creating" class="mb-4">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">Add a host</label>
|
||||
<input
|
||||
type="text"
|
||||
id="addhost"
|
||||
name="addhost"
|
||||
v-model="host_search_str"
|
||||
@keyup="hostlookup"
|
||||
autocomplete="off"
|
||||
class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 focus:ring-opacity-50 p-2 text-sm mb-2"
|
||||
/>
|
||||
<div class="border rounded-md p-3 bg-gray-50">
|
||||
<div v-for="ho in host_search" class="flex items-center justify-between text-sm mb-1">
|
||||
<span
|
||||
@click="add(ho.id)"
|
||||
class="clickme">
|
||||
{{ ho.name }}</span>
|
||||
<button
|
||||
type="button"
|
||||
@click="add(ho.id)"
|
||||
class="text-blue-500 hover:text-blue-700 font-semibold"
|
||||
>
|
||||
+
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- add: permissions track, x day if pd day
|
||||
x add/remove host x New activity general list & signup
|
||||
|
|
@ -835,94 +906,209 @@ const ActivityInlineEditor = Vue.component('activityinlineedit', {
|
|||
basic_get('dir_api.php?a=get/hosts',
|
||||
function(r2) {
|
||||
self.hosts_by_sesid = _.groupBy(r2,function(x) { return x.id } )
|
||||
self.this_hosts = self.hosts_by_sesid[ self.my_activity ]
|
||||
var unfiltered = self.hosts_by_sesid[ self.my_activity ]
|
||||
self.this_hosts = unfiltered.filter(x => x.hostid != null)
|
||||
} )
|
||||
},
|
||||
},
|
||||
template: `<div class="">
|
||||
<div v-if="editing" class="pure-g pure-form pure-form-aligned">
|
||||
<div class="pure-u-5-24">
|
||||
<a v-on:click.prevent="editing=0" href="#" class="button-inlist-action">Done</a>
|
||||
</div>
|
||||
<div class="pure-u-1-24"></div>
|
||||
<div class="pure-u-23-24">
|
||||
<field myclass="double" table="conf_sessions" qid="title" :answer="this_activity.title"
|
||||
:targetid="this_activity.id" question="Title" placeholder="Title"></field>
|
||||
<dtpicker table="conf_sessions" qid="starttime" :answer="this_activity.starttime"
|
||||
:targetid="this_activity.id" question="Starts at"></dtpicker>
|
||||
<field myclass="double" table="conf_sessions" qid="length" :answer="this_activity.length"
|
||||
:targetid="this_activity.id" question="Length (in hours)" placeholder="1"></field>
|
||||
<div v-if="editing" class="bg-white rounded-lg shadow p-4 mb-6">
|
||||
<!-- Top action bar -->
|
||||
<div class="flex justify-end mb-4">
|
||||
<button
|
||||
@click.prevent="editing = 0"
|
||||
class="text-sm text-blue-600 hover:underline font-medium"
|
||||
>
|
||||
Done
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<selectmenu_fa table="conf_sessions"
|
||||
qid="mode" :answer="this_activity.mode" menu="modes_menu"
|
||||
:targetid="this_activity.id" question="What mode?" labelfield="string"></selectmenu_fa>
|
||||
<!-- Form fields -->
|
||||
<div class="space-y-4">
|
||||
<field
|
||||
myclass="double"
|
||||
table="conf_sessions"
|
||||
qid="title"
|
||||
:answer="this_activity.title"
|
||||
:targetid="this_activity.id"
|
||||
question="Title"
|
||||
placeholder="Title"
|
||||
/>
|
||||
|
||||
<field myclass="double" table="conf_sessions" qid="location" :answer="this_activity.location"
|
||||
:targetid="this_activity.id" question="Location / Zoom" placeholder="Location"></field>
|
||||
<field myclass="double" table="conf_sessions" qid="location_irl" :answer="this_activity.location_irl"
|
||||
:targetid="this_activity.id" question="Location / In Person" placeholder="Location"></field>
|
||||
<dtpicker
|
||||
table="conf_sessions"
|
||||
qid="starttime"
|
||||
:answer="this_activity.starttime"
|
||||
:targetid="this_activity.id"
|
||||
question="Starts at"
|
||||
/>
|
||||
|
||||
<div v-if="!creating" class="pure-control-group double">
|
||||
<label class="fake_pcg">Hosts</label>
|
||||
<div class="fake_pcg">
|
||||
<span v-for="h in this_hosts">{{h.name}}
|
||||
<span class="clicky" v-on:click="remove(h.hostid)">x</span> <br /></span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!creating" class="pure-control-group double">
|
||||
<label class="">Add a host</label>
|
||||
<div class="fake_pcg">
|
||||
<form autocomplete="off">
|
||||
<input type="text" id="addhost" name="addhost" class="form-control"
|
||||
v-on:keyup="hostlookup" v-model="host_search_str" />
|
||||
</form>
|
||||
<div>
|
||||
<span v-for="ho in host_search">{{ho.name}}
|
||||
<span class="clicky" v-on:click="add(ho.id)">+</span> <br /></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<field
|
||||
myclass="double"
|
||||
table="conf_sessions"
|
||||
qid="length"
|
||||
:answer="this_activity.length"
|
||||
:targetid="this_activity.id"
|
||||
question="Length (in hours)"
|
||||
placeholder="1"
|
||||
/>
|
||||
|
||||
<selectmenu_fa
|
||||
table="conf_sessions"
|
||||
qid="mode"
|
||||
:answer="this_activity.mode"
|
||||
menu="modes_menu"
|
||||
:targetid="this_activity.id"
|
||||
question="What mode?"
|
||||
labelfield="string"
|
||||
/>
|
||||
|
||||
<htfield_fa table="conf_sessions" qid="desc" question="Description" myclass="pell"
|
||||
:answer="this_activity.desc" :targetid="this_activity.id"></htfield_fa>
|
||||
<field
|
||||
myclass="double"
|
||||
table="conf_sessions"
|
||||
qid="location"
|
||||
:answer="this_activity.location"
|
||||
:targetid="this_activity.id"
|
||||
question="Location / Zoom"
|
||||
placeholder="Location"
|
||||
/>
|
||||
|
||||
<selectmenu_fa table="conf_sessions" qid="type" :answer="this_activity.type" menu="sessiontypes_menu"
|
||||
:targetid="this_activity.id" question="Type" labelfield="type"></selectmenu_fa>
|
||||
<selectmenu_fa v-if="this_activity.type=='101'" table="conf_sessions"
|
||||
qid="parent" :answer="this_activity.parent" menu="parents_menu"
|
||||
:targetid="this_activity.id" question="What flex day?" labelfield="title"></selectmenu_fa>
|
||||
<field myclass="double" table="conf_sessions" qid="recording" :answer="this_activity.recording"
|
||||
:targetid="this_activity.id" question="Recording Link" placeholder=""></field>
|
||||
<br />
|
||||
<field
|
||||
myclass="double"
|
||||
table="conf_sessions"
|
||||
qid="location_irl"
|
||||
:answer="this_activity.location_irl"
|
||||
:targetid="this_activity.id"
|
||||
question="Location / In Person"
|
||||
placeholder="Location"
|
||||
/>
|
||||
|
||||
<div v-if="creating" class="pure-control-group double">
|
||||
<label class=""></label>
|
||||
<div class="fake_pcg">
|
||||
<button class="pure-button pure-button-primary form-control" v-on:click="save_new_event">
|
||||
Create Activity
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Host List -->
|
||||
<div v-if="!creating">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">Hosts</label>
|
||||
<div class="border rounded-md p-3 bg-gray-50 space-y-1">
|
||||
<div
|
||||
v-for="h in this_hosts"
|
||||
:key="h.hostid"
|
||||
class="flex items-center justify-between text-sm"
|
||||
>
|
||||
<span>{{ h.name }}</span>
|
||||
<button
|
||||
type="button"
|
||||
@click="remove(h.hostid)"
|
||||
class="text-red-500 hover:text-red-700 font-semibold"
|
||||
>
|
||||
×
|
||||
</button>
|
||||
</div>
|
||||
<div v-else class="pure-g pure-form">
|
||||
<div class="pure-u-5-24">
|
||||
<a v-on:click.prevent="editing=1" href="#" class="button-inlist-action">Edit</a>
|
||||
</div>
|
||||
<div class="pure-u-19-24">
|
||||
<b>{{this_activity.title}}</b><br />
|
||||
{{ $root.$dj(this_activity.starttime).format('h:mma') }} / {{ this_activity.mode }}<br />
|
||||
Presented by: <span v-for="h in this_hosts">{{ h.name }}, </span><br />
|
||||
<br />
|
||||
<!--<div class="rhs_grey">{{this_activity.typeStr}}</div>-->
|
||||
<span v-html="this_activity.desc"></span>
|
||||
</div>
|
||||
<div v-if="this_hosts.length === 0" class="text-sm text-gray-500 italic">
|
||||
Add a host by typing below
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Host Add Input + Suggestions -->
|
||||
<div v-if="!creating">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-1">Add a host</label>
|
||||
<input
|
||||
type="text"
|
||||
id="addhost"
|
||||
name="addhost"
|
||||
v-model="host_search_str"
|
||||
@keyup="hostlookup"
|
||||
autocomplete="off"
|
||||
class="w-full rounded-md border border-gray-500 bg-white text-gray-900 shadow focus:border-blue-600 focus:ring focus:ring-blue-300 focus:ring-opacity-50 px-4 py-2 text-base mb-2"
|
||||
/>
|
||||
<div class="border rounded-md p-3 bg-gray-50 space-y-1">
|
||||
<div
|
||||
v-for="ho in host_search"
|
||||
:key="ho.id"
|
||||
class="flex items-center justify-between text-sm"
|
||||
>
|
||||
<span @click="add(ho.id)" class="cursor-pointer hover:underline">
|
||||
{{ ho.name }}
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
@click="add(ho.id)"
|
||||
class="text-blue-500 hover:text-blue-700 font-semibold"
|
||||
>
|
||||
+
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>` })
|
||||
<htfield_fa
|
||||
table="conf_sessions"
|
||||
qid="desc"
|
||||
question="Description"
|
||||
myclass="pell"
|
||||
:answer="this_activity.desc"
|
||||
:targetid="this_activity.id"
|
||||
/>
|
||||
|
||||
<selectmenu_fa
|
||||
table="conf_sessions"
|
||||
qid="type"
|
||||
:answer="this_activity.type"
|
||||
menu="sessiontypes_menu"
|
||||
:targetid="this_activity.id"
|
||||
question="Type"
|
||||
labelfield="type"
|
||||
/>
|
||||
|
||||
<selectmenu_fa
|
||||
v-if="this_activity.type === '101'"
|
||||
table="conf_sessions"
|
||||
qid="parent"
|
||||
:answer="this_activity.parent"
|
||||
menu="parents_menu"
|
||||
:targetid="this_activity.id"
|
||||
question="What flex day?"
|
||||
labelfield="title"
|
||||
/>
|
||||
|
||||
<field
|
||||
myclass="double"
|
||||
table="conf_sessions"
|
||||
qid="recording"
|
||||
:answer="this_activity.recording"
|
||||
:targetid="this_activity.id"
|
||||
question="Recording Link"
|
||||
placeholder=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="flex flex-col md:flex-row gap-4 bg-white rounded-md shadow p-4 mb-4">
|
||||
<!-- Left: Edit Button -->
|
||||
<div class="md:w-40 shrink-0">
|
||||
<a href="#" @click.prevent="editing = 1" class="text-sm text-blue-600 hover:underline font-medium">
|
||||
Edit
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Right: Session Info -->
|
||||
<div class="flex-grow text-sm text-gray-800">
|
||||
<p class="text-base font-semibold text-gray-900 mb-1">{{ this_activity.title }}</p>
|
||||
|
||||
<p class="text-gray-600 mb-1">
|
||||
{{ $root.$dj(this_activity.starttime).format('h:mma') }} /
|
||||
<span class="capitalize">{{ this_activity.mode }}</span>
|
||||
</p>
|
||||
|
||||
<p class="text-gray-600 mb-1">
|
||||
Presented by:
|
||||
<span v-for="(h, i) in this_hosts" :key="h.hostid">
|
||||
{{ h.name }}<span v-if="i < this_hosts.length - 1">, </span>
|
||||
</span>
|
||||
</p>
|
||||
|
||||
<div class="mt-2 text-gray-700" v-html="this_activity.desc"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>` })
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue